118 lines
3.5 KiB
JavaScript
118 lines
3.5 KiB
JavaScript
//vim: et:ts=4:sw=4:sts=4:ft=js
|
|
Ox.MenuItem = function(options, self) {
|
|
|
|
var self = self || {},
|
|
that = new Ox.Element('tr', self)
|
|
.defaults({
|
|
bind: [], // fixme: what's this?
|
|
checked: null,
|
|
disabled: false,
|
|
group: '',
|
|
icon: '',
|
|
id: '',
|
|
items: [],
|
|
keyboard: '',
|
|
menu: null, // fixme: is passing the menu to 100s of menu items really memory-neutral?
|
|
position: 0,
|
|
title: [],
|
|
})
|
|
.options($.extend(options, {
|
|
keyboard: parseKeyboard(options.keyboard || self.defaults.keyboard),
|
|
title: Ox.toArray(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;
|
|
}
|
|
|
|
// construct
|
|
that.append(
|
|
that.$status = $('<td>', {
|
|
'class': 'OxCell OxStatus',
|
|
html: self.options.checked ? Ox.UI.symbols.check : ''
|
|
})
|
|
)
|
|
.append(
|
|
that.$icon = $('<td>', {
|
|
'class': 'OxCell OxIcon'
|
|
})
|
|
.append(self.options.icon ?
|
|
$('<img>', {
|
|
src: self.options.icon
|
|
}) : null
|
|
)
|
|
)
|
|
.append(
|
|
that.$title = $('<td>', {
|
|
'class': 'OxCell OxTitle',
|
|
html: self.options.title[0]
|
|
})
|
|
)
|
|
.append(
|
|
$('<td>', {
|
|
'class': 'OxCell OxModifiers',
|
|
html: $.map(self.options.keyboard.modifiers, function(modifier) {
|
|
return Ox.UI.symbols[modifier];
|
|
}).join('')
|
|
})
|
|
)
|
|
.append(
|
|
$('<td>', {
|
|
'class': '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
|
|
};
|
|
}
|
|
|
|
self.onChange = function(key, value) {
|
|
if (key == 'checked') {
|
|
that.$status.html(value ? Ox.UI.symbols.check : '')
|
|
} else if (key == 'disabled') {
|
|
that.toggleClass('OxDisabled'); // fixme: this will only work if onChange is only invoked on actual change
|
|
} else if (key == 'title') {
|
|
self.options.title = Ox.toArray(value);
|
|
that.$title.html(self.options.title[0]);
|
|
}
|
|
}
|
|
|
|
that.toggle = function() {
|
|
// toggle id and title
|
|
};
|
|
|
|
that.toggleChecked = function() {
|
|
that.options({
|
|
checked: !self.options.checked
|
|
});
|
|
};
|
|
|
|
that.toggleDisabled = function() {
|
|
|
|
};
|
|
|
|
that.toggleTitle = function() {
|
|
//Ox.print('s.o.t', self.options.title)
|
|
that.options({
|
|
title: self.options.title.reverse()
|
|
});
|
|
};
|
|
|
|
return that;
|
|
|
|
};
|