Remove 'valueAsNumber' property from ol.dom.Input

Use bindTo.transform functions instead

examples/bind-input.js

@@ -36,23 +36,30 @@ 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('valueAsNumber', layer, 'opacity');
+opacity.bindTo('value', layer, 'opacity')
+    .transform(parseFloat, String);
 
 var hue = new ol.dom.Input(document.getElementById('hue'));
-hue.bindTo('valueAsNumber', layer, 'hue');
+hue.bindTo('value', layer, 'hue')
+    .transform(parseFloat, String);
 
 var saturation = new ol.dom.Input(document.getElementById('saturation'));
-saturation.bindTo('valueAsNumber', layer, 'saturation');
+saturation.bindTo('value', layer, 'saturation')
+    .transform(parseFloat, String);
 
 var contrast = new ol.dom.Input(document.getElementById('contrast'));
-contrast.bindTo('valueAsNumber', layer, 'contrast');
+contrast.bindTo('value', layer, 'contrast')
+    .transform(parseFloat, String);
 
 var brightness = new ol.dom.Input(document.getElementById('brightness'));
-brightness.bindTo('valueAsNumber', layer, 'brightness');
+brightness.bindTo('value', layer, 'brightness')
+    .transform(parseFloat, String);
 
 
 var rotation = new ol.dom.Input(document.getElementById('rotation'));
-rotation.bindTo('valueAsNumber', map.getView(), 'rotation');
+rotation.bindTo('value', map.getView(), 'rotation')
+    .transform(parseFloat, String);
 
 var resolution = new ol.dom.Input(document.getElementById('resolution'));
-resolution.bindTo('valueAsNumber', map.getView(), 'resolution');
+resolution.bindTo('value', map.getView(), 'resolution')
+    .transform(parseFloat, String);

examples/layer-group.js

@@ -45,7 +45,8 @@ function bindInputs(layerid, layer) {
   $.each(['opacity', 'hue', 'saturation', 'contrast', 'brightness'],
       function(i, v) {
         new ol.dom.Input($(layerid + ' .' + v)[0])
-            .bindTo('valueAsNumber', layer, v);
+            .bindTo('value', layer, v)
+            .transform(parseFloat, String);
       }
   );
 }

src/ol/dom/input.js

@@ -11,7 +11,6 @@ goog.require('ol.Object');
  */
 ol.dom.InputProperty = {
   VALUE: 'value',
-  VALUE_AS_NUMBER: 'valueAsNumber',
   CHECKED: 'checked'
 };
 
@@ -50,9 +49,6 @@ 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);
@@ -88,20 +84,6 @@ goog.exportProperty(
     ol.dom.Input.prototype.getValue);
 
 
-/**
- * Get the value of the input as a number.
- * @return {number|null|undefined} input value as number.
- * @todo stability experimental
- */
-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.
@@ -116,20 +98,6 @@ goog.exportProperty(
     ol.dom.Input.prototype.setValue);
 
 
-/**
- * Sets the number value of the input.
- * @param {number} value Number value.
- * @todo stability experimental
- */
-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.
@@ -152,10 +120,6 @@ ol.dom.Input.prototype.handleInputChanged_ = function() {
     this.setChecked(this.target_.checked);
   } else {
     this.setValue(this.target_.value);
-    var number = this.target_.valueAsNumber;
-    if (goog.isDef(number) && !isNaN(number)) {
-      this.setValueAsNumber(number);
-    }
   }
 };
 
@@ -174,12 +138,3 @@ 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();
-};