59 lines
1.4 KiB
JavaScript
59 lines
1.4 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(event) {
|
|
self.selected = event.selected[0];
|
|
that.$element.replaceElement(1, self.options.content(self.selected));
|
|
that.triggerEvent('change', {
|
|
selected: self.selected
|
|
});
|
|
}
|
|
})
|
|
.appendTo(self.$bar);
|
|
|
|
that.$element = Ox.SplitPanel({
|
|
elements: [
|
|
{
|
|
element: self.$bar,
|
|
size: 24
|
|
},
|
|
{
|
|
element: self.options.content(self.selected)
|
|
}
|
|
],
|
|
orientation: 'vertical'
|
|
})
|
|
.addClass('OxTabPanel');
|
|
|
|
function getSelected() {
|
|
return self.options.tabs.filter(function(tab) {
|
|
return tab.selected;
|
|
})[0].id;
|
|
}
|
|
|
|
that.selected = function() {
|
|
return self.selected;
|
|
};
|
|
|
|
return that;
|
|
|
|
};
|