oxjs/source/Ox.UI/js/Panel/Ox.TabPanel.js
2011-12-21 21:03:52 +05:30

69 lines
1.6 KiB
JavaScript

// vim: et:ts=4:sw=4:sts=4:ft=javascript
'use strict';
Ox.TabPanel = function(options, self) {
self = self || {};
var that = Ox.Element({}, self)
.defaults({
content: null,
tabs: []
})
.options(options || {});
self.selected = getSelected();
self.$bar = Ox.Bar({size: 24});
self.$tabs = Ox.ButtonGroup({
buttons: self.options.tabs,
id: 'tabs',
selectable: true,
})
.bindEvent({
change: function(data) {
self.selected = data.value;
that.$element.replaceElement(1, getContent());
that.triggerEvent('change', {selected: self.selected});
}
})
.appendTo(self.$bar);
that.$element = Ox.SplitPanel({
elements: [
{
element: self.$bar,
size: 24
},
{
element: getContent()
}
],
orientation: 'vertical'
})
.addClass('OxTabPanel');
function getContent() {
return Ox.isObject(self.options.content)
? self.options.content[self.selected]
: self.options.content(self.selected);
}
function getSelected() {
return self.options.tabs.filter(function(tab) {
return tab.selected;
})[0].id;
}
that.select = function(id) {
if (Ox.getPositionById(self.options.tabs, id) > -1) {
self.$tabs.select(id);
}
};
that.selected = function() {
return self.selected;
};
return that;
};