Further simplify Palette code: Directly link values to components, without a private values list, and improve values conversion.

This commit is contained in:
Jürg Lehni 2012-11-14 12:49:03 -08:00
parent 01c936e1b9
commit 4945a45a99
2 changed files with 13 additions and 31 deletions

View file

@ -54,12 +54,6 @@ var Component = this.Component = Base.extend(Callback, /** @lends Component# */{
DomElement.create(Base.each(this._options, function(option) {
this.push('option', { value: option, text: option });
}, []), this._inputItem);
},
value: function(value) {
DomElement.set(
DomElement.find('option[value="' + value + '"]', this._inputItem),
'selected', true);
}
}
},
@ -78,14 +72,10 @@ var Component = this.Component = Base.extend(Callback, /** @lends Component# */{
type: this._info.type,
events: {
change: function() {
var key = that._info.value;
if (typeof key === 'function')
key = null;
var value = DomElement.get(this, key || 'value');
if (that._info.number)
value = Base.toFloat(value);
that.setValue(
DomElement.get(this, that._info.value || 'value'));
if (fireChange) {
that.palette.fire('change', that, that.name, value);
that._palette.fire('change', that, that.name, value);
that.fire('change', value);
}
},
@ -134,12 +124,11 @@ var Component = this.Component = Base.extend(Callback, /** @lends Component# */{
},
setValue: function(value) {
var key = this._info.value;
if (typeof key === 'function')
key.call(this, value);
else
DomElement.set(this._inputItem, key || 'value', value);
this._value = value;
var key = this._info.value || 'value';
DomElement.set(this._inputItem, key, value);
// Read back and convert from input again, to make sure we're in sync
value = DomElement.get(this._inputItem, key);
this._value = this._info.number ? Base.toFloat(value) : value;
},
getRange: function() {

View file

@ -35,32 +35,25 @@ var Palette = this.Palette = Base.extend(Callback, /** @lends Palette# */{
component = components[name] = new Component(component);
}
this._element.appendChild(component._element);
component.palette = this;
component._palette = this;
// Make sure each component has an entry in values, so observers get
// installed further down.
if (values[name] === undefined)
values[name] = component.value;
}
// Now replace each entry in values with a getter / setters so we can
// observe change.
// Introduce a private _values list that actually keeps the values, and
// use change events to keep it up to date
var _values = {};
this.attach('change', function(component, name, value) {
_values[name] = value;
});
// directly link the value to the component and observe change.
this._values = Base.each(values, function(value, name) {
_values[name] = value;
var component = components[name];
Base.define(values, name, {
enumerable: true,
configurable: true,
writable: true,
get: function() {
return _values[name];
return component._value;
},
set: function(val) {
_values[name] = val;
components[name].setValue(val);
component.setValue(val);
}
});
});