diff options
Diffstat (limited to 'js/panels/Timeline/Layer.reel/Layer.js')
-rw-r--r-- | js/panels/Timeline/Layer.reel/Layer.js | 184 |
1 files changed, 75 insertions, 109 deletions
diff --git a/js/panels/Timeline/Layer.reel/Layer.js b/js/panels/Timeline/Layer.reel/Layer.js index b23da749..b0f6d220 100644 --- a/js/panels/Timeline/Layer.reel/Layer.js +++ b/js/panels/Timeline/Layer.reel/Layer.js | |||
@@ -51,6 +51,7 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
51 | value: false | 51 | value: false |
52 | }, | 52 | }, |
53 | styleRepetition : { | 53 | styleRepetition : { |
54 | serializable: true, | ||
54 | get: function() { | 55 | get: function() { |
55 | return this._styleRepetition; | 56 | return this._styleRepetition; |
56 | }, | 57 | }, |
@@ -61,8 +62,17 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
61 | _styleCounter : { | 62 | _styleCounter : { |
62 | value: 0 | 63 | value: 0 |
63 | }, | 64 | }, |
65 | styleCounter:{ | ||
66 | serializable:true, | ||
67 | get:function () { | ||
68 | return this._styleCounter; | ||
69 | }, | ||
70 | set:function (newVal) { | ||
71 | this._styleCounter = newVal; | ||
72 | } | ||
73 | }, | ||
64 | 74 | ||
65 | /* Layer models: the name, ID, and selected and animation booleans for the layer */ | 75 | /* Layer models: the name, ID, and selected and animation booleans for the layer */ |
66 | _layerName:{ | 76 | _layerName:{ |
67 | value: "Default Layer Name" | 77 | value: "Default Layer Name" |
68 | }, | 78 | }, |
@@ -73,13 +83,13 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
73 | return this._layerName; | 83 | return this._layerName; |
74 | }, | 84 | }, |
75 | set:function(newVal){ | 85 | set:function(newVal){ |
76 | |||
77 | this._layerEditable.value = newVal; | 86 | this._layerEditable.value = newVal; |
78 | this._layerName = newVal; | 87 | this._layerName = newVal; |
79 | this.layerData.layerName = newVal; | 88 | this.layerData.layerName = newVal; |
80 | if (typeof(this.dynamicLayerName) !== "undefined") { | 89 | if (typeof(this.dynamicLayerName) !== "undefined") { |
81 | this.dynamicLayerName.value = newVal; | 90 | this.dynamicLayerName.value = newVal; |
82 | } | 91 | } |
92 | |||
83 | } | 93 | } |
84 | }, | 94 | }, |
85 | _layerID:{ | 95 | _layerID:{ |
@@ -137,7 +147,7 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
137 | } | 147 | } |
138 | }, | 148 | }, |
139 | 149 | ||
140 | /* Position and Transform hottext values */ | 150 | /* Position and Size hottext values */ |
141 | _dtextPositionX : { | 151 | _dtextPositionX : { |
142 | value:null | 152 | value:null |
143 | }, | 153 | }, |
@@ -210,60 +220,6 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
210 | } | 220 | } |
211 | }, | 221 | }, |
212 | 222 | ||
213 | _dtextSkewX : { | ||
214 | value:null | ||
215 | }, | ||
216 | |||
217 | dtextSkewX:{ | ||
218 | serializable: true, | ||
219 | get:function(){ | ||
220 | return this._dtextSkewX; | ||
221 | }, | ||
222 | set:function(value){ | ||
223 | if (this._dtextSkewX !== value) { | ||
224 | this._dtextSkewX = value; | ||
225 | this.layerData.dtextSkewX = value; | ||
226 | } | ||
227 | |||
228 | } | ||
229 | }, | ||
230 | |||
231 | _dtextSkewY : { | ||
232 | value:null | ||
233 | }, | ||
234 | |||
235 | dtextSkewY:{ | ||
236 | serializable: true, | ||
237 | get:function(){ | ||
238 | return this._dtextSkewY; | ||
239 | }, | ||
240 | set:function(value){ | ||
241 | if (this._dtextSkewY !== value) { | ||
242 | this._dtextSkewY = value; | ||
243 | this.layerData.dtextSkewY = value; | ||
244 | } | ||
245 | |||
246 | } | ||
247 | }, | ||
248 | |||
249 | _dtextRotate : { | ||
250 | value:null | ||
251 | }, | ||
252 | |||
253 | dtextRotate:{ | ||
254 | serializable: true, | ||
255 | get:function(){ | ||
256 | return this._dtextRotate; | ||
257 | }, | ||
258 | set:function(value){ | ||
259 | if (this._dtextRotate !== value) { | ||
260 | this._dtextRotate = value; | ||
261 | this.layerData.dtextRotate = value; | ||
262 | } | ||
263 | |||
264 | } | ||
265 | }, | ||
266 | |||
267 | /* isSelected: whether or not the layer is currently selected. */ | 223 | /* isSelected: whether or not the layer is currently selected. */ |
268 | _isSelected:{ | 224 | _isSelected:{ |
269 | value: false | 225 | value: false |
@@ -362,20 +318,6 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
362 | } | 318 | } |
363 | }, | 319 | }, |
364 | 320 | ||
365 | _isTransformCollapsed : { | ||
366 | value: true | ||
367 | }, | ||
368 | isTransformCollapsed : { | ||
369 | serializable: true, | ||
370 | get: function() { | ||
371 | return this._isTransformCollapsed; | ||
372 | }, | ||
373 | set: function(newVal) { | ||
374 | this._isTransformCollapsed = newVal; | ||
375 | this.layerData.isTransformCollapsed = newVal; | ||
376 | } | ||
377 | }, | ||
378 | |||
379 | _isPositionCollapsed : { | 321 | _isPositionCollapsed : { |
380 | value: true | 322 | value: true |
381 | }, | 323 | }, |
@@ -459,7 +401,6 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
459 | this.arrLayerStyles = this.layerData.arrLayerStyles; | 401 | this.arrLayerStyles = this.layerData.arrLayerStyles; |
460 | this.isMainCollapsed = this.layerData.isMainCollapsed; | 402 | this.isMainCollapsed = this.layerData.isMainCollapsed; |
461 | this.isPositionCollapsed = this.layerData.isPositionCollapsed; | 403 | this.isPositionCollapsed = this.layerData.isPositionCollapsed; |
462 | this.isTransformCollapsed = this.layerData.isTransformCollapsed; | ||
463 | this.isSelected = this.layerData.isSelected; | 404 | this.isSelected = this.layerData.isSelected; |
464 | this.isActive = this.layerData.isActive; | 405 | this.isActive = this.layerData.isActive; |
465 | this.isStyleCollapsed = this.layerData.isStyleCollapsed; | 406 | this.isStyleCollapsed = this.layerData.isStyleCollapsed; |
@@ -471,7 +412,7 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
471 | this.dtextScaleX = this.layerData.dtextScaleX; | 412 | this.dtextScaleX = this.layerData.dtextScaleX; |
472 | this.dtextScaleY = this.layerData.dtextScaleY; | 413 | this.dtextScaleY = this.layerData.dtextScaleY; |
473 | this.dtextRotate = this.layerData.dtextRotate; | 414 | this.dtextRotate = this.layerData.dtextRotate; |
474 | this._isFirstDraw = this.layerData._isFirstDraw; | 415 | //this._isFirstDraw = this.layerData._isFirstDraw; |
475 | this.layerTag = this.layerData.layerTag; | 416 | this.layerTag = this.layerData.layerTag; |
476 | this.isVisible = this.layerData.isVisible; | 417 | this.isVisible = this.layerData.isVisible; |
477 | this.isAnimated = this.layerData.isAnimated; | 418 | this.isAnimated = this.layerData.isAnimated; |
@@ -527,7 +468,6 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
527 | // Collapser event handlers. | 468 | // Collapser event handlers. |
528 | this.mainCollapser.clicker.addEventListener("click", this.handleMainCollapserClick.bind(this), false); | 469 | this.mainCollapser.clicker.addEventListener("click", this.handleMainCollapserClick.bind(this), false); |
529 | this.positionCollapser.clicker.addEventListener("click", this.handlePositionCollapserClick.bind(this), false); | 470 | this.positionCollapser.clicker.addEventListener("click", this.handlePositionCollapserClick.bind(this), false); |
530 | this.transformCollapser.clicker.addEventListener("click", this.handleTransformCollapserClick.bind(this), false); | ||
531 | this.styleCollapser.clicker.addEventListener("click", this.handleStyleCollapserClick.bind(this), false); | 471 | this.styleCollapser.clicker.addEventListener("click", this.handleStyleCollapserClick.bind(this), false); |
532 | 472 | ||
533 | // Add event listeners to add and delete style buttons | 473 | // Add event listeners to add and delete style buttons |
@@ -545,6 +485,11 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
545 | this.element.addEventListener("dragleave", this.handleDragleave.bind(this), false); | 485 | this.element.addEventListener("dragleave", this.handleDragleave.bind(this), false); |
546 | this.element.addEventListener("dragstart", this.handleDragstart.bind(this), false); | 486 | this.element.addEventListener("dragstart", this.handleDragstart.bind(this), false); |
547 | this.element.addEventListener("drop", this.handleDrop.bind(this), false); | 487 | this.element.addEventListener("drop", this.handleDrop.bind(this), false); |
488 | |||
489 | this.eventManager.addEventListener("updatedID", this, false); | ||
490 | |||
491 | |||
492 | |||
548 | } | 493 | } |
549 | }, | 494 | }, |
550 | draw: { | 495 | draw: { |
@@ -570,7 +515,28 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
570 | } | 515 | } |
571 | this._isFirstDraw = false; | 516 | this._isFirstDraw = false; |
572 | this.layerData._isFirstDraw = false; | 517 | this.layerData._isFirstDraw = false; |
518 | |||
519 | if (this.isMainCollapsed === false) { | ||
520 | this.mainCollapser.myContent.style.height = "auto"; | ||
521 | this.mainCollapser.myContent.classList.remove(this.mainCollapser.collapsedClass); | ||
522 | this.mainCollapser.clicker.classList.remove(this.mainCollapser.collapsedClass); | ||
523 | |||
524 | } | ||
525 | if (this.isPositionCollapsed === false) { | ||
526 | this.positionCollapser.myContent.style.height = "auto"; | ||
527 | this.positionCollapser.myContent.classList.remove(this.positionCollapser.collapsedClass); | ||
528 | this.positionCollapser.clicker.classList.remove(this.positionCollapser.collapsedClass); | ||
529 | } | ||
530 | if (this.isStyleCollapsed === false) { | ||
531 | this.styleCollapser.myContent.style.height = "auto"; | ||
532 | this.styleCollapser.myContent.classList.remove(this.styleCollapser.collapsedClass); | ||
533 | this.styleCollapser.clicker.classList.remove(this.styleCollapser.collapsedClass); | ||
534 | } | ||
535 | |||
573 | } | 536 | } |
537 | |||
538 | |||