From 1d0efc758bc9404eebbc8b8d592de9dbb329899e Mon Sep 17 00:00:00 2001 From: François Frisch Date: Sat, 17 Mar 2012 11:21:22 -0700 Subject: Adding feed reader and map --- .../examples/feed-reader/images/07-map-marker.png | Bin 0 -> 3131 bytes .../examples/feed-reader/images/10-medical.png | Bin 0 -> 2915 bytes .../examples/feed-reader/images/100-coffee.png | Bin 0 -> 2958 bytes .../examples/feed-reader/images/107-widescreen.png | Bin 0 -> 2986 bytes .../examples/feed-reader/images/125-food.png | Bin 0 -> 3038 bytes .../feed-reader/images/142-wine-bottle.png | Bin 0 -> 187 bytes .../examples/feed-reader/images/34-coffee.png | Bin 0 -> 3052 bytes .../examples/feed-reader/images/35-shopping.png | Bin 0 -> 2970 bytes .../examples/feed-reader/images/38-airplane.png | Bin 0 -> 3004 bytes .../feed-reader/images/41-picture-frame.png | Bin 0 -> 2928 bytes .../feed-reader/images/48-fork-and-knife.png | Bin 0 -> 2882 bytes .../examples/feed-reader/images/87-wine-glass.png | Bin 0 -> 2983 bytes .../montage/examples/feed-reader/index.html | 81 +++++++++ .../examples/feed-reader/main.reel/main.html | 184 +++++++++++++++++++++ .../montage/examples/feed-reader/main.reel/main.js | 45 +++++ .../examples/feed-reader/map-example.reel/main.css | 2 + .../feed-reader/map-example.reel/main.html | 58 +++++++ .../examples/feed-reader/map-example.reel/main.js | 24 +++ .../montage/examples/feed-reader/package.json | 10 ++ 19 files changed, 404 insertions(+) create mode 100644 node_modules/montage/examples/feed-reader/images/07-map-marker.png create mode 100644 node_modules/montage/examples/feed-reader/images/10-medical.png create mode 100644 node_modules/montage/examples/feed-reader/images/100-coffee.png create mode 100644 node_modules/montage/examples/feed-reader/images/107-widescreen.png create mode 100644 node_modules/montage/examples/feed-reader/images/125-food.png create mode 100644 node_modules/montage/examples/feed-reader/images/142-wine-bottle.png create mode 100644 node_modules/montage/examples/feed-reader/images/34-coffee.png create mode 100644 node_modules/montage/examples/feed-reader/images/35-shopping.png create mode 100644 node_modules/montage/examples/feed-reader/images/38-airplane.png create mode 100644 node_modules/montage/examples/feed-reader/images/41-picture-frame.png create mode 100644 node_modules/montage/examples/feed-reader/images/48-fork-and-knife.png create mode 100644 node_modules/montage/examples/feed-reader/images/87-wine-glass.png create mode 100644 node_modules/montage/examples/feed-reader/index.html create mode 100644 node_modules/montage/examples/feed-reader/main.reel/main.html create mode 100644 node_modules/montage/examples/feed-reader/main.reel/main.js create mode 100644 node_modules/montage/examples/feed-reader/map-example.reel/main.css create mode 100644 node_modules/montage/examples/feed-reader/map-example.reel/main.html create mode 100644 node_modules/montage/examples/feed-reader/map-example.reel/main.js create mode 100644 node_modules/montage/examples/feed-reader/package.json (limited to 'node_modules/montage/examples') diff --git a/node_modules/montage/examples/feed-reader/images/07-map-marker.png b/node_modules/montage/examples/feed-reader/images/07-map-marker.png new file mode 100644 index 00000000..a5d99d69 Binary files /dev/null and b/node_modules/montage/examples/feed-reader/images/07-map-marker.png differ diff --git a/node_modules/montage/examples/feed-reader/images/10-medical.png b/node_modules/montage/examples/feed-reader/images/10-medical.png new file mode 100644 index 00000000..ab78c783 Binary files /dev/null and b/node_modules/montage/examples/feed-reader/images/10-medical.png differ diff --git a/node_modules/montage/examples/feed-reader/images/100-coffee.png b/node_modules/montage/examples/feed-reader/images/100-coffee.png new file mode 100644 index 00000000..4e9c517a Binary files /dev/null and b/node_modules/montage/examples/feed-reader/images/100-coffee.png differ diff --git a/node_modules/montage/examples/feed-reader/images/107-widescreen.png b/node_modules/montage/examples/feed-reader/images/107-widescreen.png new file mode 100644 index 00000000..2e5f1ba7 Binary files /dev/null and b/node_modules/montage/examples/feed-reader/images/107-widescreen.png differ diff --git a/node_modules/montage/examples/feed-reader/images/125-food.png b/node_modules/montage/examples/feed-reader/images/125-food.png new file mode 100644 index 00000000..81afd74a Binary files /dev/null and b/node_modules/montage/examples/feed-reader/images/125-food.png differ diff --git a/node_modules/montage/examples/feed-reader/images/142-wine-bottle.png b/node_modules/montage/examples/feed-reader/images/142-wine-bottle.png new file mode 100644 index 00000000..a7df9e97 Binary files /dev/null and b/node_modules/montage/examples/feed-reader/images/142-wine-bottle.png differ diff --git a/node_modules/montage/examples/feed-reader/images/34-coffee.png b/node_modules/montage/examples/feed-reader/images/34-coffee.png new file mode 100644 index 00000000..4c4bedad Binary files /dev/null and b/node_modules/montage/examples/feed-reader/images/34-coffee.png differ diff --git a/node_modules/montage/examples/feed-reader/images/35-shopping.png b/node_modules/montage/examples/feed-reader/images/35-shopping.png new file mode 100644 index 00000000..03689f99 Binary files /dev/null and b/node_modules/montage/examples/feed-reader/images/35-shopping.png differ diff --git a/node_modules/montage/examples/feed-reader/images/38-airplane.png b/node_modules/montage/examples/feed-reader/images/38-airplane.png new file mode 100644 index 00000000..dfcbbc78 Binary files /dev/null and b/node_modules/montage/examples/feed-reader/images/38-airplane.png differ diff --git a/node_modules/montage/examples/feed-reader/images/41-picture-frame.png b/node_modules/montage/examples/feed-reader/images/41-picture-frame.png new file mode 100644 index 00000000..6deee997 Binary files /dev/null and b/node_modules/montage/examples/feed-reader/images/41-picture-frame.png differ diff --git a/node_modules/montage/examples/feed-reader/images/48-fork-and-knife.png b/node_modules/montage/examples/feed-reader/images/48-fork-and-knife.png new file mode 100644 index 00000000..06d91088 Binary files /dev/null and b/node_modules/montage/examples/feed-reader/images/48-fork-and-knife.png differ diff --git a/node_modules/montage/examples/feed-reader/images/87-wine-glass.png b/node_modules/montage/examples/feed-reader/images/87-wine-glass.png new file mode 100644 index 00000000..b4d34474 Binary files /dev/null and b/node_modules/montage/examples/feed-reader/images/87-wine-glass.png differ diff --git a/node_modules/montage/examples/feed-reader/index.html b/node_modules/montage/examples/feed-reader/index.html new file mode 100644 index 00000000..3b5529b9 --- /dev/null +++ b/node_modules/montage/examples/feed-reader/index.html @@ -0,0 +1,81 @@ + + + + + + Montage Feed Reader + + + + + + + + + + +

+

+ +
+

+ +
+

This is the bootstrapper content which will now be shown for at least 1500ms.

+
+
+

This is the loader content which will now be shown for at least 2000ms.

+
+ + + + diff --git a/node_modules/montage/examples/feed-reader/main.reel/main.html b/node_modules/montage/examples/feed-reader/main.reel/main.html new file mode 100644 index 00000000..8ea9a79b --- /dev/null +++ b/node_modules/montage/examples/feed-reader/main.reel/main.html @@ -0,0 +1,184 @@ + + + + + Feed Reader Example + + + + + + + + + + +
+ + + +
+
+
+

Top Stories Around you

+
+ Feed URL: + +
+
+
+
+ +
+
+

Find your way

+
+ Location: + +
+
+
Map
+
+ +
+ +
+ + +
+ + + diff --git a/node_modules/montage/examples/feed-reader/main.reel/main.js b/node_modules/montage/examples/feed-reader/main.reel/main.js new file mode 100644 index 00000000..bea5f91a --- /dev/null +++ b/node_modules/montage/examples/feed-reader/main.reel/main.js @@ -0,0 +1,45 @@ +/* + 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/core/core").Montage, + Component = require("montage/ui/component").Component; + +exports.Main = Montage.create(Component, { + + feedURL: { + value: 'http://rss.cnn.com/rss/cnn_mostpopular.rss', + distinct: true + }, + + feedReader: {value: null}, + + map: {value: null}, + + mapCenter: {value: null}, + + handleGoAction: { + value: function(event) { + event.preventDefault(); + this.feedReader.feedURL = this.feedURL; + + } + }, + + handleMapButtonAction: { + value: function(event) { + event.preventDefault(); + this.map.center = this.mapCenter; + } + }, + + draw: { + value: function() { + if(this.mapCenter != null) { + this.map.center = this.mapCenter; + } + } + } + +}); diff --git a/node_modules/montage/examples/feed-reader/map-example.reel/main.css b/node_modules/montage/examples/feed-reader/map-example.reel/main.css new file mode 100644 index 00000000..139597f9 --- /dev/null +++ b/node_modules/montage/examples/feed-reader/map-example.reel/main.css @@ -0,0 +1,2 @@ + + diff --git a/node_modules/montage/examples/feed-reader/map-example.reel/main.html b/node_modules/montage/examples/feed-reader/map-example.reel/main.html new file mode 100644 index 00000000..889ca8d6 --- /dev/null +++ b/node_modules/montage/examples/feed-reader/map-example.reel/main.html @@ -0,0 +1,58 @@ + + + + + + Main Component + + + + + + + + +
+

Main component of application

+
+
+
+ +
+ + + diff --git a/node_modules/montage/examples/feed-reader/map-example.reel/main.js b/node_modules/montage/examples/feed-reader/map-example.reel/main.js new file mode 100644 index 00000000..54b84425 --- /dev/null +++ b/node_modules/montage/examples/feed-reader/map-example.reel/main.js @@ -0,0 +1,24 @@ +/* + 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/core/core").Montage, + Component = require("montage/ui/component").Component; + + +exports.Main = Montage.create(Component, { + + templateDidLoad: { + value: function() { + //console.log("main templateDidLoad") + } + }, + + prepareForDraw: { + value: function() { + //console.log("main prepareForDraw") + } + } + +}); diff --git a/node_modules/montage/examples/feed-reader/package.json b/node_modules/montage/examples/feed-reader/package.json new file mode 100644 index 00000000..cbb9365f --- /dev/null +++ b/node_modules/montage/examples/feed-reader/package.json @@ -0,0 +1,10 @@ +{ + "name": "loader", + "version": "0.0.0", + "mappings": { + "montage": "../.." + }, + "directories": { + "lib": "" + } +} -- cgit v1.2.3 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 From 09852e9b9b8e64f003bed5aa57630d8b42c8ac95 Mon Sep 17 00:00:00 2001 From: François Frisch Date: Sat, 17 Mar 2012 19:28:30 -0700 Subject: Integrating picasa carousel and youtube channel --- .../examples/youtube-channel-example/index.html | 2 +- .../youtube-channel.reel/youtube-channel.html | 34 ------- .../youtube-channel.reel/youtube-channel.js | 101 --------------------- 3 files changed, 1 insertion(+), 136 deletions(-) delete mode 100644 node_modules/montage/examples/youtube-channel-example/youtube-channel.reel/youtube-channel.html delete 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 index 71baba29..b313d5d8 100755 --- a/node_modules/montage/examples/youtube-channel-example/index.html +++ b/node_modules/montage/examples/youtube-channel-example/index.html @@ -12,7 +12,7 @@ - - -
-
-
- - 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 deleted file mode 100644 index 1f5aa2d1..00000000 --- a/node_modules/montage/examples/youtube-channel-example/youtube-channel.reel/youtube-channel.js +++ /dev/null @@ -1,101 +0,0 @@ -/* - 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 From 54eb5672a5f43fb157aa7ecb88b0ba8a06296b86 Mon Sep 17 00:00:00 2001 From: François Frisch Date: Sun, 18 Mar 2012 22:25:35 -0700 Subject: using channel name rather than url --- .../montage/examples/youtube-channel-example/index.html | 11 +++-------- 1 file changed, 3 insertions(+), 8 deletions(-) (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 index b313d5d8..f3a0592a 100755 --- a/node_modules/montage/examples/youtube-channel-example/index.html +++ b/node_modules/montage/examples/youtube-channel-example/index.html @@ -14,7 +14,8 @@ "player": { "prototype": "montage/ui/youtube-channel.reel", "properties": { - "element": {"#": "player"} + "element": {"#": "player"}, + "channel": "drive" } }, @@ -23,12 +24,6 @@ "properties": { "element": {"#": "url"}, "value": "http://www.youtube.com/TEDEducation" - }, - "bindings": { - "value": { - "boundObject": {"@": "player"}, - "boundObjectPropertyPath": "channelUrl" - } } } } @@ -37,7 +32,7 @@
Youtube Channel
- +
-- cgit v1.2.3 From 9d364be255900e9bde02c4b254d145ec41fc78fb Mon Sep 17 00:00:00 2001 From: Kishore Subramanian Date: Mon, 19 Mar 2012 10:36:49 -0700 Subject: Changes to the Demo - Feed Reader now shows one entry at a time - Category dropdown removed form the Map. It is included as part of the example code - Changed the categories that do not return results --- .../examples/feed-reader/images/47-fuel.png | Bin 0 -> 3091 bytes .../feed-reader/images/80-shopping-cart.png | Bin 0 -> 2963 bytes .../examples/feed-reader/images/88-beer-mug.png | Bin 0 -> 3087 bytes .../examples/feed-reader/main.reel/main.html | 26 +++++++++++++++++++++ .../montage/examples/feed-reader/main.reel/main.js | 10 ++++++++ 5 files changed, 36 insertions(+) create mode 100644 node_modules/montage/examples/feed-reader/images/47-fuel.png create mode 100644 node_modules/montage/examples/feed-reader/images/80-shopping-cart.png create mode 100644 node_modules/montage/examples/feed-reader/images/88-beer-mug.png (limited to 'node_modules/montage/examples') diff --git a/node_modules/montage/examples/feed-reader/images/47-fuel.png b/node_modules/montage/examples/feed-reader/images/47-fuel.png new file mode 100644 index 00000000..617d7640 Binary files /dev/null and b/node_modules/montage/examples/feed-reader/images/47-fuel.png differ diff --git a/node_modules/montage/examples/feed-reader/images/80-shopping-cart.png b/node_modules/montage/examples/feed-reader/images/80-shopping-cart.png new file mode 100644 index 00000000..51a5f86f Binary files /dev/null and b/node_modules/montage/examples/feed-reader/images/80-shopping-cart.png differ diff --git a/node_modules/montage/examples/feed-reader/images/88-beer-mug.png b/node_modules/montage/examples/feed-reader/images/88-beer-mug.png new file mode 100644 index 00000000..b0fdd99a Binary files /dev/null and b/node_modules/montage/examples/feed-reader/images/88-beer-mug.png differ diff --git a/node_modules/montage/examples/feed-reader/main.reel/main.html b/node_modules/montage/examples/feed-reader/main.reel/main.html index 8ea9a79b..ef4fc92a 100644 --- a/node_modules/montage/examples/feed-reader/main.reel/main.html +++ b/node_modules/montage/examples/feed-reader/main.reel/main.html @@ -79,6 +79,13 @@ "element": {"#": "map"} } }, + + "types": { + "prototype": "montage/ui/select-input.reel", + "properties": { + "element": {"#": "types"} + } + }, "owner": { "module": "main.reel", @@ -92,6 +99,10 @@ "mapCenter": { "boundObject": {"@": "mapCenter"}, "boundObjectPropertyPath": "value" + }, + "mapCategory": { + "boundObject": {"@": "types"}, + "boundObjectPropertyPath": "value" } } } @@ -140,6 +151,10 @@ visibility: hidden; } + #map, #feed-reader { + margin-top: 10px; + } + @@ -168,6 +183,17 @@
Location: +
+ Show: + +
Map
diff --git a/node_modules/montage/examples/feed-reader/main.reel/main.js b/node_modules/montage/examples/feed-reader/main.reel/main.js index bea5f91a..06d8fdba 100644 --- a/node_modules/montage/examples/feed-reader/main.reel/main.js +++ b/node_modules/montage/examples/feed-reader/main.reel/main.js @@ -13,6 +13,16 @@ exports.Main = Montage.create(Component, { distinct: true }, + mapCategory: { + get: function() { + return this._mapCategory; + }, + set: function(value) { + this._mapCategory = value; + this.map.category = value; + } + }, + feedReader: {value: null}, map: {value: null}, -- cgit v1.2.3 From ec58642a7b31165890eb5bef7d95ce59dd0c34a0 Mon Sep 17 00:00:00 2001 From: Kishore Subramanian Date: Mon, 19 Mar 2012 14:14:29 -0700 Subject: Changes to Map and FeedReader - Added traffic property to Map - Support for show/hide traffic in the example - Changed FeedReader to use only one DIV. No longer uses Repetition - Support multiple modes in the Feed reader - timed/animated--- .../examples/feed-reader/main.reel/main.html | 32 ++++++++++++++++++++-- 1 file changed, 30 insertions(+), 2 deletions(-) (limited to 'node_modules/montage/examples') diff --git a/node_modules/montage/examples/feed-reader/main.reel/main.html b/node_modules/montage/examples/feed-reader/main.reel/main.html index ef4fc92a..50bac601 100644 --- a/node_modules/montage/examples/feed-reader/main.reel/main.html +++ b/node_modules/montage/examples/feed-reader/main.reel/main.html @@ -44,7 +44,9 @@ "module": "montage/ui/feed-reader/feed-reader.reel", "name": "FeedReader", "properties": { - "element": {"#": "feed-reader"} + "element": {"#": "feed-reader"}, + "feedDisplayMode": "timed", + "interval": "5" } }, @@ -76,7 +78,14 @@ "map": { "prototype": "montage/ui/map.reel", "properties": { - "element": {"#": "map"} + "element": {"#": "map"}, + "traffic": false + }, + "bindings": { + "traffic": { + "boundObject": {"@": "traffic"}, + "boundObjectPropertyPath": "checked" + } } }, @@ -86,6 +95,12 @@ "element": {"#": "types"} } }, + "traffic": { + "prototype": "montage/ui/checkbox.reel", + "properties": { + "element": {"#": "traffic"} + } + }, "owner": { "module": "main.reel", @@ -155,6 +170,18 @@ margin-top: 10px; } + /* + .feed-reader .feed-entry { + visibility:hidden; + opacity:0; + transition:visibility 0s linear 0.5s,opacity 0.5s linear; + } + .feed-reader .feed-entry .active { + visibility:visible; + opacity:1; + transition-delay:0s; + } + */ @@ -194,6 +221,7 @@ + Show Traffic
Map
-- cgit v1.2.3 From e438756a18e4ae46cd4713e81f0bc4a1d2ddea15 Mon Sep 17 00:00:00 2001 From: Stuart Knightley Date: Mon, 19 Mar 2012 15:13:28 -0700 Subject: Update Youtube channel to have three thumbnails --- .../montage/examples/youtube-channel-example/index.html | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) (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 index f3a0592a..132d0d5a 100755 --- a/node_modules/montage/examples/youtube-channel-example/index.html +++ b/node_modules/montage/examples/youtube-channel-example/index.html @@ -15,7 +15,7 @@ "prototype": "montage/ui/youtube-channel.reel", "properties": { "element": {"#": "player"}, - "channel": "drive" + "channelUrl": "http://www.youtube.com/TEDEducation" } }, @@ -24,6 +24,12 @@ "properties": { "element": {"#": "url"}, "value": "http://www.youtube.com/TEDEducation" + }, + "bindings": { + "value": { + "boundObject": {"@": "player"}, + "boundObjectPropertyPath": "channelUrl" + } } } } @@ -32,7 +38,7 @@
Youtube Channel
- +
-- cgit v1.2.3 From 64f2a4b6c0ca9e47996ab9bcec05b51d1e1194e4 Mon Sep 17 00:00:00 2001 From: Kishore Subramanian Date: Tue, 20 Mar 2012 09:42:29 -0700 Subject: Animation for the Feed reader --- .../examples/feed-reader/main.reel/main.html | 42 ++++++++++++++++++++-- 1 file changed, 39 insertions(+), 3 deletions(-) (limited to 'node_modules/montage/examples') diff --git a/node_modules/montage/examples/feed-reader/main.reel/main.html b/node_modules/montage/examples/feed-reader/main.reel/main.html index 50bac601..1313219f 100644 --- a/node_modules/montage/examples/feed-reader/main.reel/main.html +++ b/node_modules/montage/examples/feed-reader/main.reel/main.html @@ -45,8 +45,8 @@ "name": "FeedReader", "properties": { "element": {"#": "feed-reader"}, - "feedDisplayMode": "timed", - "interval": "5" + "feedDisplayMode": "animation", + "interval": "3" } }, @@ -170,6 +170,7 @@ margin-top: 10px; } + /* .feed-reader .feed-entry { visibility:hidden; @@ -182,7 +183,42 @@ transition-delay:0s; } */ + + @-webkit-keyframes rotateWithAlphaKeyframes { + 0% { + opacity: 0; + -webkit-transform: perspective(1000) rotateY(95deg); + } + 1% { + opacity: 0; + -webkit-transform: perspective(1000) rotateY(-90deg); + } + 15% { + opacity: 1; + -webkit-transform: perspective(1000) rotateY(0deg); + } + 85% { + opacity: 1; + -webkit-transform: perspective(1000) rotateY(0deg); + } + 100% { + opacity: 0; + -webkit-transform: perspective(1000) rotateY(95deg); + } + } + + .rotateWithAlphaAnimation { + -webkit-animation-name: rotateWithAlphaKeyframes; + -webkit-animation-duration: 5s; + -webkit-animation-iteration-count: infinite; + -webkit-animation-direction: normal; + -webkit-animation-timing-function: ease-out; + -webkit-transform-origin: 200% 50%; + -webkit-transform-style: preserve-3d; + -webkit-transform: perspective(1000); + } + @@ -201,7 +237,7 @@ -
+
-- cgit v1.2.3