eventController interop with polymer.js

pkg/polymer/lib/src/instance.dart

 // Copyright (c) 2013, the Dart project authors.  Please see the AUTHORS file
 // for details. All rights reserved. Use of this source code is governed by a
 // BSD-style license that can be found in the LICENSE file.
 
 part of polymer;
 
 /// Use this annotation to publish a field as an attribute.
 ///
 /// You can also use [PublishedProperty] to provide additional information,
 /// such as automatically syncing the property back to the attribute.
@@ skipping 164 matching lines @@
 
   Map<String, StreamSubscription> _namedObservers;
   List<Iterable<Bindable>> _observers = [];
 
   bool _unbound; // lazy-initialized
   PolymerJob _unbindAllJob;
 
   CompoundObserver _propertyObserver;
   bool _readied = false;
 
+  JsObject _jsElem;
+
   /// Returns the object that should be used as the event controller for
   /// event bindings in this element's template. If set, this will override the
   /// normal controller lookup.
-  // TODO(jmesserly): type seems wrong here? I'm guessing this should be any
-  // kind of model object. Also, should it be writable by anyone?
-  Polymer eventController;
+  // TODO(jmesserly): we need to use a JS-writable property as our backing
+  // store, because of elements such as:
+  // https://github.com/Polymer/core-overlay/blob/eeb14853/core-overlay-layer.html#L78
+  get eventController => _jsElem['eventController'];
+  set eventController(value) { _jsElem['eventController'] = value; }

[Siggi Cherem (dart-lang), 2014/06/18 01:51:42]

woah!

Should we add the type annotation here? Mainly I'm wondering about what the old
comment used to say.

[Jennifer Messerly, 2014/06/18 02:18:47]

Hmmm. We could put back Element, which is what PolymerEventBindings will
type-assert. But I removed it to address that TODO :). Ultimately any kind of
model should be allowed, not just a custom element, although that limitation is
convenient at the moment since it means it's serializable to JS.

Generally though, I'm finding dynamic works better with interop-y code. Might as
well take advantage of optional types where they make sense.

 
   bool get hasBeenAttached => _hasBeenAttached;
   bool _hasBeenAttached = false;
 
   /// Gets the shadow root associated with the corresponding custom element.
   ///
   /// This is identical to [shadowRoot], unless there are multiple levels of
   /// inheritance and they each have their own shadow root. For example,
   /// this can happen if the base class and subclass both have `<template>` tags
   /// in their `<polymer-element>` tags.
@@ skipping 55 matching lines @@
 
   /// *Deprecated* use [shadowRoots] instead.
   @deprecated
   ShadowRoot getShadowRoot(String customTagName) => shadowRoots[customTagName];
 
   void prepareElement() {
     if (_elementPrepared) {
       window.console.warn('Element already prepared: $_name');
       return;
     }
+    _initJsObject();
     // Dart note: get the corresponding <polymer-element> declaration.
     _element = _getDeclaration(_name);
     // install property storage
     createPropertyObserver();
     // TODO (sorvell): temporarily open observer when created
     openPropertyObserver();
     // install boilerplate attributes
     copyInstanceAttributes();
     // process input attributes
     takeAttributes();
     // add event listeners
     addHostListeners();
   }
 
+  /// Initialize JS interop for this element. For now we just initialize the
+  // JsObject, but in the future we could also initialize JS APIs here.
+  _initJsObject() {
+    _jsElem = new JsObject.fromBrowserObject(this);
+  }
+
   makeElementReady() {
     if (_readied) return;
     _readied = true;
 
     // TODO(sorvell): We could create an entry point here
     // for the user to compute property values.
     // process declarative resources
     parseDeclarations(_element);
     // TODO(sorvell): CE polyfill uses unresolved attribute to simulate
     // :unresolved; remove this attribute to be compatible with native
@@ skipping 827 matching lines @@
 
 final Logger _observeLog = new Logger('polymer.observe');
 final Logger _eventsLog = new Logger('polymer.events');
 final Logger _unbindLog = new Logger('polymer.unbind');
 final Logger _bindLog = new Logger('polymer.bind');
 
 final Expando _eventHandledTable = new Expando<Set<Node>>();
 
 final JsObject _PolymerGestures = js.context['PolymerGestures'];