From 3070d7b2a3b96609eace60825c721951c85405cc Mon Sep 17 00:00:00 2001 From: François Frisch Date: Sat, 17 Mar 2012 18:05:23 -0700 Subject: Adding the youtube player --- .../examples/youtube-channel-example/index.html | 44 +++++++++ .../examples/youtube-channel-example/package.json | 7 ++ .../examples/youtube-channel-example/style.css | 47 ++++++++++ .../youtube-channel-example.js | 8 ++ .../youtube-channel.reel/youtube-channel.html | 34 +++++++ .../youtube-channel.reel/youtube-channel.js | 101 +++++++++++++++++++++ 6 files changed, 241 insertions(+) create mode 100755 node_modules/montage/examples/youtube-channel-example/index.html create mode 100755 node_modules/montage/examples/youtube-channel-example/package.json create mode 100755 node_modules/montage/examples/youtube-channel-example/style.css create mode 100755 node_modules/montage/examples/youtube-channel-example/youtube-channel-example.js create mode 100644 node_modules/montage/examples/youtube-channel-example/youtube-channel.reel/youtube-channel.html create mode 100644 node_modules/montage/examples/youtube-channel-example/youtube-channel.reel/youtube-channel.js (limited to 'node_modules/montage/examples') diff --git a/node_modules/montage/examples/youtube-channel-example/index.html b/node_modules/montage/examples/youtube-channel-example/index.html new file mode 100755 index 00000000..71baba29 --- /dev/null +++ b/node_modules/montage/examples/youtube-channel-example/index.html @@ -0,0 +1,44 @@ + + + + + Youtube Channel + + + + + +
+
Youtube Channel
+ +
+
+ + diff --git a/node_modules/montage/examples/youtube-channel-example/package.json b/node_modules/montage/examples/youtube-channel-example/package.json new file mode 100755 index 00000000..ecfbdd8a --- /dev/null +++ b/node_modules/montage/examples/youtube-channel-example/package.json @@ -0,0 +1,7 @@ +{ + "name": "youtube-channel-example", + "version": "0.0.0", + "mappings": { + "montage": "../../" + } +} \ No newline at end of file diff --git a/node_modules/montage/examples/youtube-channel-example/style.css b/node_modules/montage/examples/youtube-channel-example/style.css new file mode 100755 index 00000000..c281cd65 --- /dev/null +++ b/node_modules/montage/examples/youtube-channel-example/style.css @@ -0,0 +1,47 @@ +/* + This file contains proprietary software owned by Motorola Mobility, Inc.
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. +
*/ + + +/* Base ----------------------------- */ + +html { + background-color: hsl(0,0%,85%); + height: 100%; +} + +body { + margin: 0; + width: 100%; + height: 100%; + display: -webkit-box; + -webkit-box-align: center; + -webkit-box-pack: center; + + display: -moz-box; + -moz-box-align: center; + -moz-box-pack: center; +} + + +/* Converter ----------------------------- */ + +.youtube-channel-example { + padding: 10px; + text-shadow: #fff 0 1px 0; + border-radius: 8px; + background-color: hsl(0,0%,95%); + box-shadow: inset 0px 1px 2px 1px hsla(0,0%,100%,1), 0px 2px 5px hsla(0,0%,0%,.1); +} + +.youtube-channel-example #title { + margin: 0 0 5px 0; + text-align: center; + font: 24px/40px "Lucida Grande", "Trebuchet MS", Verdana, sans-serif; +} + +.youtube-channel-example-url { + width: 100%; +} diff --git a/node_modules/montage/examples/youtube-channel-example/youtube-channel-example.js b/node_modules/montage/examples/youtube-channel-example/youtube-channel-example.js new file mode 100755 index 00000000..4ca12757 --- /dev/null +++ b/node_modules/montage/examples/youtube-channel-example/youtube-channel-example.js @@ -0,0 +1,8 @@ +/* + This file contains proprietary software owned by Motorola Mobility, Inc.
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. +
*/ +var Montage = require("montage").Montage; + +exports.YoutubeChannelExample = Montage.create(Converter, {}); diff --git a/node_modules/montage/examples/youtube-channel-example/youtube-channel.reel/youtube-channel.html b/node_modules/montage/examples/youtube-channel-example/youtube-channel.reel/youtube-channel.html new file mode 100644 index 00000000..8514f5ce --- /dev/null +++ b/node_modules/montage/examples/youtube-channel-example/youtube-channel.reel/youtube-channel.html @@ -0,0 +1,34 @@ + + + + + + + + +
+
+
+ + diff --git a/node_modules/montage/examples/youtube-channel-example/youtube-channel.reel/youtube-channel.js b/node_modules/montage/examples/youtube-channel-example/youtube-channel.reel/youtube-channel.js new file mode 100644 index 00000000..1f5aa2d1 --- /dev/null +++ b/node_modules/montage/examples/youtube-channel-example/youtube-channel.reel/youtube-channel.js @@ -0,0 +1,101 @@ +/* + This file contains proprietary software owned by Motorola Mobility, Inc.
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. +
*/ +/*global require,exports*/ +var Montage = require("montage").Montage, + Component = require("montage/ui/component").Component, + Uuid = require("montage/core/uuid").Uuid; + + +var YoutubeChannel = exports.YoutubeChannel = Montage.create(Component, { + + _userRe: { + enumerable: false, + value: /youtube.com\/(user\/)?([a-z0-9]+)/i + }, + + _channelUrl: { + enumerable: false, + value: null + }, + channelUrl: { + depends: ["channel"], + get: function() { + return this._channelUrl; + }, + set: function(value, fromChannel) { + if (this._channelUrl !== value) { + this._channelUrl = value; + + // prevent infinite loop + if (!fromChannel) { + var match = this._userRe.exec(value); + if (match && match[2]) { + Object.getPropertyDescriptor(this, "channel").set.call(this, match[2], true); + } + } + } + } + }, + + _channel: { + enumerable: false, + value: null + }, + channel: { + get: function() { + return this._channel; + }, + set: function(value, fromUrl) { + if (this._channel !== value) { + this._channel = value; + + // prevent infinite loop + if (!fromUrl) { + Object.getPropertyDescriptor(this, "channelUrl").set.call(this, "http://www.youtube.com/user/" + value, true); + } + + this._loadChannel(); + } + } + }, + + _loadChannel: { + enumerable: false, + value: function() { + var self = this; + + var callbackName = "scriptCallback" + Uuid.generate().replace(/-/g, "_"); + + window[callbackName] = function(data) { + self.handleData(data); + delete window[callbackName]; + }; + + // create url + var url = "http://gdata.youtube.com/feeds/api/users/" + this._channel + "/uploads?v=2&alt=json-in-script&callback=" + callbackName; + + var script = document.createElement("script"); + script.src = url; + this._element.appendChild(script); + } + }, + + handleData: { + value: function(data) { + var entries = data.feed.entry || []; + + var playlist = []; + + for (var i = 0, len = entries.length; i < len; i++) { + var id = entries[i]["media$group"]["yt$videoid"]["$t"]; + playlist.push(id); + } + + this.player.playlist = playlist; + } + } + +}); \ No newline at end of file -- cgit v1.2.3