sanj/oxjs
1
0
Fork 0
forked from 0x2620/oxjs
Code Pull requests Activity

form elements rewrite, part 1

Browse source
This commit is contained in:
rlx 2011-12-21 13:42:47 +00:00
commit 7f83cd3141
30 changed files with 1061 additions and 958 deletions
Download patch file Download diff file Expand all files Collapse all files

59
source/Ox.UI/js/Form/Ox.ButtonGroup.js
View file

@ -27,10 +27,20 @@ Ox.ButtonGroup = function(options, self) {
size: 'medium',
style: '',
type: 'text',
value: options.max != 1 ? [] : ''
})
.options(options || {})
.addClass('OxButtonGroup');
self.options.buttons = self.options.buttons.map(function(button) {
return Ox.extend({
id: button.id || button,
title: button.title || button
}, self.options.selectable ? {
selected: Ox.toArray(self.options.value).indexOf(button.id || button) > -1
} : {});
});
if (self.options.selectable) {
self.optionGroup = new Ox.OptionGroup(
self.options.buttons,
@ -39,58 +49,51 @@ Ox.ButtonGroup = function(options, self) {
'selected'
);
self.options.buttons = self.optionGroup.init();
self.options.value = self.optionGroup.value();
}
self.$buttons = [];
self.options.buttons.forEach(function(button, position) {
self.options.buttons.forEach(function(button, pos) {
var id = self.options.id + Ox.toTitleCase(button.id)
self.$buttons[position] = Ox.Button({
self.$buttons[pos] = Ox.Button({
disabled: button.disabled,
group: true,
id: id,
selectable: self.options.selectable,
selected: button.selected,
size: self.options.size,
style: self.options.style,
title: button.title,
tooltip: button.tooltip,
type: self.options.type
type: self.options.type,
value: button.selected
})
.bindEvent('select', function() {
selectButton(position);
.bindEvent('change', function() {
self.options.selectable && toggleButton(pos);
})
.appendTo(that);
});
function selectButton(pos) {
function toggleButton(pos) {
var toggled = self.optionGroup.toggle(pos);
if (toggled.length) {
toggled.forEach(function(pos) {
self.$buttons[pos].toggleSelected();
Ox.print('TOGGLED::', toggled)
if (!toggled.length) {
self.$buttons[pos].options({
value: !self.$buttons[pos].options('value')
});
} else {
toggled.forEach(function(i) {
i != pos && self.$buttons[i].options({
// FIXME: fix and use that.toggleOption()
value: !self.$buttons[i].options('value')
});
});
self.options.value = self.optionGroup.value();
that.triggerEvent('change', {
selected: self.optionGroup.selected().map(function(i) {
return self.options.buttons[i].id;
})
value: self.options.value
});
}
}
that.select = function(id) {
// fixme: this doesn't work in cases where
// multiple buttons can be selected
var position = Ox.getPositionById(self.options.buttons, id);
if (position > -1) {
self.$buttons[position].trigger('click');
}
};
that.value = function() {
return self.optionGroup.selected().map(function(i) {
return self.options.buttons[i].id;
});
};
return that;
};