mirror of
https://github.com/scratchfoundation/paper.js.git
synced 2025-01-04 03:45:58 -05:00
Further simplify Palette code: Directly link values to components, without a private values list, and improve values conversion.
This commit is contained in:
parent
01c936e1b9
commit
4945a45a99
2 changed files with 13 additions and 31 deletions
|
@ -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() {
|
||||
|
|
|
@ -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);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
|
Loading…
Reference in a new issue