[package:mdv] Support binding to HTMLSelectElement.selectedIndex

pkg/mdv/lib/src/input_element.dart

Index: pkg/mdv/lib/src/input_element.dart
diff --git a/pkg/mdv/lib/src/input_element.dart b/pkg/mdv/lib/src/input_element.dart
index 32b98341de102047c2158d3bb43352be79b3ac3e..400699cb44e936f85efd698cbe0f3660240189b5 100644
--- a/pkg/mdv/lib/src/input_element.dart
+++ b/pkg/mdv/lib/src/input_element.dart
@@ -58,3 +58,78 @@ class _InputElementExtension extends _ElementExtension {
     super.unbindAll();
   }
 }
+
+class _ValueBinding extends _InputBinding {

[Jennifer Messerly, 2013/06/27 23:59:48]

these moved from
https://codereview.chromium.org/18117012/diff/2001/pkg/mdv/lib/src/bindings.dart

+  _ValueBinding(element, model, path) : super(element, model, path);
+
+  InputElement get element => super.element;
+
+  void valueChanged(value) {
+    element.value = value == null ? '' : '$value';
+  }
+
+  void updateBinding(e) {
+    binding.value = element.value;
+  }
+}
+
+class _CheckedBinding extends _InputBinding {
+  _CheckedBinding(element, model, path) : super(element, model, path);
+
+  InputElement get element => super.element;
+
+  void valueChanged(value) {
+    element.checked = _Bindings._toBoolean(value);
+  }
+
+  void updateBinding(e) {
+    binding.value = element.checked;
+
+    // Only the radio button that is getting checked gets an event. We
+    // therefore find all the associated radio buttons and update their
+    // CheckedBinding manually.
+    if (element is InputElement && element.type == 'radio') {
+      for (var r in _getAssociatedRadioButtons(element)) {
+        var checkedBinding = _mdv(r)._checkedBinding;
+        if (checkedBinding != null) {
+          // Set the value directly to avoid an infinite call stack.
+          checkedBinding.binding.value = false;
+        }
+      }
+    }
+  }
+
+  // |element| is assumed to be an HTMLInputElement with |type| == 'radio'.
+  // Returns an array containing all radio buttons other than |element| that
+  // have the same |name|, either in the form that |element| belongs to or,
+  // if no form, in the document tree to which |element| belongs.
+  //
+  // This implementation is based upon the HTML spec definition of a
+  // "radio button group":
+  //   http://www.whatwg.org/specs/web-apps/current-work/multipage/number-state.html#radio-button-group
+  //
+  static Iterable _getAssociatedRadioButtons(element) {
+    if (!_isNodeInDocument(element)) return [];
+    if (element.form != null) {
+      return element.form.nodes.where((el) {
+        return el != element &&
+            el is InputElement &&
+            el.type == 'radio' &&
+            el.name == element.name;
+      });
+    } else {
+      var radios = element.document.queryAll(
+          'input[type="radio"][name="${element.name}"]');
+      return radios.where((el) => el != element && el.form == null);
+    }
+  }
+
+  // TODO(jmesserly): polyfill document.contains API instead of doing it here
+  static bool _isNodeInDocument(Node node) {
+    // On non-IE this works:
+    // return node.document.contains(node);
+    var document = node.document;
+    if (node == document || node.parentNode == document) return true;
+    return document.documentElement.contains(node);
+  }
+}