Port sky-drawer to Dart

sky/examples/appish/example-scaffold.sky

Index: sky/examples/appish/example-scaffold.sky
diff --git a/sky/examples/example-scaffold.sky b/sky/examples/appish/example-scaffold.sky
similarity index 72%
rename from sky/examples/example-scaffold.sky
rename to sky/examples/appish/example-scaffold.sky
index 553d1c7e01ce3c4f1c1c405e2314ad0c7b1c4c62..0d810ccbe266b6055c3d3e73ac5a9a525e368d4a 100644
--- a/sky/examples/example-scaffold.sky
+++ b/sky/examples/appish/example-scaffold.sky
@@ -4,10 +4,10 @@
 // found in the LICENSE file.
 -->
 <import src="/sky/framework/sky-drawer.sky" />
-<import src="/sky/framework/sky-element/sky-element.sky" as="SkyElement" />
+<import src="/sky/framework/sky-element.sky" />
 <import src="/sky/framework/sky-scrollable.sky" />
 
-<sky-element name="example-scaffold">
+<sky-element>
 <template>
   <style>
     :host {
@@ -54,7 +54,7 @@
     <content select=".menu"/>
   </sky-drawer>
   <sky-toolbar>
-    <div id="menu" on-click="handleMenuClick"/>
+    <div id="menu" />
     <content id="title" select=".title"/>
   </sky-toolbar>
   <sky-scrollable>
@@ -62,18 +62,23 @@
   </sky-scrollable>
 </template>
 <script>
-module.exports = class extends SkyElement {
-  created() {
-    this.toolbar_ = null;
-  }
+import "dart:sky";
+
+@Tagname('example-scaffold')
+class ExampleScaffold extends SkyElement {
+  Element _drawer;
 
-  shadowRootReady() {
-    this.toolbar_ = this.shadowRoot.getElementById('drawer');
+  void shadowRootReady() {
+    _drawer = shadowRoot.getElementById('drawer');
+    Element menu = shadowRoot.getElementById('menu');
+    menu.addEventListener('click', _handleMenuClick);
   }
 
-  handleMenuClick() {
-    this.toolbar_.toggle();
+  void _handleMenuClick(_) {
+    _drawer.toggle();
   }
-}.register();
+}
+
+_init(script) => register(script, ExampleScaffold);
 </script>
 </sky-element>