diff options
author | Stuart Knightley | 2012-03-19 09:46:38 -0700 |
---|---|---|
committer | Stuart Knightley | 2012-03-19 09:46:38 -0700 |
commit | eb5cda3ce03b35c3335b91c34ead0cdf290b243e (patch) | |
tree | c0dd72e2d805e04c6650c2e767d2847ee51a6171 /node_modules | |
parent | 222562c734396403c18c90a1ca395a36c4d49da4 (diff) | |
download | ninja-eb5cda3ce03b35c3335b91c34ead0cdf290b243e.tar.gz |
Update Youtube player to HTML5
Diffstat (limited to 'node_modules')
-rw-r--r-- | node_modules/montage/ui/youtube-player.reel/youtube-player.html | 10 | ||||
-rw-r--r-- | node_modules/montage/ui/youtube-player.reel/youtube-player.js | 38 |
2 files changed, 24 insertions, 24 deletions
diff --git a/node_modules/montage/ui/youtube-player.reel/youtube-player.html b/node_modules/montage/ui/youtube-player.reel/youtube-player.html index ae757626..ec61493c 100644 --- a/node_modules/montage/ui/youtube-player.reel/youtube-player.html +++ b/node_modules/montage/ui/youtube-player.reel/youtube-player.html | |||
@@ -7,23 +7,19 @@ | |||
7 | <html> | 7 | <html> |
8 | <head> | 8 | <head> |
9 | <title></title> | 9 | <title></title> |
10 | <script src="http://www.youtube.com/player_api"></script> | ||
10 | <script type="text/montage-serialization"> | 11 | <script type="text/montage-serialization"> |
11 | { | 12 | { |
12 | "owner": { | 13 | "owner": { |
13 | "prototype": "montage/ui/youtube-player.reel", | 14 | "prototype": "montage/ui/youtube-player.reel", |
14 | "properties": { | 15 | "properties": { |
15 | "element": {"#": "container"}, | 16 | "element": {"#": "iframe"} |
16 | "player": {"#": "player"} | ||
17 | } | 17 | } |
18 | } | 18 | } |
19 | } | 19 | } |
20 | </script> | 20 | </script> |
21 | </head> | 21 | </head> |
22 | <body> | 22 | <body> |
23 | <div data-montage-id="container" class="montage-youtube-player"> | 23 | <iframe data-montage-id="iframe" class="montage-youtube-player" type="text/html" width="640" height="385" src="http://www.youtube.com/embed" frameborder="0" allowfullscreen></iframe> |
24 | <object type="application/x-shockwave-flash" data-montage-id="player" width="640" height="360"> | ||
25 | <param name="allowScriptAccess" value="always"> | ||
26 | </object> | ||
27 | </div> | ||
28 | </body> | 24 | </body> |
29 | </html> | 25 | </html> |
diff --git a/node_modules/montage/ui/youtube-player.reel/youtube-player.js b/node_modules/montage/ui/youtube-player.reel/youtube-player.js index 2f7709d7..462dca58 100644 --- a/node_modules/montage/ui/youtube-player.reel/youtube-player.js +++ b/node_modules/montage/ui/youtube-player.reel/youtube-player.js | |||
@@ -1,10 +1,9 @@ | |||
1 | //data="https://www.youtube.com/v/u1zgFlCw8Aw?version=3&enablejsapi=1&playerapiid=ytplayer" | ||
2 | /* <copyright> | 1 | /* <copyright> |
3 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> | 2 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> |
4 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> | 3 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> |
5 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | 4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. |
6 | </copyright> */ | 5 | </copyright> */ |
7 | /*global require,exports*/ | 6 | /*global require,exports,YT */ |
8 | var Montage = require("montage").Montage, | 7 | var Montage = require("montage").Montage, |
9 | Component = require("ui/component").Component; | 8 | Component = require("ui/component").Component; |
10 | 9 | ||
@@ -31,7 +30,6 @@ var YoutubePlayer = exports.YoutubePlayer = Montage.create(Component, { | |||
31 | return this._player; | 30 | return this._player; |
32 | }, | 31 | }, |
33 | set: function(value) { | 32 | set: function(value) { |
34 | // TODO don't allow this to be changed | ||
35 | if (this._player !== value) { | 33 | if (this._player !== value) { |
36 | this._player = value; | 34 | this._player = value; |
37 | } | 35 | } |
@@ -127,30 +125,36 @@ var YoutubePlayer = exports.YoutubePlayer = Montage.create(Component, { | |||
127 | value: function() { | 125 | value: function() { |
128 | // Create the callback if it doesn't exist, and make it dispatch | 126 | // Create the callback if it doesn't exist, and make it dispatch |
129 | // an event on the document instead | 127 | // an event on the document instead |
130 | if (!window.onYouTubePlayerReady) { | 128 | if (!window.onYouTubePlayerAPIReady) { |
131 | window.onYouTubePlayerReady = function(playerId) { | 129 | window.onYouTubePlayerAPIReady = function() { |
132 | var event = document.createEvent("CustomEvent"); | 130 | var event = document.createEvent("CustomEvent"); |
133 | event.initEvent("youtubePlayerReady", true, true); | 131 | event.initEvent("youtubePlayerApiReady", true, true); |
134 | event.playerId = playerId; | ||
135 | document.dispatchEvent(event); | 132 | document.dispatchEvent(event); |
136 | }; | 133 | }; |
137 | } | 134 | } |
138 | 135 | ||
139 | document.addEventListener("youtubePlayerReady", this, false); | 136 | this._element.src += (this._videoId ? "/" + this._videoId : "") + "?enablejsapi=1"; |
140 | 137 | ||
141 | // If there's no videoId set one the doesn't exist | 138 | if (typeof YT !== "undefined" && YT.Player) { |
142 | this._player.data = "https://www.youtube.com/v/" + (this._videoId || "xxxxxxxxxxx") + "?version=3&enablejsapi=1&playerapiid=" + this.uuid; | 139 | this.handleYoutubePlayerApiReady(); |
140 | } else { | ||
141 | document.addEventListener("youtubePlayerApiReady", this, false); | ||
142 | } | ||
143 | } | 143 | } |
144 | }, | 144 | }, |
145 | 145 | ||
146 | handleYoutubePlayerReady: { | 146 | handleYoutubePlayerApiReady: { |
147 | value: function(event) { | 147 | value: function(event) { |
148 | if (event.playerId !== this.uuid) { | 148 | console.log("handleYoutubePlayerApiReady"); |
149 | return; | 149 | document.removeEventListener("youtubePlayerApiReady", this); |
150 | } | 150 | |
151 | 151 | var self = this; | |
152 | this._ready = true; | 152 | this.player = new YT.Player(this._element, { events: { |
153 | this.needsDraw = true; | 153 | onReady: function(event) { |
154 | self._ready = true; | ||
155 | self.needsDraw = true; | ||
156 | } | ||
157 | }}); | ||
154 | } | 158 | } |
155 | }, | 159 | }, |
156 | 160 | ||