Merge pull request #77 from GoogleWebComponents/2.0-preview

2.0-preview
GoogleWebComponents · Sep 1, 2017 · c76b626 · c76b626
2 parents 03e876d + 76edbd6
commit c76b626
Show file tree

Hide file tree

Showing 9 changed files with 864 additions and 813 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1 +1,2 @@
-bower_components
+bower_components*
+bower-*.json
diff --git a/bower.json b/bower.json
@@ -3,7 +3,7 @@
   "description": "YouTube video playback web component.",
   "homepage": "https://googlewebcomponents.github.io/google-youtube",
   "main": "google-youtube.html",
-  "version": "1.3.0",
+  "version": "2.0.0",
   "authors": [
     "Jeff Posnick <jeffy@google.com>"
   ],
@@ -20,12 +20,26 @@
     "web-component"
   ],
   "dependencies": {
-    "polymer": "Polymer/polymer#^1.0.0",
-    "google-apis": "GoogleWebComponents/google-apis#^1.0.0",
-    "iron-localstorage": "PolymerElements/iron-localstorage#^1.0.0"
+    "polymer": "Polymer/polymer#1.9 - 2",
+    "google-apis": "GoogleWebComponents/google-apis#1 - 2",
+    "iron-localstorage": "PolymerElements/iron-localstorage#1 - 2"
   },
   "devDependencies": {
-    "web-component-tester": "*",
-    "iron-component-page": "PolymerElements/iron-component-page#^1.0.0"
+    "web-component-tester": "^6.0.0",
+    "iron-component-page": "PolymerElements/iron-component-page#1 - 2"
+  },
+  "variants": {
+    "1.x": {
+      "dependencies": {
+        "polymer": "Polymer/polymer#^1.0.0",
+        "google-apis": "GoogleWebComponents/google-apis#^1.0.0",
+        "iron-localstorage": "PolymerElements/iron-localstorage#^1.0.0"
+      },
+      "devDependencies": {
+        "web-component-tester": "^4.0.0",
+        "iron-component-page": "PolymerElements/iron-component-page#^1.0.0",
+        "iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0"
+      }
+    }
   }
 }
diff --git a/demo/demo.elements.html → demo/demo-elements.html b/demo/demo.elements.html → demo/demo-elements.html
@@ -74,50 +74,53 @@ <h3>Playlist Demo</h3>
                     height="480px">
     </google-youtube>
   </template>
-</dom-module>
-<script>
-  Polymer({
-    is: 'demo-element',
-    properties: {
-      playSupported: Boolean,
-      state: Number,
-      currentTime: Number,
-      currentTimeFormatted: String,
-      duration: Number,
-      durationFormatted: String,
-      fractionLoaded: Number,
-      volume: Number,
-      playbackRate: Number,
-      playbackQuality: String,
-      events: {
-        type: Array,
-        value: []
-      }
-    },
-    computeProgress: function(currentTime, duration) {
-      return currentTime / duration;
-    },
-    computePlayDisabled: function(state, playSupported) {
-      return state == 1 || state == 3 || !playSupported;
-    },
-    computePauseDisabled: function(state) {
-      return state != 1 && state != 3;
-    },
-    handleStateChange: function(ev) {
-      this.events.push({data: ev.detail.data});
-    },
-    handleYouTubeError: function(ev) {
-      console.error('YouTube playback error', ev.detail);
-    },
-    handlePlayVideo: function(ev) {
-      this.$.googleYouTube.play();
-    },
-    handlePauseVideo: function(ev) {
-      this.$.googleYouTube.pause();
-    },
-    handleCueVideo: function(ev) {
-      this.$.googleYouTube.videoId = this.$.videoId.value;
-    }
-  });
+  <script>
+    Polymer({
+      is: 'demo-element',
+      properties: {
+        playSupported: Boolean,
+        state: Number,
+        currentTime: Number,
+        currentTimeFormatted: String,
+        duration: Number,
+        durationFormatted: String,
+        fractionLoaded: Number,
+        volume: Number,
+        playbackRate: Number,
+        playbackQuality: String,
+        events: {
+          type: Array,
+          value: []
+        }
+      },
+      computeProgress: function(currentTime, duration) {
+        if (currentTime === undefined || duration === undefined) {
+          return 0;
+        }
 
-</script>
+        return currentTime / duration;
+      },
+      computePlayDisabled: function(state, playSupported) {
+        return state == 1 || state == 3 || !playSupported;
+      },
+      computePauseDisabled: function(state) {
+        return state != 1 && state != 3;
+      },
+      handleStateChange: function(ev) {
+        this.events.push({data: ev.detail.data});
+      },
+      handleYouTubeError: function(ev) {
+        console.error('YouTube playback error', ev.detail);
+      },
+      handlePlayVideo: function(ev) {
+        this.$.googleYouTube.play();
+      },
+      handlePauseVideo: function(ev) {
+        this.$.googleYouTube.pause();
+      },
+      handleCueVideo: function(ev) {
+        this.$.googleYouTube.videoId = this.$.videoId.value;
+      }
+    });
+  </script>
+</dom-module>
diff --git a/demo/index.html b/demo/index.html
@@ -5,8 +5,8 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
     <title>&lt;google-youtube&gt; Demo</title>
-    <script src="../../webcomponentsjs/webcomponents.js"></script>
-    <link rel="import" href="demo.elements.html">
+    <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
+    <link rel="import" href="demo-elements.html">
 
     <style>
       body {