aboutsummaryrefslogtreecommitdiff
path: root/js/panels/Timeline/Layer.reel
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/Timeline/Layer.reel')
-rw-r--r--js/panels/Timeline/Layer.reel/Layer.html173
-rw-r--r--js/panels/Timeline/Layer.reel/Layer.js627
-rw-r--r--js/panels/Timeline/Layer.reel/css/Layer.css285
-rw-r--r--js/panels/Timeline/Layer.reel/images/eye.pngbin0 -> 1331 bytes
-rw-r--r--js/panels/Timeline/Layer.reel/images/icon-collapsed.pngbin0 -> 325 bytes
-rw-r--r--js/panels/Timeline/Layer.reel/images/icon-eye.pngbin0 -> 550 bytes
-rw-r--r--js/panels/Timeline/Layer.reel/images/icon-lock.pngbin0 -> 475 bytes
-rw-r--r--js/panels/Timeline/Layer.reel/images/icon-minus.pngbin0 -> 161 bytes
-rw-r--r--js/panels/Timeline/Layer.reel/images/icon-open.pngbin0 -> 323 bytes
-rw-r--r--js/panels/Timeline/Layer.reel/images/icon-plus.pngbin0 -> 230 bytes
-rw-r--r--js/panels/Timeline/Layer.reel/images/lock_closed.pngbin0 -> 1208 bytes
-rw-r--r--js/panels/Timeline/Layer.reel/images/lock_open.pngbin0 -> 1186 bytes
-rw-r--r--js/panels/Timeline/Layer.reel/images/panelDisclosureIcon.pngbin0 -> 3028 bytes
-rw-r--r--js/panels/Timeline/Layer.reel/scss/Layer.scss231
-rw-r--r--js/panels/Timeline/Layer.reel/scss/config.rb9
15 files changed, 1325 insertions, 0 deletions
diff --git a/js/panels/Timeline/Layer.reel/Layer.html b/js/panels/Timeline/Layer.reel/Layer.html
new file mode 100644
index 00000000..a3fbd5b1
--- /dev/null
+++ b/js/panels/Timeline/Layer.reel/Layer.html
@@ -0,0 +1,173 @@
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 lang="en">
8 <head>
9 <meta http-equiv="content-type" content="text/html; charset=utf-8" />
10 <link rel="stylesheet" type="text/css" href="css/Layer.css">
11 <script type="text/montage-serialization">
12 {
13 "owner": {
14 "module": "js/panels/Timeline/Layer.reel",
15 "name": "Layer",
16 "properties": {
17 "element": {"#": "layer"},
18 "styleRepetition" : {"@":"repetition1"},
19 "dynamicLayerName" : {"@":"dtext1"},
20 "slotStyle" : {"@":"slot1"}
21 }
22 },
23 "dtext1" : {
24 "module" : "montage/ui/dynamic-text.reel",
25 "name" : "DynamicText",
26 "properties" : {
27 "element" : {"#" : "layer-label-text"}
28 },
29 "bindings" : {
30 "value" : {
31 "boundObject" : {"@": "owner"},
32 "boundObjectPropertyPath" : "layerName",
33 "oneway" : false
34 }
35 }
36 },
37 "repetition1": {
38 "module": "montage/ui/repetition.reel",
39 "name": "Repetition",
40 "properties": {
41 "element": {"#": "style-container"},
42 "isSelectionEnabled" : true
43 },
44 "bindings": {
45 "objects": {
46 "boundObject": {"@": "owner"},
47 "boundObjectPropertyPath": "arrLayerStyles",
48 "oneway": false
49 }
50 }
51 },
52 "style" : {
53 "module" : "js/panels/Timeline/Style.reel",
54 "name" : "LayerStyle",
55 "properties" : {
56 "element" : {"#" : "layer-style"}
57 },
58 "bindings" : {
59 "styleID" : {
60 "boundObject" : {"@": "repetition1"},
61 "boundObjectPropertyPath" : "objectAtCurrentIteration.styleID",
62 "oneway" : false
63 },
64 "whichView" : {
65 "boundObject" : {"@": "repetition1"},
66 "boundObjectPropertyPath" : "objectAtCurrentIteration.whichView",
67 "oneway" : false
68 },
69 "editorProperty" : {
70 "boundObject" : {"@": "repetition1"},
71 "boundObjectPropertyPath" : "objectAtCurrentIteration.editorProperty",
72 "oneway" : false
73 },
74 "isSelected" : {
75 "boundObject" : {"@": "repetition1"},
76 "boundObjectPropertyPath" : "objectAtCurrentIteration.isSelected",
77 "oneway" : false
78 },
79 "isActive" : {
80 "boundObject" : {"@": "repetition1"},
81 "boundObjectPropertyPath" : "objectAtCurrentIteration.isActive",
82 "oneway" : false
83 },
84 "editorValue" : {
85 "boundObject" : {"@": "repetition1"},
86 "boundObjectPropertyPath" : "objectAtCurrentIteration.editorValue",
87 "oneway" : false
88 },
89 "ruleTweener" : {
90 "boundObject" : {"@": "repetition1"},
91 "boundObjectPropertyPath" : "objectAtCurrentIteration.ruleTweener",
92 "oneway" : false
93 }
94 }
95 }
96 }
97 </script>
98 </head>
99 <body>
100
101 <div id="layer" class="container-layer">
102 <div class="label-layer">
103 <span class="collapsible-label" id="layer-label-text" spellcheck="false">Label</span>
104 <span class="collapsible-clicker collapsible-collapsed"></span>
105 <div class="cssbutton button-lock"></div>
106 <div class="cssbutton button-visible"></div>
107 </div>
108 <div class="collapsible-content content-layer collapsible-collapsed">
109 <div class="label-position">
110 <span class="collapsible-label">Position</span>
111 <span class="collapsible-clicker clicker-position"></span>
112 </div>
113 <div class="content-position collapsible-content">
114 <div class="layout-table">
115 <div class="layout-row">
116 <div class="layout-cell">X</div>
117 <div class="layout-cell">100px</div>
118 </div>
119 <div class="layout-row">
120 <div class="layout-cell">Y</div>
121 <div class="layout-cell">100px</div>
122 </div>
123 <div class="layout-row">
124 <div class="layout-cell">Z</div>
125 <div class="layout-cell">100px</div>
126 </div>
127 </div>
128 </div>
129 <div class="label-transform">
130 <span class="collapsible-label">Transform</span>
131 <span class="clicker-transform collapsible-clicker"></span>
132 </div>
133 <div class="content-transform collapsible-content">
134 <div class="layout-table">
135 <div class="layout-row">
136 <div class="layout-cell">Scale X</div>
137 <div class="layout-cell">100px</div>
138 </div>
139 <div class="layout-row">
140 <div class="layout-cell">Scale Y</div>
141 <div class="layout-cell">100px</div>
142 </div>
143 <div class="layout-row">
144 <div class="layout-cell">Skew X</div>
145 <div class="layout-cell">100px</div>
146 </div>
147 <div class="layout-row">
148 <div class="layout-cell">Skew Y</div>
149 <div class="layout-cell">100px</div>
150 </div>
151 <div class="layout-row">
152 <div class="layout-cell">Rotation</div>
153 <div class="layout-cell">100px</div>
154 </div>
155 </div>
156
157 </div>
158 <div class="label-style">
159 <span class="collapsible-label">Style</span>
160 <span class="clicker-style collapsible-clicker"></span>
161 <div class="cssbutton button-delete disabled"></div>
162 <div class="cssbutton button-add"></div>
163 </div>
164 <div class="content-style collapsible-content">
165 <div class="" id="style-container">
166 <div class="style-row" id="layer-style">
167 </div>
168 </div>
169 </div>
170 </div>
171 </div>
172 </body>
173</html> \ No newline at end of file
diff --git a/js/panels/Timeline/Layer.reel/Layer.js b/js/panels/Timeline/Layer.reel/Layer.js
new file mode 100644
index 00000000..f62c0b90
--- /dev/null
+++ b/js/panels/Timeline/Layer.reel/Layer.js
@@ -0,0 +1,627 @@
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
7var Montage = require("montage/core/core").Montage;
8var Component = require("montage/ui/component").Component;
9var Collapser = require("js/panels/Timeline/Collapser").Collapser;
10var Hintable = require("js/components/hintable.reel").Hintable;
11var LayerStyle = require("js/panels/Timeline/Style.reel").LayerStyle;
12var DynamicText = require("montage/ui/dynamic-text.reel").DynamicText;