0x2620/oxjs
2
0
Fork 2
Code Issues 172 Pull requests Releases Wiki 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

51
source/Ox.UI/js/Form/Ox.CheckboxGroup.js
View file

@ -1,5 +1,7 @@
// vim: et:ts=4:sw=4:sts=4:ft=javascript
'use strict';
/*@
Ox.CheckboxGroup <f:Ox.Element> CheckboxGroup Object
() -> <f> CheckboxGroup Object
@ -13,7 +15,7 @@ Ox.CheckboxGroup <f:Ox.Element> CheckboxGroup Object
width <n> width in px
self <o> shared private variable
change <!> triggered when checked property changes
passes {checked, id, title}
passes {id, title, value}
@*/
Ox.CheckboxGroup = function(options, self) {
@ -26,15 +28,25 @@ Ox.CheckboxGroup = function(options, self) {
max: 1,
min: 1,
type: 'group',
value: options.max != 1 ? [] : '',
width: 256
})
.options(options || {})
.addClass('OxCheckboxGroup Ox' + Ox.toTitleCase(self.options.type));
self.options.checkboxes = self.options.checkboxes.map(function(checkbox) {
return {
checked: Ox.toArray(self.options.value).indexOf(checkbox.id || checkbox) > -1,
id: checkbox.id || checkbox,
title: checkbox.title || checkbox
};
});
self.optionGroup = new Ox.OptionGroup(
self.options.checkboxes,
self.options.min,
self.options.max
self.options.max,
'checked'
);
self.options.checkboxes = self.optionGroup.init();
@ -48,37 +60,44 @@ Ox.CheckboxGroup = function(options, self) {
});
};
self.options.checkboxes.forEach(function(checkbox, index) {
self.$checkboxes[index] = Ox.Checkbox(Ox.extend(checkbox, {
self.options.checkboxes.forEach(function(checkbox, pos) {
self.$checkboxes[pos] = Ox.Checkbox(Ox.extend(checkbox, {
group: true,
id: checkbox.id,
width: self.options.type == 'group'
? self.checkboxWidth[index] : self.options.width
? self.checkboxWidth[pos] : self.options.width,
value: checkbox.checked
}))
.bindEvent('change', function() {
change(index);
toggleCheckbox(pos);
})
.appendTo(that);
});
function change(index) {
var toggled = self.optionGroup.toggle(index);
//Ox.Log('Form', 'change', index, 'toggled', toggled)
if (toggled.length) {
toggled.forEach(function(index, i) {
self.$checkboxes[index].toggleChecked();
function toggleCheckbox(pos) {
var toggled = self.optionGroup.toggle(pos);
Ox.Log('Form', 'change', pos, 'toggled', toggled)
if (!toggled.length) {
self.$checkboxes[pos].options({
value: !self.$checkboxes[pos].options('value')
});
} else {
toggled.forEach(function(i) {
i != pos && self.$checkboxes[i].options({
// FIXME: fix and use that.toggleOption()
value: !self.$checkboxes[i].options('value')
});
});
self.options.value = self.optionGroup.value();
that.triggerEvent('change', {
checked: self.optionGroup.checked().map(function(v) {
return self.options.checkboxes[v].id;
})
value: self.options.value
});
}
}
that.value = function() {
return self.options.checkboxes.filter(function(checkbox) {
return checkbox.checked;
return checkbox.value;
}).map(function(checkbox) {
return checkbox.id;
});