167 lines
5.1 KiB
JavaScript
167 lines
5.1 KiB
JavaScript
'use strict';
|
|
|
|
/*@
|
|
Ox.MenuItem <f:Ox.Element> MenuItem Object
|
|
([options[, self]]) -> <o> MenuItem Object
|
|
options <o> Options object
|
|
bind <a|[]> fixme: what's this?
|
|
checked <f|null>
|
|
disabled <b|false>
|
|
group <s|''>
|
|
icon <s|''> icon
|
|
id <s|''> id
|
|
items <a|[]> items
|
|
keyboard <s|''> keyboard
|
|
menu <o|null> menu
|
|
position <n|0> position
|
|
title <a|[]> title
|
|
self <o> shared private variable
|
|
@*/
|
|
|
|
Ox.MenuItem = function(options, self) {
|
|
|
|
self = self || {};
|
|
var that = Ox.Element('<tr>', self)
|
|
.defaults({
|
|
bind: [], // fixme: what's this?
|
|
checked: null,
|
|
disabled: false,
|
|
group: '',
|
|
icon: '',
|
|
id: '',
|
|
items: [],
|
|
keyboard: '',
|
|
maxWidth: 0,
|
|
menu: null, // fixme: is passing the menu to 100s of menu items really memory-neutral?
|
|
position: 0,
|
|
title: [],
|
|
type: ''
|
|
})
|
|
.options(Ox.extend(Ox.clone(options), {
|
|
keyboard: parseKeyboard(options.keyboard || self.defaults.keyboard),
|
|
title: Ox.makeArray(options.title || self.defaults.title)
|
|
}))
|
|
.addClass('OxItem' + (self.options.disabled ? ' OxDisabled' : ''))
|
|
/*
|
|
.attr({
|
|
id: Ox.toCamelCase(self.options.menu.options('id') + '/' + self.options.id)
|
|
})
|
|
*/
|
|
.data('group', self.options.group); // fixme: why?
|
|
|
|
if (self.options.group && self.options.checked === null) {
|
|
self.options.checked = false;
|
|
}
|
|
|
|
that.append(
|
|
that.$status = $('<td>')
|
|
.addClass('OxCell OxStatus')
|
|
.html(self.options.checked ? Ox.UI.symbols.check : '')
|
|
)
|
|
.append(
|
|
that.$icon = $('<td>')
|
|
.addClass('OxCell OxIcon')
|
|
.append(
|
|
self.options.icon
|
|
? $('<img>').attr({src: self.options.icon})
|
|
: null
|
|
)
|
|
)
|
|
.append(
|
|
that.$title = $('<td>')
|
|
.addClass('OxCell OxTitle')
|
|
.css(
|
|
self.options.maxWidth
|
|
? {maxWidth: self.options.maxWidth - 46}
|
|
: {}
|
|
)
|
|
.html(
|
|
self.options.file
|
|
?
|
|
that.$button = Ox.FileButton(Ox.extend(Ox.clone(self.options.file), {
|
|
title: self.options.title[0],
|
|
width: self.options.file.width
|
|
})).bindEvent({
|
|
click: function(data) {
|
|
self.options.menu.clickItem(self.options.position, data.files);
|
|
}
|
|
})
|
|
: (
|
|
Ox.isString(self.options.title[0])
|
|
? self.options.title[0]
|
|
: $('<div>').html(self.options.title[0]).html()
|
|
)
|
|
)
|
|
)
|
|
.append(
|
|
that.$modifiers = $('<td>')
|
|
.addClass('OxCell OxModifiers')
|
|
.html(
|
|
self.options.keyboard.modifiers.map(function(modifier) {
|
|
return Ox.UI.symbols[modifier];
|
|
}).join('')
|
|
)
|
|
)
|
|
.append(
|
|
that.$key = $('<td>')
|
|
.addClass(
|
|
'OxCell Ox' + (self.options.items.length ? 'Submenu' : 'Key')
|
|
)
|
|
.html(
|
|
self.options.items.length
|
|
? Ox.UI.symbols.triangle_right
|
|
: Ox.UI.symbols[self.options.keyboard.key]
|
|
|| self.options.keyboard.key.toUpperCase()
|
|
)
|
|
);
|
|
|
|
function parseKeyboard(str) {
|
|
var modifiers = str.split(' '),
|
|
key = modifiers.pop();
|
|
return {
|
|
modifiers: modifiers,
|
|
key: key
|
|
};
|
|
}
|
|
|
|
/*@
|
|
setOption <f> setOption
|
|
@*/
|
|
self.setOption = function(key, value) {
|
|
if (key == 'checked') {
|
|
that.$status.html(value ? Ox.UI.symbols.check : '')
|
|
} else if (key == 'disabled') {
|
|
that.toggleClass('OxDisabled');
|
|
} else if (key == 'title') {
|
|
self.options.title = Ox.makeArray(value);
|
|
that.$title.html(self.options.title[0]);
|
|
}
|
|
};
|
|
|
|
that.toggle = function() {
|
|
// toggle id and title
|
|
};
|
|
|
|
/*@
|
|
toggleChecked <f> toggleChecked
|
|
@*/
|
|
that.toggleChecked = function() {
|
|
that.options({checked: !self.options.checked});
|
|
return that;
|
|
};
|
|
|
|
that.toggleDisabled = function() {
|
|
|
|
};
|
|
|
|
/*@
|
|
toggleTitle <f> toggleTitle
|
|
@*/
|
|
that.toggleTitle = function() {
|
|
that.options({title: Ox.clone(self.options.title).reverse()});
|
|
return that;
|
|
};
|
|
|
|
return that;
|
|
|
|
};
|