fix #136, support watch exprs and two way bindings for component fields

lib/src/emitters.dart

Index: lib/src/emitters.dart
diff --git a/lib/src/emitters.dart b/lib/src/emitters.dart
index 279d93de35a5276ecd00f0d428f12ed3c59b0e9a..1c631666d402e657e03f2ddf39da46b4521dd90b 100644
--- a/lib/src/emitters.dart
+++ b/lib/src/emitters.dart
@@ -182,7 +182,7 @@ class ContentFieldEmitter extends Emitter<TextInfo> {
 
   void emitCreated(Context context) {
     context.createdMethod.add(
-        '${info.identifier} = autogenerated.nodeForBinding(${info.binding});');
+        "${info.identifier} = new autogenerated.Text('');");
   }
 
   void emitRemoved(Context context) {
@@ -326,15 +326,21 @@ class AttributeEmitter extends DataBindingEmitter<ElementInfo> {
   void _emitSimpleAttributeInserted(
       String stoppers, String name, AttributeInfo attr, CodePrinter printer) {
     var binding = attr.boundValue;
-    var setter = _findDomSetter(info.node, name);
+    var field = _findDomField(info, name);
     printer.add('$stoppers.add(autogenerated.watchAndInvoke(() => $binding, '
-        '(__e) { ${info.identifier}.$setter = __e.newValue; }));');
+        '(__e) { ${info.identifier}.$field = __e.newValue; }));');
+
+    if (attr.customTwoWayBinding) {
+      printer.add('$stoppers.add(autogenerated.watchAndInvoke(')
+             .add('() => ${info.identifier}.$field, ')
+             .add('(__e) { $binding = __e.newValue; }));');
+    }
   }
 
   void _emitTextAttributeInserted(
       String stoppers, String name, AttributeInfo attr, CodePrinter printer) {
     var textContent = attr.textContent.map(escapeDartString);
-    var setter = _findDomSetter(info.node, name);
+    var setter = _findDomField(info, name);
     var content = new StringBuffer();
     var binding;
     if (attr.bindings.length == 1) {
@@ -389,13 +395,6 @@ class ContentDataBindingEmitter extends DataBindingEmitter<TextInfo> {
  *
  * This will ensure that the Dart HelloComponent for `x-hello` is created and
  * attached to the appropriate DOM node.
- *
- * Also, this copies values from the scope into the object at component creation
- * time, for example:
- *
- *     <x-foo data-value="bar:baz">
- *
- * This will set the "bar" property of FooComponent to be "baz".
  */
 class ComponentInstanceEmitter extends Emitter<ElementInfo> {
   ComponentInstanceEmitter(ElementInfo info) : super(info);
@@ -405,16 +404,16 @@ class ComponentInstanceEmitter extends Emitter<ElementInfo> {
     if (component == null) return;
 
     var id = info.identifier;
-    context.createdMethod.add(
-        'var component$id = new ${component.constructor}.forElement($id);');
+    context.createdMethod.add('new ${component.constructor}.forElement($id)');
 
+    // Note: this feature is deprecated and will be removed.
     info.values.forEach((name, value) {
-      context.createdMethod.add('component$id.$name = $value;');
+      context.createdMethod.add('..$name = $value');
     });
 
-    context.createdMethod.add('component$id.created_autogenerated();')
-                         .add('component$id.created();')
-                         .add('component$id.composeChildren();');
+    context.createdMethod.add('..created_autogenerated()')
+                         .add('..created()')
+                         .add('..composeChildren();');
   }
 
   void emitInserted(Context context) {
@@ -423,16 +422,16 @@ class ComponentInstanceEmitter extends Emitter<ElementInfo> {
     // Note: watchers are intentionally hooked up after inserted() has run,
     // in case it makes any changes to the data.
     var id = info.identifier;
-    context.insertedMethod.add('$id.xtag.inserted();')
-                          .add('$id.xtag.inserted_autogenerated();');
+    context.insertedMethod.add('$id.xtag..inserted()')
+                          .add('..inserted_autogenerated();');
   }
 
   void emitRemoved(Context context) {
     if (info.component == null) return;
 
     var id = info.identifier;
-    context.removedMethod.add('$id.xtag.removed_autogenerated();')
-                         .add('$id.xtag.removed();');
+    context.removedMethod.add('$id.xtag..removed_autogenerated()')
+                         .add('..removed();');
   }
 }
 
@@ -918,16 +917,20 @@ String _emitCreateHtml(Node node) {
  * Otherwise changes will not be applied. This is most easily observed with
  * "InputElement.value", ".checked", etc.
  */
-String _findDomSetter(Element node, String name) {
-  var typeName = typeForHtmlTag(node.tagName);
+String _findDomField(ElementInfo info, String name) {
+  var typeName = typeForHtmlTag(info.baseTagName);
   while (typeName != null) {
     var fields = htmlElementFields[typeName];
     if (fields != null) {
-      var setter = fields[name];
-      if (setter != null) return setter;
+      var field = fields[name];
+      if (field != null) return field;
     }
     typeName = htmlElementExtends[typeName];
   }
-  // If we didn't find a DOM setter, use the attributes map instead.
-  return 'attributes["$name"]';
+  // If we didn't find a DOM setter, and this is a component, set a property on
+  // the component.
+  if (info.component != null && !name.startsWith('data-')) {
+    return 'xtag.$name';
+  }
+  return "attributes['$name']";
 }