Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(1753)

Unified Diff: polymer_1.0.4/bower_components/google-youtube/demo/demo.elements.html

Issue 1205703007: Add polymer 1.0 to npm_modules (Closed) Base URL: https://chromium.googlesource.com/infra/third_party/npm_modules.git@master
Patch Set: Renamed folder to 1.0.4 Created 5 years, 6 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: polymer_1.0.4/bower_components/google-youtube/demo/demo.elements.html
diff --git a/polymer_1.0.4/bower_components/google-youtube/demo/demo.elements.html b/polymer_1.0.4/bower_components/google-youtube/demo/demo.elements.html
new file mode 100644
index 0000000000000000000000000000000000000000..0820c239effd30d69118be66407d2c6c90ba41d4
--- /dev/null
+++ b/polymer_1.0.4/bower_components/google-youtube/demo/demo.elements.html
@@ -0,0 +1,108 @@
+<link rel="import" href="../../polymer/polymer.html">
+<link rel="import" href="../google-youtube.html">
+
+
+<dom-module id="demo-element">
+ <template id="page-template">
+ <style>
+ div {
+ margin-bottom: 1em;
+ }
+ </style>
+ <h1><code>&lt;google-youtube&gt;</code> Demo</h1>
+ <h3>Full API Demo</h3>
+ <google-youtube id="googleYouTube"
+ playsupported="{{playSupported}}"
+ video-id="mN7IAaRdi_k"
+ state="{{state}}"
+ currenttime="{{currentTime}}"
+ currenttimeformatted="{{currentTimeFormatted}}"
+ duration="{{duration}}"
+ durationformatted="{{durationFormatted}}"
+ fractionloaded="{{fractionLoaded}}"
+ on-google-youtube-state-change="handleStateChange"
+ on-google-youtube-error="handleYouTubeError">
+ </google-youtube>
+
+ <div>
+ <p>Playback Progress: <span>{{currentTimeFormatted}}</span> / <span>{{durationFormatted}}</span> <progress max="1" value="{{computeProgress(currentTime, duration)}}"></progress></p>
+ </div>
+
+ <div>
+ <button id="play-video"
+ disabled="{{computePlayDisabled(state, playSupported)}}"
+ on-click="handlePlayVideo"
+ >Play</button>
+ <button id="pause-video"
+ disabled="{{computePauseDisabled(state)}}"
+ on-click="handlePauseVideo"
+ >Pause</button>
+ </div>
+
+ <div>
+ <label for="videoId">Video ID:</label>
+ <input id="videoId" value="M7lc1UVf-VE">
+ <button id="cue-video" on-click="handleCueVideo">Cue</button>
+ </div>
+
+ <div>
+ <p>Player Events:</p>
+ <ol>
+ <template is="dom-repeat" items="{{events}}">
+ <li>State change: <span>{{item.data}}</span></li>
+ </template>
+ </ol>
+ </div>
+
+ <h3>Custom Thumbnail Demo</h3>
+ <google-youtube video-id="yRbOSdAe_JU"
+ width="853px"
+ height="480px"
+ thumbnail="//www.polymer-project.org/images/logos/p-logo.svg">
+ </google-youtube>
+ </template>
+</dom-module>
+<script>
+ Polymer({
+ is: 'demo-element',
+ properties: {
+ playSupported: String,
+ state: String,
+ currentTime: Number,
+ currentTimeFormatted: String,
+ duration: Number,
+ durationFormatted: String,
+ fractionLoaded: Number,
+ 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>
+

Powered by Google App Engine
This is Rietveld 408576698