Updates to Polymer 0.8.5. Fixed route issue

Updates to reflect changes in Polymer 0.8.5. Fixed an issue with Route crashing due when first launching. * Would crash because it could not find URL ending in #... * Update was to add second URL without the hash and an empty handler
butlermatt · Oct 23, 2013 · fe89f01 · fe89f01
1 parent 5428930
commit fe89f01
Show file tree

Hide file tree

Showing 6 changed files with 29 additions and 9 deletions.
diff --git a/pubspec.yaml b/pubspec.yaml
@@ -3,5 +3,6 @@ version: 0.0.1
 author: Matthew Butler
 description: A sample Polymer application using routes.
 dependencies:
+  browser: any
   polymer: any
   route: any
diff --git a/web/example_app.dart b/web/example_app.dart
@@ -7,6 +7,9 @@ import 'dart:html';
 class ExampleApp extends PolymerElement {
   @published String page = '';
 
+  // Required now for all Polymer Elements.
+  ExampleApp.created() : super.created();
+
   // Triggered by the on-click event on the buttons.
   void updatePage(Event e, var detail, Node node) {
     // Get the data-name value from the element
@@ -60,7 +63,7 @@ class ExampleApp extends PolymerElement {
   void _addElement(String elementName) {
     if(elementName == '') throw new ArgumentError('Must provide an element name');
 
-    var content = createElement(elementName);
+    var content = new Element.tag(elementName);
     print('elementName: $elementName Element: ${content.tagName}');
     if(content != null) {
       var container = $['container'];

diff --git a/web/one_element.html b/web/one_element.html
@@ -8,6 +8,10 @@ <h2>I'm Element One</h2>
   import 'package:polymer/polymer.dart';
 
   @CustomTag('one-element')
-  class OneElement extends PolymerElement {}
+  class OneElement extends PolymerElement {
+    // Now required for all Polymer Elements.
+    OneElement.created() : super.created();
+
+  }
   </script>
 </polymer-element>
diff --git a/web/routes_example.dart b/web/routes_example.dart
@@ -1,17 +1,27 @@
-library routes_example;
+//library routes_example;
 
 import 'dart:html';
+import 'package:polymer/polymer.dart';
 import 'package:route/client.dart';
 
 // Alternatively we could define multiple static routes as such:
 // new UrlPattern('/routes_example/web/routes_example.html#one');
 // ..
 final MyUrl = new UrlPattern(r'/routes_example/web/routes_example.html#(\w+)');
+final HomeUrl = new UrlPattern(r'/routes_example/web/routes_example.html');
 
+// This is temorary only until Polymer 0.8.6 and I should then be able to
+// revert this back to main and drop the @initMethod annotation.
+//@initMethod
+//tmpMain() {
+// After Polymer 0.8.6 use the following two lines instead.
 main() {
+  //initPolymer();
   // Create our router and handlers then start listening.
   // See route package documentation for more details.
-  var router = new Router()..addHandler(MyUrl, route_handler)..listen();
+  var router = new Router()..addHandler(MyUrl, route_handler)
+      ..addHandler(HomeUrl, (_) { })
+      ..listen();
 
 }
 
@@ -21,6 +31,6 @@ void route_handler(String path) {
   var page = MyUrl.parse(path)[0];
 
   // Grab our custom element and assign to the page property.
-  var exampleApp = document.query('example-app').xtag;
+  var exampleApp = document.query('example-app');
   exampleApp.page = page;
 }
diff --git a/web/routes_example.html b/web/routes_example.html
@@ -6,10 +6,9 @@
     <title>Sample app</title>
     <link rel="stylesheet" href="routes_example.css">
     <link rel="import" href="example_app.html">
+    <script src="packages/browser/dart.js"></script>
+    <script type="application/dart" src="packages/polymer/init.dart"></script>
 
-    <!-- This is the bootstrap script for Polymer. 
-         Use this INSTEAD of dart.js -->
-    <script src="packages/polymer/boot.js"></script>
   </head>
   <body>
     <h1>Routes example</h1>

diff --git a/web/two_element.html b/web/two_element.html
@@ -8,6 +8,9 @@ <h2>I'm Element Two</h2>
   import 'package:polymer/polymer.dart';
 
   @CustomTag('two-element')
-  class TwoElement extends PolymerElement {}
+  class TwoElement extends PolymerElement {
+    // Now required for all Polymer elements.
+    TwoElement.created() : super.created();
+  }
   </script>
 </polymer-element>