diff options
author | Valerio Virgillito | 2012-02-01 00:09:27 -0800 |
---|---|---|
committer | Valerio Virgillito | 2012-02-01 00:09:27 -0800 |
commit | 8592cfb89db05f0e52d8c1b8c7046e6f49e3522d (patch) | |
tree | a6f9b5adfe16fd6232708f8a2345cd79056caca9 /node_modules/montage-user/ui/flow.reel | |
parent | c6d1a1da9e7cdf477daf32410d80691eb1e828d5 (diff) | |
download | ninja-8592cfb89db05f0e52d8c1b8c7046e6f49e3522d.tar.gz |
Adding a montage framework copy for the user document
Adding a new montage copy containing the latest version of montage to use the new native widgets
Signed-off-by: Valerio Virgillito <valerio@motorola.com>
Diffstat (limited to 'node_modules/montage-user/ui/flow.reel')
-rw-r--r-- | node_modules/montage-user/ui/flow.reel/flow.html | 60 | ||||
-rw-r--r-- | node_modules/montage-user/ui/flow.reel/flow.js | 762 |
2 files changed, 822 insertions, 0 deletions
diff --git a/node_modules/montage-user/ui/flow.reel/flow.html b/node_modules/montage-user/ui/flow.reel/flow.html new file mode 100644 index 00000000..646c87f8 --- /dev/null +++ b/node_modules/montage-user/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> | ||
diff --git a/node_modules/montage-user/ui/flow.reel/flow.js b/node_modules/montage-user/ui/flow.reel/flow.js new file mode 100644 index 00000000..21556e41 --- /dev/null +++ b/node_modules/montage-user/ui/flow.reel/flow.js | |||
@@ -0,0 +1,762 @@ | |||
1 | var Montage = require("montage").Montage, | ||
2 | Component = require("ui/component").Component; | ||
3 | |||
4 | var Flow = exports.Flow = Montage.create(Component, { | ||
5 | |||
6 | // TODO: Review _externalUpdate | ||
7 | |||
8 | _externalUpdate: { | ||
9 | enumerable: false, | ||
10 | value: true | ||
11 | }, | ||
12 | |||
13 | _isCameraUpdated: { | ||
14 | enumerable: false, | ||
15 | value: false | ||
16 | }, | ||
17 | |||
18 | // Camera rotation based in CSS3 rotate3D axis/angle system | ||
19 | |||
20 | _cameraRotationAxisX: { | ||
21 | enumerable: false, | ||
22 | value: 0 | ||
23 | }, | ||
24 | |||
25 | _cameraRotationAxisY: { | ||
26 | enumerable: false, | ||
27 | value: 0 | ||
28 | }, | ||
29 | |||
30 | _cameraRotationAxisZ: { | ||
31 | enumerable: false, | ||
32 | value: 1 | ||
33 | }, | ||
34 | |||
35 | _cameraRotationAngle: { | ||
36 | enumerable: false, | ||
37 | value: 0 | ||
38 | }, | ||
39 | |||
40 | cameraRotationAxisX: { | ||
41 | get: function () { | ||
42 | return this._cameraRotationAxisX; | ||
43 | }, | ||
44 | set: function (value) { | ||
45 | this._cameraRotationAxisX = value; | ||
46 | this._isCameraUpdated = true; | ||
47 | this.needsDraw = true; | ||
48 | } | ||
49 | }, | ||
50 | |||
51 | cameraRotationAxisY: { | ||
52 | get: function () { | ||
53 | return this._cameraRotationAxisY; | ||
54 | }, | ||
55 | set: function (value) { | ||
56 | this._cameraRotationAxisY = value; | ||
57 | this._isCameraUpdated = true; | ||
58 | this.needsDraw = true; | ||
59 | } | ||
60 | }, | ||
61 | |||
62 | cameraRotationAxisZ: { | ||
63 | get: function () { | ||
64 | return this._cameraRotationAxisZ; | ||
65 | }, | ||
66 | set: function (value) { | ||
67 | this._cameraRotationAxisZ = value; | ||
68 | this._isCameraUpdated = true; | ||
69 | this.needsDraw = true; | ||
70 | } | ||
71 | }, | ||
72 | |||
73 | cameraRotationAngle: { | ||
74 | get: function () { | ||
75 | return this._cameraRotationAngle; | ||
76 | }, | ||
77 | set: function (value) { | ||
78 | this._cameraRotationAngle = value; | ||
79 | this._isCameraUpdated = true; | ||
80 | this.needsDraw = true; | ||
81 | } | ||
82 | }, | ||
83 | |||
84 | _path: { | ||
85 | enumerable: false, | ||
86 | value: { | ||
87 | value: function (slide) { | ||
88 | return { | ||
89 | translateX: slide.time, | ||
90 | translateY: 0, | ||
91 | translateZ: 0, | ||
92 | scale: 1, | ||
93 | rotateX: 0, | ||
94 | rotateY: 0, | ||
95 | rotateZ: 0, | ||
96 | transformOriginX: 0, | ||
97 | transformOriginY: 0, | ||
98 | transformOriginZ: 0, | ||
99 | style: {} | ||
100 | }; | ||
101 | } | ||
102 | } | ||
103 | }, | ||
104 | |||
105 | path: { | ||
106 | get: function () { | ||
107 | return this._path; | ||
108 | }, | ||
109 | set: function (value) { | ||
110 | this._path = value; | ||
111 | this.needsDraw = true; | ||
112 | } | ||
113 | }, | ||
114 | |||
115 | _rotationOrder: { | ||
116 | enumerable: false, | ||
117 | value: "xyz" | ||
118 | }, | ||
119 | |||
120 | rotationOrder: { | ||
121 | get: function () { | ||
122 | return this._rotationOrder; | ||
123 | }, | ||
124 | set: function (value) { | ||
125 | switch (value) { | ||
126 | case "xzy": | ||
127 | case "yxz": | ||
128 | case "yzx": | ||
129 | case "zxy": | ||
130 | case "zyx": | ||
131 | this._rotationOrder=value; | ||
132 | break; | ||
133 | default: | ||
134 | this._rotationOrder="xyz"; | ||
135 | break; | ||
136 | } | ||
137 | this.needsDraw = true; | ||
138 | } | ||
139 | }, | ||
140 | |||
141 | _width: { | ||
142 | enumerable: false, | ||
143 | value: null | ||
144 | }, | ||
145 | |||
146 | _height: { | ||
147 | enumerable: false, | ||
148 | value: null | ||
149 | }, | ||
150 | |||
151 | _repetitionComponents: { | ||
152 | enumerable: false, | ||
153 | value: null | ||
154 | }, | ||
155 | |||
156 | prepareForDraw: { | ||
157 | enumerable: false, | ||
158 | value: function () { | ||
159 | this._repetitionComponents = this._repetition._childComponents; | ||
160 | } | ||
161 | }, | ||
162 | |||