aboutsummaryrefslogtreecommitdiff
path: root/node_modules/montage/examples
diff options
context:
space:
mode:
Diffstat (limited to 'node_modules/montage/examples')
-rwxr-xr-xnode_modules/montage/examples/youtube-channel-example/index.html44
-rwxr-xr-xnode_modules/montage/examples/youtube-channel-example/package.json7
-rwxr-xr-xnode_modules/montage/examples/youtube-channel-example/style.css47
-rwxr-xr-xnode_modules/montage/examples/youtube-channel-example/youtube-channel-example.js8
-rw-r--r--node_modules/montage/examples/youtube-channel-example/youtube-channel.reel/youtube-channel.html34
-rw-r--r--node_modules/montage/examples/youtube-channel-example/youtube-channel.reel/youtube-channel.js101
6 files changed, 241 insertions, 0 deletions
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 @@
1<!DOCTYPE html>
2<!-- <copyright>
3 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/>
5 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
6 </copyright> -->
7<html>
8<head>
9 <title>Youtube Channel</title>
10 <link rel="stylesheet" type="text/css" href="style.css">
11 <script src="../../montage.js" type="text/javascript"></script>
12 <script type="text/montage-serialization">
13 {
14 "player": {
15 "prototype": "youtube-channel.reel",
16 "properties": {
17 "element": {"#": "player"}
18 }
19 },
20
21 "url": {
22 "prototype": "montage/ui/textfield.reel",
23 "properties": {
24 "element": {"#": "url"},
25 "value": "http://www.youtube.com/TEDEducation"
26 },
27 "bindings": {
28 "value": {
29 "boundObject": {"@": "player"},
30 "boundObjectPropertyPath": "channelUrl"
31 }
32 }
33 }
34 }
35 </script>
36</head>
37<body>
38 <div class="youtube-channel-example">
39 <div id="title">Youtube Channel</div>
40 <input type="text" data-montage-id="url" placeholder="Channel URL" class="youtube-channel-example-url">
41 <div data-montage-id="player"></div>
42 </div>
43</body>
44</html>
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 @@
1{
2 "name": "youtube-channel-example",
3 "version": "0.0.0",
4 "mappings": {
5 "montage": "../../"
6 }
7} \ 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 @@
1/* <copyright>
2 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
3 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
4 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5 </copyright> */
6
7
8/* Base ----------------------------- */
9
10html {
11 background-color: hsl(0,0%,85%);
12 height: 100%;
13}
14
15body {
16 margin: 0;
17 width: 100%;
18 height: 100%;
19 display: -webkit-box;
20 -webkit-box-align: center;
21 -webkit-box-pack: center;
22
23 display: -moz-box;
24 -moz-box-align: center;
25 -moz-box-pack: center;
26}
27
28
29/* Converter ----------------------------- */
30
31.youtube-channel-example {
32 padding: 10px;
33 text-shadow: #fff 0 1px 0;
34 border-radius: 8px;
35 background-color: hsl(0,0%,95%);
36 box-shadow: inset 0px 1px 2px 1px hsla(0,0%,100%,1), 0px 2px 5px hsla(0,0%,0%,.1);
37}
38
39.youtube-channel-example #title {
40 margin: 0 0 5px 0;
41 text-align: center;
42 font: 24px/40px "Lucida Grande", "Trebuchet MS", Verdana, sans-serif;
43}
44
45.youtube-channel-example-url {
46 width: 100%;
47}
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 @@
1/* <copyright>
2 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
3 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
4 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5 </copyright> */
6var Montage = require("montage").Montage;
7
8exports.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 @@
1<!DOCTYPE html>
2<!-- <copyright>
3 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/>
5 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
6 </copyright> -->
7<html>
8 <head>
9 <title></title>
10 <script type="text/montage-serialization">
11 {
12 "player": {
13 "prototype": "montage/ui/youtube-player.reel",
14 "properties": {
15 "element": {"#": "player"}
16 }
17 },
18
19 "owner": {
20 "prototype": "youtube-channel.reel",
21 "properties": {
22 "element": {"#": "container"},
23 "player": {"@": "player"}
24 }
25 }
26 }
27 </script>
28</head>
29<body>
30 <div data-montage-id="container" class="montage-youtube-channel">
31 <div data-montage-id="player"></div>
32 </div>
33</body>
34</html>
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 @@
1/* <copyright>
2 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
3 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
4 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5 </copyright> */
6/*global require,exports*/
7var Montage = require("montage").Montage,
8 Component = require("montage/ui/component").Component,
9 Uuid = require("montage/core/uuid").Uuid;
10
11
12var YoutubeChannel = exports.YoutubeChannel = Montage.create(Component, {
13
14 _userRe: {
15 enumerable: false,
16 value: /youtube.com\/(user\/)?([a-z0-9]+)/i
17 },
18
19 _channelUrl: {
20 enumerable: false,
21 value: null
22 },
23 channelUrl: {
24 depends: ["channel"],
25 get: function() {
26 return this._channelUrl;
27 },
28 set: function(value, fromChannel) {
29 if (this._channelUrl !== value) {
30 this._channelUrl = value;
31
32 // prevent infinite loop
33 if (!fromChannel) {
34 var match = this._userRe.exec(value);
35 if (match && match[2]) {
36 Object.getPropertyDescriptor(this, "channel").set.call(this, match[2], true);
37 }
38 }
39 }
40 }
41 },
42
43 _channel: {
44 enumerable: false,
45 value: null