diff options
Diffstat (limited to 'js/panels/Timeline/Style.reel/Style.js')
-rw-r--r-- | js/panels/Timeline/Style.reel/Style.js | 83 |
1 files changed, 42 insertions, 41 deletions
diff --git a/js/panels/Timeline/Style.reel/Style.js b/js/panels/Timeline/Style.reel/Style.js index 122c2c0a..01b4e90b 100644 --- a/js/panels/Timeline/Style.reel/Style.js +++ b/js/panels/Timeline/Style.reel/Style.js | |||
@@ -1,24 +1,25 @@ | |||
1 | /* <copyright> | 1 | /* <copyright> |
2 | Copyright (c) 2012, Motorola Mobility, Inc | 2 | Copyright (c) 2012, Motorola Mobility LLC. |
3 | All Rights Reserved. | 3 | All Rights Reserved. |
4 | BSD License. | ||
5 | 4 | ||
6 | Redistribution and use in source and binary forms, with or without | 5 | Redistribution and use in source and binary forms, with or without |
7 | modification, are permitted provided that the following conditions are met: | 6 | modification, are permitted provided that the following conditions are met: |
8 | 7 | ||
9 | - Redistributions of source code must retain the above copyright notice, | 8 | * Redistributions of source code must retain the above copyright notice, |
10 | this list of conditions and the following disclaimer. | 9 | this list of conditions and the following disclaimer. |
11 | - Redistributions in binary form must reproduce the above copyright | 10 | |
12 | notice, this list of conditions and the following disclaimer in the | 11 | * Redistributions in binary form must reproduce the above copyright notice, |
13 | documentation and/or other materials provided with the distribution. | 12 | this list of conditions and the following disclaimer in the documentation |
14 | - Neither the name of Motorola Mobility nor the names of its contributors | 13 | and/or other materials provided with the distribution. |
15 | may be used to endorse or promote products derived from this software | 14 | |
16 | without specific prior written permission. | 15 | * Neither the name of Motorola Mobility LLC nor the names of its |
16 | contributors may be used to endorse or promote products derived from this | ||
17 | software without specific prior written permission. | ||
17 | 18 | ||
18 | THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" | 19 | THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" |
19 | AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE | 20 | AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE |
20 | IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE | 21 | IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE |
21 | ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE | 22 | ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE |
22 | LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR | 23 | LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR |
23 | CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF | 24 | CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF |
24 | SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS | 25 | SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS |
@@ -32,11 +33,11 @@ POSSIBILITY OF SUCH DAMAGE. | |||
32 | * Style component: Edits and manages a single style rule for a Layer in the Timeline. | 33 | * Style component: Edits and manages a single style rule for a Layer in the Timeline. |
33 | * Public Properties: | 34 | * Public Properties: |
34 | * editorProperty: The CSS property for the style. | 35 | * editorProperty: The CSS property for the style. |
35 | * editorValue: The value for the editorProperty. | 36 | * editorValue: The value for the editorProperty. |
36 | * whichView: Which view to show, the hintable view (where a new property can be typed in) | 37 | * whichView: Which view to show, the hintable view (where a new property can be typed in) |
37 | * or the propval view (where the property's value can be set with the tweener). | 38 | * or the propval view (where the property's value can be set with the tweener). |
38 | * Valid values are "hintable" and "propval", defaults to "hintable". | 39 | * Valid values are "hintable" and "propval", defaults to "hintable". |
39 | * | 40 | * |
40 | */ | 41 | */ |
41 | 42 | ||
42 | var Montage = require("montage/core/core").Montage; | 43 | var Montage = require("montage/core/core").Montage; |
@@ -89,7 +90,7 @@ var LayerStyle = exports.LayerStyle = Montage.create(Component, { | |||
89 | } | 90 | } |
90 | } | 91 | } |
91 | }, | 92 | }, |
92 | 93 | ||
93 | /* isActive: Whether or not the user is actively clicking within the style; used to communicate state with | 94 | /* isActive: Whether or not the user is actively clicking within the style; used to communicate state with |
94 | * parent Layer. | 95 | * parent Layer. |
95 | */ | 96 | */ |
@@ -104,7 +105,7 @@ var LayerStyle = exports.LayerStyle = Montage.create(Component, { | |||
104 | this._isActive = newVal; | 105 | this._isActive = newVal; |
105 | } | 106 | } |
106 | }, | 107 | }, |
107 | 108 | ||
108 | // Property for this editor | 109 | // Property for this editor |
109 | _editorProperty: { | 110 | _editorProperty: { |
110 | value: "" | 111 | value: "" |
@@ -119,7 +120,7 @@ var LayerStyle = exports.LayerStyle = Montage.create(Component, { | |||
119 | this.needsDraw = true; | 120 | this.needsDraw = true; |
120 | } | 121 | } |
121 | }, | 122 | }, |
122 | 123 | ||
123 | // Value for the property for this editor. | 124 | // Value for the property for this editor. |
124 | _editorValue: { | 125 | _editorValue: { |
125 | value: "" | 126 | value: "" |
@@ -134,8 +135,8 @@ var LayerStyle = exports.LayerStyle = Montage.create(Component, { | |||
134 | this.needsDraw = true; | 135 | this.needsDraw = true; |
135 | } | 136 | } |
136 | }, | 137 | }, |
137 | 138 | ||
138 | // The tweener used to change the value for this property. | 139 | // The tweener used to change the value for this property. |
139 | _ruleTweener: { | 140 | _ruleTweener: { |
140 | value: false | 141 | value: false |
141 | }, | 142 | }, |
@@ -149,7 +150,7 @@ var LayerStyle = exports.LayerStyle = Montage.create(Component, { | |||
149 | this.needsDraw = true; | 150 | this.needsDraw = true; |
150 | } | 151 | } |
151 | }, | 152 | }, |
152 | 153 | ||
153 | // The hintable we use to change the Property | 154 | // The hintable we use to change the Property |
154 | _myHintable: { | 155 | _myHintable: { |
155 | value: "" | 156 | value: "" |
@@ -174,12 +175,12 @@ var LayerStyle = exports.LayerStyle = Montage.create(Component, { | |||
174 | this._myHintableValue = newVal; | 175 | this._myHintableValue = newVal; |
175 | } | 176 | } |
176 | }, | 177 | }, |
177 | 178 | ||
178 | // swapViews: Is a view swap happening? | 179 | // swapViews: Is a view swap happening? |
179 | _swapViews : { | 180 | _swapViews : { |
180 | value: true | 181 | value: true |
181 | }, | 182 | }, |
182 | 183 | ||
183 | // whichView: which view should we show: hintable or propval | 184 | // whichView: which view should we show: hintable or propval |
184 | _whichView : { | 185 | _whichView : { |
185 | value: "hintable" | 186 | value: "hintable" |
@@ -201,7 +202,7 @@ var LayerStyle = exports.LayerStyle = Montage.create(Component, { | |||
201 | } | 202 | } |
202 | } | 203 | } |
203 | }, | 204 | }, |
204 | 205 | ||
205 | // styleID: the id for this style; | 206 | // styleID: the id for this style; |
206 | // Used to publish events | 207 | // Used to publish events |
207 | _styleID : { | 208 | _styleID : { |
@@ -259,9 +260,9 @@ var LayerStyle = exports.LayerStyle = Montage.create(Component, { | |||
259 | this.isActive = true; | 260 | this.isActive = true; |
260 | } | 261 | } |
261 | }, | 262 | }, |
262 | 263 | ||
263 | /* === END: Models === */ | 264 | /* === END: Models === */ |
264 | 265 | ||
265 | /* === BEGIN : Draw cycle === */ | 266 | /* === BEGIN : Draw cycle === */ |
266 | prepareForDraw: { | 267 | prepareForDraw: { |
267 | value: function() { | 268 | value: function() { |
@@ -270,7 +271,7 @@ var LayerStyle = exports.LayerStyle = Montage.create(Component, { | |||
270 | }, | 271 | }, |
271 | draw: { | 272 | draw: { |
272 | value: function() { | 273 | value: function() { |
273 | 274 | ||
274 | if (this._swapViews === true) { | 275 | if (this._swapViews === true) { |
275 | // Show the right thing | 276 | // Show the right thing |
276 | this._showView(); | 277 | this._showView(); |
@@ -293,16 +294,16 @@ var LayerStyle = exports.LayerStyle = Montage.create(Component, { | |||
293 | } | 294 | } |
294 | }, | 295 | }, |
295 | /* === END: Draw cycle === */ | 296 | /* === END: Draw cycle === */ |
296 | 297 | ||
297 | /* === BEGIN: controllers === */ | 298 | /* === BEGIN: controllers === */ |
298 | 299 | ||
299 | // handleStylePropertyDblClick: What happens when the user double-clicks on the style property | 300 | // handleStylePropertyDblClick: What happens when the user double-clicks on the style property |
300 | handleStylePropertyDblclick: { | 301 | handleStylePropertyDblclick: { |
301 | value: function(event) { | 302 | value: function(event) { |
302 | this.whichView = "hintable"; | 303 | this.whichView = "hintable"; |
303 | } | 304 | } |
304 | }, | 305 | }, |
305 | 306 | ||
306 | // handleHintableStop: What happens when the hintable issues its stop event | 307 | // handleHintableStop: What happens when the hintable issues its stop event |
307 | handleHintableStop: { | 308 | handleHintableStop: { |
308 | value: function(event) { | 309 | value: function(event) { |
@@ -312,14 +313,14 @@ var LayerStyle = exports.LayerStyle = Montage.create(Component, { | |||
312 | this.whichView = "propval"; | 313 | this.whichView = "propval"; |
313 | } | 314 | } |
314 | }, | 315 | }, |
315 | 316 | ||
316 | // Init: Initialize the component with some useful selectors and other defaults. | 317 | // Init: Initialize the component with some useful selectors and other defaults. |
317 | init : { | 318 | init : { |
318 | value: function() { | 319 | value: function() { |
319 | 320 | ||
320 | var arrHints = [], | 321 | var arrHints = [], |
321 | i = 0; | 322 | i = 0; |
322 | 323 | ||
323 | // Get the array of hints from _myTweenables: | 324 | // Get the array of hints from _myTweenables: |
324 | for (i = 0; i < this._myTweenables.length; i++) { | 325 | for (i = 0; i < this._myTweenables.length; i++) { |
325 | arrHints.push(this._myTweenables[i].property) | 326 | arrHints.push(this._myTweenables[i].property) |
@@ -328,15 +329,15 @@ var LayerStyle = exports.LayerStyle = Montage.create(Component, { | |||
328 | // Set useful information for the hintable | 329 | // Set useful information for the hintable |
329 | this.myHintable.editingClass = "editable2"; | 330 | this.myHintable.editingClass = "editable2"; |
330 | this.myHintable.hints = arrHints; | 331 | this.myHintable.hints = arrHints; |
331 | 332 | ||
332 | // Bind a handler to the Hintable's change event | 333 | // Bind a handler to the Hintable's change event |