aboutsummaryrefslogtreecommitdiff
path: root/node_modules/montage/ui/flow.reel
diff options
context:
space:
mode:
authorPierre Frisch2011-12-22 07:25:50 -0800
committerValerio Virgillito2012-01-27 11:18:17 -0800
commitb89a7ee8b956c96a1dcee995ea840feddc5d4b27 (patch)
tree0f3136ab0ecdbbbed6a83576581af0a53124d6f1 /node_modules/montage/ui/flow.reel
parent2401f05d1f4b94d45e4568b81fc73e67b969d980 (diff)
downloadninja-b89a7ee8b956c96a1dcee995ea840feddc5d4b27.tar.gz
First commit of Ninja to ninja-internal
Signed-off-by: Valerio Virgillito <rmwh84@motorola.com>
Diffstat (limited to 'node_modules/montage/ui/flow.reel')
-rw-r--r--node_modules/montage/ui/flow.reel/flow.html60
-rw-r--r--node_modules/montage/ui/flow.reel/flow.js348
2 files changed, 408 insertions, 0 deletions
diff --git a/node_modules/montage/ui/flow.reel/flow.html b/node_modules/montage/ui/flow.reel/flow.html
new file mode 100644
index 00000000..ae83c223
--- /dev/null
+++ b/node_modules/montage/ui/flow.reel/flow.html
@@ -0,0 +1,60 @@
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 "repetition1": {
13 "module": "montage/ui/repetition.reel",
14 "name": "Repetition",
15 "properties": {
16 "element": {
17 "#": "montage-flow-repetition"
18 }
19 }
20 },
21 "owner": {
22 "module": "montage/ui/flow.reel",
23 "name": "Flow",
24 "properties": {
25 "element": {
26 "#": "montage-flow"
27 },
28 "_repetition": {
29 "@": "repetition1"
30 }
31 }
32 }
33 }
34 </script>
35 <style>
36 .montage-flow {
37 position: relative;
38 overflow: hidden;
39 -webkit-transform: translateZ(0);
40 }
41 .montage-flow-repetition {
42 position: absolute;
43 top: 0;
44 left: 0;
45 bottom: 0;
46 right: 0;
47 -webkit-transform-style: preserve-3d;
48 -webkit-transform: translateZ(0);
49 }
50 .montage-flow-repetition > * {
51 position: absolute !important;
52 }
53 </style>
54</head>
55<body>
56 <div id="montage-flow" class="montage-flow">
57 <div id="montage-flow-repetition" class="montage-flow-repetition"></div>
58 </div>
59</body>
60</html> \ No newline at end of file
diff --git a/node_modules/montage/ui/flow.reel/flow.js b/node_modules/montage/ui/flow.reel/flow.js
new file mode 100644
index 00000000..c0a6b32f
--- /dev/null
+++ b/node_modules/montage/ui/flow.reel/flow.js
@@ -0,0 +1,348 @@
1/* <copyright>
2This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
3No 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
7var Montage = require("montage").Montage,
8 Component = require("ui/component").Component;
9
10var Flow = exports.Flow = Montage.create(Component, {
11
12 _path: {
13 enumerable: false,
14 value: {
15 value: function (slide) {
16 return {
17 translateX: slide.time,
18 translateY: 0,
19 translateZ: 0,
20 scale: 1,
21 rotateX: 0,
22 rotateY: 0,
23 rotateZ: 0,
24 transformOriginX: 0,
25 transformOriginY: 0,
26 transformOriginZ: 0,
27 style: {}
28 };
29 }
30 }
31 },
32
33 path: {
34 get: function () {
35 return this._path;
36 },
37 set: function (value) {
38 this._path = value;
39 this.needsDraw = true;
40 }
41 },
42
43 _rotationOrder: {
44 enumerable: false,
45 value: "xyz"
46 },
47
48 rotationOrder: {
49 get: function () {
50 return this._rotationOrder;
51 },
52 set: function (value) {
53 switch (value) {
54 case "xzy":
55 case "yxz":
56 case "yzx":
57 case "zxy":
58 case "zyx":
59 this._rotationOrder=value;
60 break;
61 default:
62 this._rotationOrder="xyz";
63 break;
64 }
65 this.needsDraw = true;
66 }
67 },
68
69 numberOfNodes: {
70 value: null
71 },
72
73 _nodeOffset: {
74 enumerable: false,
75 value: {
76 value: function (nodeNumber) {
77 return {
78 time: nodeNumber*100,
79 speed: 0
80 }
81 }
82 }
83 },
84
85 nodeOffset: {
86 get: function () {
87 return this._nodeOffset;
88 },
89 set: function (value) {
90 this._nodeOffset = value;
91 this.needsDraw = true;
92 }
93 },
94
95 _width: {
96 enumerable: false,
97 value: null
98 },
99
100 _height: {
101 enumerable: false,
102 value: null
103 },
104
105 _repetitionComponents: {
106 enumerable: false,
107 value: null
108 },
109
110 prepareForDraw: {
111 enumerable: false,
112 value: function () {
113 this._repetitionComponents=this._repetition._childComponents;
114 }
115 },
116
117 draw: {
118 enumerable: false,
119 value: function () {
120 var i,
121 length = this.numberOfNodes,
122 slide={
123 index: null,
124 time: null,
125 speed: null
126 },
127 transform,
128 origin,
129 iPath,
130 j,
131 jPath,
132 iOffset,
133 iStyle;
134
135 for (i=0; i<length; i++) {
136 iStyle=this._repetitionComponents[i].element.style;
137 iOffset=this._nodeOffset.value(i);
138 slide.index=i;
139 slide.time=iOffset.time;
140 slide.speed=iOffset.speed;
141 iPath=this._path.value(slide);
142 if (typeof iPath.translateX==="undefined") {
143 iPath.translateX=0;
144 }
145 if (typeof iPath.translateY==="undefined") {
146 iPath.translateY=0;
147 }
148 if (typeof iPath.translateZ==="undefined") {
149 iPath.translateZ=0;
150 }
151 transform="translate3d(";
152 transform+=(typeof iPath.translateX==="number")?iPath.translateX+"px,":iPath.translateX+",";
153 transform+=(typeof iPath.translateY==="number")?iPath.translateY+"px,":iPath.translateY+",";
154 transform+=(typeof iPath.translateZ==="number")?iPath.translateZ+"px) ":iPath.translateZ+") ";
155 transform+=(typeof iPath.scale!=="undefined")?"scale("+iPath.scale+") ":"";
156 switch (this._rotationOrder) {
157 case "xyz":
158 transform+=(typeof iPath.rotateZ!=="undefined")?"rotateZ("+iPath.rotateZ+"rad) ":"";
159 transform+=(typeof iPath.rotateY!=="undefined")?"rotateY("+iPath.rotateY+"rad) ":"";
160 transform+=(typeof iPath.rotateX!=="undefined")?"rotateX("+iPath.rotateX+"rad) ":"";
161 break;
162 case "xzy":
163