diff options
Diffstat (limited to 'js/panels/Timeline/Style.reel/Style.js')
-rw-r--r-- | js/panels/Timeline/Style.reel/Style.js | 234 |
1 files changed, 138 insertions, 96 deletions
diff --git a/js/panels/Timeline/Style.reel/Style.js b/js/panels/Timeline/Style.reel/Style.js index c44a29f6..dc159a01 100644 --- a/js/panels/Timeline/Style.reel/Style.js +++ b/js/panels/Timeline/Style.reel/Style.js | |||
@@ -1,8 +1,32 @@ | |||
1 | /* <copyright> | 1 | /* <copyright> |
2 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> | 2 | Copyright (c) 2012, Motorola Mobility, Inc |
3 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> | 3 | All Rights Reserved. |
4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | 4 | BSD License. |
5 | </copyright> */ | 5 | |
6 | Redistribution and use in source and binary forms, with or without | ||
7 | modification, are permitted provided that the following conditions are met: | ||
8 | |||
9 | - Redistributions of source code must retain the above copyright notice, | ||
10 | this list of conditions and the following disclaimer. | ||
11 | - Redistributions in binary form must reproduce the above copyright | ||
12 | notice, this list of conditions and the following disclaimer in the | ||
13 | documentation and/or other materials provided with the distribution. | ||
14 | - Neither the name of Motorola Mobility nor the names of its contributors | ||
15 | may be used to endorse or promote products derived from this software | ||
16 | without specific prior written permission. | ||
17 | |||
18 | 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 | IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE | ||
21 | ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE | ||
22 | LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR | ||
23 | CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF | ||
24 | SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS | ||
25 | INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN | ||
26 | CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) | ||
27 | ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE | ||
28 | POSSIBILITY OF SUCH DAMAGE. | ||
29 | </copyright> */ | ||
6 | 30 | ||
7 | /* | 31 | /* |
8 | * Style component: Edits and manages a single style rule for a Layer in the Timeline. | 32 | * Style component: Edits and manages a single style rule for a Layer in the Timeline. |
@@ -17,38 +41,80 @@ | |||
17 | 41 | ||
18 | var Montage = require("montage/core/core").Montage; | 42 | var Montage = require("montage/core/core").Montage; |
19 | var Component = require("montage/ui/component").Component; | 43 | var Component = require("montage/ui/component").Component; |
20 | var ElementsMediator = require("js/mediators/element-mediator").ElementMediator | 44 | var ElementsMediator = require("js/mediators/element-mediator").ElementMediator |
21 | 45 | ||
22 | 46 | ||
23 | var LayerStyle = exports.LayerStyle = Montage.create(Component, { | 47 | var LayerStyle = exports.LayerStyle = Montage.create(Component, { |
24 | 48 | /* === BEGIN: Models === */ | |
49 | _parentLayerComponent: { | ||
50 | value: null | ||
51 | }, | ||
52 | |||
53 | _styleContainer: { | ||
54 | value: null | ||
55 | }, | ||
25 | styleContainer: { | 56 | styleContainer: { |
26 | value: null, | 57 | serializable: true, |
27 | serializable: true | 58 | get: function() { |
59 | return this._styleContainer; | ||
60 | }, | ||
61 | set: function(newVal) { | ||
62 | this._styleContainer = newVal; | ||
63 | } | ||
28 | }, | 64 | }, |
29 | 65 | ||
66 | _styleHintable: { | ||
67 | value: null | ||
68 | }, | ||
30 | styleHintable: { | 69 | styleHintable: { |
31 | value: null, | 70 | serializable: true, |
32 | serializable: true | 71 | get: function() { |
72 | return this._styleHintable; | ||
73 | }, | ||
74 | set: function(newVal) { | ||
75 | this._styleHintable = newVal; | ||
76 | } | ||
33 | }, | 77 | }, |
34 | 78 | ||
79 | _styleProperty: { | ||
80 | value: null | ||
81 | }, | ||
35 | styleProperty: { | 82 | styleProperty: { |
36 | value: null, | 83 | serializable: true, |
37 | serializable: true | 84 | get: function() { |
85 | return this._styleProperty; | ||
86 | }, | ||
87 | set: function(newVal) { | ||
88 | this._styleProperty = newVal; | ||
89 | } | ||
38 | }, | 90 | }, |
39 | 91 | ||
92 | _valueEditorHottext: { | ||
93 | value: null | ||
94 | }, | ||
40 | valueEditorHottext: { | 95 | valueEditorHottext: { |
41 | value: null, | 96 | serializable: true, |
42 | serializable: true | 97 | get: function() { |
98 | return this._valueEditorHottext; | ||
99 | }, | ||
100 | set: function(newVal) { | ||
101 | this._valueEditorHottext = newVal; | ||
102 | } | ||
43 | }, | 103 | }, |
44 | 104 | ||
105 | _dtextProperty: { | ||
106 | value: null | ||
107 | }, | ||
45 | dtextProperty: { | 108 | dtextProperty: { |
46 | value: null, | 109 | serializable: true, |
47 | serializable: true | 110 | get: function() { |
111 | return this._dtextProperty; | ||
112 | }, | ||
113 | set: function(newVal) { | ||
114 | this._dtextProperty = newVal; | ||
115 | } | ||
48 | }, | 116 | }, |
49 | 117 | ||
50 | /* === BEGIN: Models === */ | ||
51 | // isSelected: whether or not the style is selected | ||
52 | _isSelected: { | 118 | _isSelected: { |
53 | value: false | 119 | value: false |
54 | }, | 120 | }, |
@@ -66,9 +132,6 @@ var LayerStyle = exports.LayerStyle = Montage.create(Component, { | |||
66 | } | 132 | } |
67 | }, | 133 | }, |
68 | 134 | ||
69 | /* isActive: Whether or not the user is actively clicking within the style; used to communicate state with | ||
70 | * parent Layer. | ||
71 | */ | ||
72 | _isActive: { | 135 | _isActive: { |
73 | value: false | 136 | value: false |
74 | }, | 137 | }, |
@@ -139,6 +202,7 @@ var LayerStyle = exports.LayerStyle = Montage.create(Component, { | |||
139 | }, | 202 | }, |
140 | serializable: true | 203 | serializable: true |
141 | }, | 204 | }, |
205 | |||
142 | _myHintableValue : { | 206 | _myHintableValue : { |
143 | value: null | 207 | value: null |
144 | }, | 208 | }, |
@@ -194,13 +258,13 @@ var LayerStyle = exports.LayerStyle = Montage.create(Component, { | |||
194 | } | 258 | } |
195 | }, | 259 | }, |
196 | 260 | ||
197 | addedColorChips: | 261 | addedColorChips: { |
198 | { value: false }, | 262 | value: false |
263 | }, | ||
199 | 264 | ||
200 | _colorelement: { | 265 | _colorelement: { |
201 | writable:true | 266 | writable:true |
202 | }, | 267 | }, |
203 | |||
204 | colorelement: { | 268 | colorelement: { |
205 | enumerable: true, | 269 | enumerable: true, |
206 | get: function () { | 270 | get: function () { |
@@ -244,13 +308,21 @@ var LayerStyle = exports.LayerStyle = Montage.create(Component, { | |||
244 | this.init(); | 308 | this.init(); |
245 | } | 309 | } |
246 | }, | 310 | }, |
311 | willDraw: { | ||
312 | value: function() { | ||
313 | if (this._parentLayerComponent === null) { | ||
314 | this._parentLayerComponent = this.parentComponent.parentComponent.parentComponent.parentComponent; | ||
315 | } | ||
316 | } | ||
317 | }, | ||
247 | draw: { | 318 | draw: { |
248 | value: function() { | 319 | value: function() { |
249 | 320 | // Show the right view | |
250 | if (this._swapViews === true) { | 321 | if (this._swapViews === true) { |
251 | // Show the right thing | ||
252 | this._showView(); | 322 | this._showView(); |
253 | } | 323 | } |
324 | |||
325 | // Is this style selected? | ||
254 | if (this.isSelected) { | 326 | if (this.isSelected) { |
255 | this.element.classList.add("style-selected"); | 327 | this.element.classList.add("style-selected"); |
256 | } else { | 328 | } else { |
@@ -260,6 +332,7 @@ var LayerStyle = exports.LayerStyle = Montage.create(Component, { | |||
260 | 332 | ||
261 | } | 333 | } |
262 | }, | 334 | }, |
335 | |||
263 | didDraw: { | 336 | didDraw: { |
264 | value: function() { | 337 | value: function() { |
265 | if (this._swapViews === true) { | 338 | if (this._swapViews === true) { |
@@ -288,6 +361,41 @@ var LayerStyle = exports.LayerStyle = Montage.create(Component, { | |||
288 | this.whichView = "propval"; | 361 | this.whichView = "propval"; |
289 | } | 362 | } |
290 | }, | 363 | }, |
364 | |||
365 | handleFillColorChange: { | ||
366 | value: function (event) { | ||
367 | if(this.application.ninja.timeline.selectedStyle === "color" ||this.application.ninja.timeline.selectedStyle === this.editorProperty){ | ||
368 | var fillColorObject={}; | ||
369 | fillColorObject.color=even |