From afee1ab975a69ec7fe785b1fdafff466e12120e3 Mon Sep 17 00:00:00 2001 From: Bruno Binet Date: Mon, 12 Aug 2013 12:59:47 +0200 Subject: [PATCH 1/3] Add VALUE_AS_NUMBER property to ol.dom.Input This should be used when one want to bind a number instead of a string. --- src/ol/dom/input.js | 40 ++++++++++++++++++++++++++++++++++++++++ 1 file changed, 40 insertions(+) diff --git a/src/ol/dom/input.js b/src/ol/dom/input.js index 6e697d877d..6cf01740f2 100644 --- a/src/ol/dom/input.js +++ b/src/ol/dom/input.js @@ -11,6 +11,7 @@ goog.require('ol.Object'); */ ol.dom.InputProperty = { VALUE: 'value', + VALUE_AS_NUMBER: 'valueAsNumber', CHECKED: 'checked' }; @@ -44,6 +45,9 @@ ol.dom.Input = function(target) { goog.events.listen(this, ol.Object.getChangeEventType(ol.dom.InputProperty.VALUE), this.handleValueChanged_, false, this); + goog.events.listen(this, + ol.Object.getChangeEventType(ol.dom.InputProperty.VALUE_AS_NUMBER), + this.handleValueAsNumberChanged_, false, this); goog.events.listen(this, ol.Object.getChangeEventType(ol.dom.InputProperty.CHECKED), this.handleCheckedChanged_, false, this); @@ -77,6 +81,19 @@ goog.exportProperty( ol.dom.Input.prototype.getValue); +/** + * Get the value of the input as a number. + * @return {number|null|undefined} input value as number. + */ +ol.dom.Input.prototype.getValueAsNumber = function() { + return /** @type {number} */ (this.get(ol.dom.InputProperty.VALUE_AS_NUMBER)); +}; +goog.exportProperty( + ol.dom.Input.prototype, + 'getValueAsNumber', + ol.dom.Input.prototype.getValueAsNumber); + + /** * Sets the value of the input. * @param {string} value Value. @@ -90,6 +107,19 @@ goog.exportProperty( ol.dom.Input.prototype.setValue); +/** + * Sets the number value of the input. + * @param {number} value Number value. + */ +ol.dom.Input.prototype.setValueAsNumber = function(value) { + this.set(ol.dom.InputProperty.VALUE_AS_NUMBER, value); +}; +goog.exportProperty( + ol.dom.Input.prototype, + 'setValueAsNumber', + ol.dom.Input.prototype.setValueAsNumber); + + /** * Set whether or not a checkbox is checked. * @param {boolean} checked Checked. @@ -111,6 +141,7 @@ ol.dom.Input.prototype.handleInputChanged_ = function() { this.setChecked(this.target_.checked); } else { this.setValue(this.target_.value); + this.setValueAsNumber(this.target_.valueAsNumber); } }; @@ -129,3 +160,12 @@ ol.dom.Input.prototype.handleCheckedChanged_ = function() { ol.dom.Input.prototype.handleValueChanged_ = function() { this.target_.value = this.getValue(); }; + + +/** + * @private + */ +ol.dom.Input.prototype.handleValueAsNumberChanged_ = function() { + // firefox raises an exception if this.target_.valueAsNumber is set instead + this.target_.value = this.getValueAsNumber(); +}; From 2dd6321c74a76f1022939337d43e28ae8133109a Mon Sep 17 00:00:00 2001 From: Bruno Binet Date: Mon, 12 Aug 2013 13:01:17 +0200 Subject: [PATCH 2/3] Fix bind-input example to use valueAsNumber --- examples/bind-input.js | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/examples/bind-input.js b/examples/bind-input.js index 586773a04b..416acbda66 100644 --- a/examples/bind-input.js +++ b/examples/bind-input.js @@ -22,23 +22,23 @@ var visible = new ol.dom.Input(document.getElementById('visible')); visible.bindTo('checked', layer, 'visible'); var opacity = new ol.dom.Input(document.getElementById('opacity')); -opacity.bindTo('value', layer, 'opacity'); +opacity.bindTo('valueAsNumber', layer, 'opacity'); var hue = new ol.dom.Input(document.getElementById('hue')); -hue.bindTo('value', layer, 'hue'); +hue.bindTo('valueAsNumber', layer, 'hue'); var saturation = new ol.dom.Input(document.getElementById('saturation')); -saturation.bindTo('value', layer, 'saturation'); +saturation.bindTo('valueAsNumber', layer, 'saturation'); var contrast = new ol.dom.Input(document.getElementById('contrast')); -contrast.bindTo('value', layer, 'contrast'); +contrast.bindTo('valueAsNumber', layer, 'contrast'); var brightness = new ol.dom.Input(document.getElementById('brightness')); -brightness.bindTo('value', layer, 'brightness'); +brightness.bindTo('valueAsNumber', layer, 'brightness'); var rotation = new ol.dom.Input(document.getElementById('rotation')); -rotation.bindTo('value', map.getView(), 'rotation'); +rotation.bindTo('valueAsNumber', map.getView(), 'rotation'); var resolution = new ol.dom.Input(document.getElementById('resolution')); -resolution.bindTo('value', map.getView(), 'resolution'); +resolution.bindTo('valueAsNumber', map.getView(), 'resolution'); From dddea56c2c88f5aa30c25515df1a969a377f41f4 Mon Sep 17 00:00:00 2001 From: Bruno Binet Date: Tue, 13 Aug 2013 11:25:27 +0200 Subject: [PATCH 3/3] Add a temporary html5 externs file This is needed because the current version of closure compiler we use does not include externs for valueAsNumber which we now use in ol.dom.Input. So this backports patch from issue: https://code.google.com/p/closure-compiler/issues/detail?id=1060 This patch should be reverted when the next closure compiler release is out with valueAsNumber externs. --- build.py | 1 + buildcfg/base.json | 3 ++- buildcfg/ol-all.json | 3 ++- buildcfg/ol-simple.json | 3 ++- buildcfg/ol-whitespace.json | 3 ++- buildcfg/ol.json | 3 ++- externs/html5.js | 17 +++++++++++++++++ 7 files changed, 28 insertions(+), 5 deletions(-) create mode 100644 externs/html5.js diff --git a/build.py b/build.py index 2852f83432..49f8b3791f 100755 --- a/build.py +++ b/build.py @@ -316,6 +316,7 @@ def examples_star_json(name, match): '../externs/oli.js', '../externs/proj4js.js', '../externs/tilejson.js', + '../externs/html5.js', ], }) with open(t.name, 'w') as f: diff --git a/buildcfg/base.json b/buildcfg/base.json index 4e3cb3da5a..6b645e49e7 100644 --- a/buildcfg/base.json +++ b/buildcfg/base.json @@ -45,7 +45,8 @@ "../externs/topojson.js", "../externs/oli.js", "../externs/proj4js.js", - "../externs/tilejson.js" + "../externs/tilejson.js", + "../externs/html5.js" ], "level": "VERBOSE", diff --git a/buildcfg/ol-all.json b/buildcfg/ol-all.json index 4d0e0b71b6..a808f0f797 100644 --- a/buildcfg/ol-all.json +++ b/buildcfg/ol-all.json @@ -10,7 +10,8 @@ "../externs/topojson.js", "../externs/oli.js", "../externs/proj4js.js", - "../externs/tilejson.js" + "../externs/tilejson.js", + "../externs/html5.js" ], "inherits": "base.json", diff --git a/buildcfg/ol-simple.json b/buildcfg/ol-simple.json index 94f409c4f0..d7e50b1552 100644 --- a/buildcfg/ol-simple.json +++ b/buildcfg/ol-simple.json @@ -19,7 +19,8 @@ "../externs/topojson.js", "../externs/oli.js", "../externs/proj4js.js", - "../externs/tilejson.js" + "../externs/tilejson.js", + "../externs/html5.js" ], "inherits": "ol.json", diff --git a/buildcfg/ol-whitespace.json b/buildcfg/ol-whitespace.json index 54cdbac634..4364a2769d 100644 --- a/buildcfg/ol-whitespace.json +++ b/buildcfg/ol-whitespace.json @@ -20,7 +20,8 @@ "../externs/topojson.js", "../externs/oli.js", "../externs/proj4js.js", - "../externs/tilejson.js" + "../externs/tilejson.js", + "../externs/html5.js" ], "inherits": "ol.json", diff --git a/buildcfg/ol.json b/buildcfg/ol.json index 7cf458f1d7..c64d3fbf0d 100644 --- a/buildcfg/ol.json +++ b/buildcfg/ol.json @@ -20,7 +20,8 @@ "../externs/topojson.js", "../externs/oli.js", "../externs/proj4js.js", - "../externs/tilejson.js" + "../externs/tilejson.js", + "../externs/html5.js" ], "inherits": "base.json", diff --git a/externs/html5.js b/externs/html5.js new file mode 100644 index 0000000000..bc8a63ad2f --- /dev/null +++ b/externs/html5.js @@ -0,0 +1,17 @@ +/** + * @fileoverview Definitions for extensions over the W3C's DOM3 specification + * in HTML5 which are not yet available with the current release version of + * the closure compiler we use. + * @see http://dev.w3.org/html5/spec/Overview.html + * @externs + */ + +// See issue https://code.google.com/p/closure-compiler/issues/detail?id=1060 +// FIXME: this should be remove when the next closure compiler release is out +// with valueAsDate and valueAsNumber externs. + +/** @type {Date} */ +HTMLInputElement.prototype.valueAsDate; + +/** @type {number} */ +HTMLInputElement.prototype.valueAsNumber;