Update: converting to hybrid

bendavis78 · Sep 21, 2017 · d6270f4 · d6270f4
1 parent 1d17162
commit d6270f4
Show file tree

Hide file tree

Showing 6 changed files with 243 additions and 218 deletions.
diff --git a/bower.json b/bower.json
@@ -20,23 +20,47 @@
     "/tests/"
   ],
   "dependencies": {
-    "polymer": "Polymer/polymer#^1.1.0",
-    "iron-media-query": "PolymerElements/iron-media-query#^1.0.0",
-    "iron-selector": "PolymerElements/iron-selector#^1.0.0",
-    "neon-animation": "PolymerElements/neon-animation#^1.0.0",
-    "iron-resizable-behavior": "PolymerElements/iron-resizable-behavior#^1.0.0",
-    "iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0.0",
-    "paper-styles": "PolymerElements/paper-styles#^1.0.0",
-    "iron-pages": "PolymerElements/iron-pages#^1.0.0",
+    "polymer": "Polymer/polymer#^1.9 || ^2.0",
+    "iron-media-query": "PolymerElements/iron-media-query#^1.0 || ^2.0",
+    "iron-selector": "PolymerElements/iron-selector#^1.0 || ^2.0",
+    "neon-animation": "PolymerElements/neon-animation#^1.0 || ^2.0",
+    "iron-resizable-behavior": "PolymerElements/iron-resizable-behavior#^1.0 || ^2.0",
+    "iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0 || ^2.0",
+    "paper-styles": "PolymerElements/paper-styles#^1.0 || ^2.0",
+    "iron-pages": "PolymerElements/iron-pages#^1.0 || ^2.0",
     "classList.js": "https://github.com/eligrey/classList.js.git#~1.1.20150312"
   },
   "devDependencies": {
-    "iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
-    "paper-dialog": "PolymerElements/paper-dialog#^1.0.0",
-    "paper-button": "PolymerElements/paper-button#^1.0.0",
-    "webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
+    "iron-component-page": "PolymerElements/iron-component-page#^1.0 || ^2.0",
+    "paper-dialog": "PolymerElements/paper-dialog#^1.0 || ^2.0",
+    "paper-button": "PolymerElements/paper-button#^1.0 || ^2.0",
+    "webcomponentsjs": "webcomponents/webcomponentsjs#^1.0.0"
+  },
+  "variants": {
+    "1.x": {
+      "dependencies": {
+        "polymer": "Polymer/polymer#^1.9",
+        "iron-media-query": "PolymerElements/iron-media-query#^1.0.0",
+        "iron-selector": "PolymerElements/iron-selector#^1.0.0",
+        "neon-animation": "PolymerElements/neon-animation#^1.0.0",
+        "iron-resizable-behavior": "PolymerElements/iron-resizable-behavior#^1.0.0",
+        "iron-flex-layout": "PolymerElements/iron-flex-layout#^1.0.0",
+        "paper-styles": "PolymerElements/paper-styles#^1.0.0",
+        "iron-pages": "PolymerElements/iron-pages#^1.0.0",
+        "classList.js": "https://github.com/eligrey/classList.js.git#~1.1.20150312"
+      },
+      "devDependencies": {
+        "iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
+        "paper-dialog": "PolymerElements/paper-dialog#^1.0.0",
+        "paper-button": "PolymerElements/paper-button#^1.0.0",
+        "webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
+      },
+      "resolutions": {
+        "webcomponentsjs": "^0.7.2"
+      }
+    }
   },
   "resolutions": {
-    "webcomponentsjs": "^0.7.2"
+    "webcomponentsjs": "^1.0.0"
   }
 }
diff --git a/demo/index.html b/demo/index.html
@@ -6,37 +6,46 @@
   <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
 
   <title>paper-time-picker Demo</title>
-  
+
   <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
 
   <link rel="import" href="../paper-time-picker.html">
   <link rel="import" href="../../paper-styles/demo-pages.html">
   <link rel="import" href="../../paper-dialog/paper-dialog.html">
   <link rel="import" href="../../paper-button/paper-button.html">
 
-  <style is="custom-style" include="paper-time-picker-dialog-style">
-    section {
-      margin: 24px;
-    }
-  </style>
+  <custom-style>
+    <style is="custom-style" include="paper-time-picker-dialog-style">
+      section {
+        margin: 24px;
+      }
+    </style>
+  </custom-style>
 </head>
 <body unresolved>
-  <template is="dom-bind" id="scope">
-    <section>
-      <h1>{{time}}</h1>
-      <paper-button class="btn" on-tap="showDialog" raised>Change Time</paper-button>
-      <paper-dialog id="dialog" class="paper-time-picker-dialog" modal on-iron-overlay-closed="dismissDialog">
-        <paper-time-picker id="picker" time="[[time]]"></paper-time-picker>
-        <div class="buttons">
-          <paper-button dialog-dismiss>CANCEL</paper-button>
-          <paper-button dialog-confirm>OK</paper-button>
-        </div>
-      </paper-dialog>
-    </section>
-  </template>
+  <dom-bind id="bindElement">
+    <template is="dom-bind" id="templateElement">
+      <section>
+        <h1>{{time}}</h1>
+        <paper-button class="btn" on-tap="showDialog" raised>Change Time</paper-button>
+        <paper-dialog id="dialog" class="paper-time-picker-dialog" modal on-iron-overlay-closed="dismissDialog">
+          <paper-time-picker id="picker" time="[[time]]"></paper-time-picker>
+          <div class="buttons">
+            <paper-button dialog-dismiss>CANCEL</paper-button>
+            <paper-button dialog-confirm>OK</paper-button>
+          </div>
+        </paper-dialog>
+      </section>
+    </template>
+  </dom-bind>
   <script>
     (function() {
-      var scope = document.querySelector('#scope');
+      var scope;
+      if (Polymer.Element) {
+        scope = document.querySelector('#bindElement');
+      } else {
+        scope = document.querySelector('#templateElement');
+      }
       scope.dismissDialog = function(event) {
         if (event.detail.confirmed) {
           scope.time = scope.$.picker.time;

diff --git a/package.json b/package.json