diff options
-rw-r--r-- | js/panels/Timeline/Layer.reel/Layer.js | 19 | ||||
-rw-r--r-- | js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | 69 |
2 files changed, 57 insertions, 31 deletions
diff --git a/js/panels/Timeline/Layer.reel/Layer.js b/js/panels/Timeline/Layer.reel/Layer.js index b41680be..069d3c4b 100644 --- a/js/panels/Timeline/Layer.reel/Layer.js +++ b/js/panels/Timeline/Layer.reel/Layer.js | |||
@@ -255,12 +255,11 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
255 | if (value !== this._isSelected) { | 255 | if (value !== this._isSelected) { |
256 | // Only concerned about different values | 256 | // Only concerned about different values |
257 | if (value === false) { | 257 | if (value === false) { |
258 | // If changing from false to true, we need to deselect any associated styles | 258 | // If changing from true to false, we need to deselect any associated styles |
259 | this.selectStyle(false); | 259 | this.selectStyle(false); |
260 | } | 260 | } |
261 | this._isSelected = value; | 261 | this._isSelected = value; |
262 | this.layerData.isSelected = value; | 262 | this.layerData.isSelected = value; |
263 | //this.needsDraw = true; | ||
264 | } | 263 | } |
265 | 264 | ||
266 | } | 265 | } |
@@ -381,7 +380,6 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
381 | return this._bypassAnimation; | 380 | return this._bypassAnimation; |
382 | }, | 381 | }, |
383 | set: function(newVal) { | 382 | set: function(newVal) { |
384 | //console.log("layer.js _bypassAnimation setter " + newVal) | ||
385 | this._bypassAnimation = newVal; | 383 | this._bypassAnimation = newVal; |
386 | } | 384 | } |
387 | }, | 385 | }, |
@@ -406,7 +404,6 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
406 | 404 | ||
407 | setData:{ | 405 | setData:{ |
408 | value:function(){ | 406 | value:function(){ |
409 | this.log('layer: setData called') | ||
410 | this.layerName = this.layerData.layerName; | 407 | this.layerName = this.layerData.layerName; |
411 | this.layerID = this.layerData.layerID; | 408 | this.layerID = this.layerData.layerID; |
412 | this.arrLayerStyles = this.layerData.arrLayerStyles; | 409 | this.arrLayerStyles = this.layerData.arrLayerStyles; |
@@ -424,9 +421,13 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
424 | this.dtextScaleX = this.layerData.dtextScaleX; | 421 | this.dtextScaleX = this.layerData.dtextScaleX; |
425 | this.dtextScaleY = this.layerData.dtextScaleY; | 422 | this.dtextScaleY = this.layerData.dtextScaleY; |
426 | this.dtextRotate = this.layerData.dtextRotate; | 423 | this.dtextRotate = this.layerData.dtextRotate; |
424 | this._isFirstDraw = this.layerData._isFirstDraw; | ||
427 | this.needsDraw = true; | 425 | this.needsDraw = true; |
428 | } | 426 | } |
429 | }, | 427 | }, |
428 | _isFirstDraw : { | ||
429 | value: true | ||
430 | }, | ||
430 | 431 | ||
431 | /* END: Models */ | 432 | /* END: Models */ |
432 | 433 | ||
@@ -483,6 +484,16 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
483 | } | 484 | } |
484 | } | 485 | } |
485 | }, | 486 | }, |
487 | didDraw: { | ||
488 | value: function() { | ||
489 | if ((this.isSelected === true) && (this._isFirstDraw === true)) { | ||
490 | // Once we're done drawing the first time we need to tell the TimelinePanel if | ||
491 | // this layer is supposed to be selected. | ||
492 | this.parentComponent.parentComponent.selectedLayerID = this.layerID; | ||
493 | this._isFirstDraw = false; | ||
494 | } | ||
495 | } | ||
496 | }, | ||
486 | /* End: Draw cycle */ | 497 | /* End: Draw cycle */ |
487 | 498 | ||
488 | /* Begin: Controllers */ | 499 | /* Begin: Controllers */ |
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index 1875c740..45a90355 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | |||
@@ -139,6 +139,28 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
139 | } | 139 | } |
140 | }, | 140 | }, |
141 | 141 | ||
142 | _selectedLayerID:{ | ||
143 | value: false | ||
144 | }, | ||
145 | selectedLayerID : { | ||
146 | get: function() { | ||
147 | return this._selectedLayerID; | ||
148 | }, | ||
149 | set: function(newVal) { | ||
150 | if (newVal === false) { | ||
151 | // We are clearing the timeline, so just set the value and return. | ||
152 | this._selectedLayerID = newVal; | ||
153 | return; | ||
154 | } | ||
155 | if (newVal !== this._selectedLayerID) { | ||
156 | var selectIndex = this.getLayerIndexByID(newVal); | ||
157 | this._selectedLayerID = newVal; | ||
158 | this._captureSelection = true; | ||
159 | this.selectLayer(selectIndex, true); | ||
160 | } | ||
161 | } | ||
162 | }, | ||
163 | |||
142 | millisecondsOffset:{ | 164 | millisecondsOffset:{ |
143 | value:1000 | 165 | value:1000 |
144 | }, | 166 | }, |
@@ -374,14 +396,11 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
374 | 396 | ||
375 | // Feed the new array of objects into the repetitions | 397 | // Feed the new array of objects into the repetitions |
376 | // and select the first layer. | 398 | // and select the first layer. |
399 | this.temparrLayers[0].layerData.isSelected = true; | ||
400 | this.temparrLayers[0].layerData._isFirstDraw = true; | ||
401 | |||
377 | this.arrLayers=this.temparrLayers; | 402 | this.arrLayers=this.temparrLayers; |
378 | 403 | ||
379 | // TODO: We need a better solution to this race condition than a timeout. | ||
380 | this._captureSelection = true; | ||
381 | var that = this; | ||
382 | setTimeout(function() { | ||
383 | that.selectLayer(0, true); | ||
384 | }, 1000) | ||
385 | } else { | 404 | } else { |
386 | // New document. Create default layer. | 405 | // New document. Create default layer. |
387 | this.createNewLayer(1); | 406 | this.createNewLayer(1); |
@@ -397,6 +416,15 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
397 | } else { | 416 | } else { |
398 | // we do have information stored. Use it. | 417 | // we do have information stored. Use it. |
399 | this._boolCacheArrays = false; | 418 | this._boolCacheArrays = false; |
419 | this._captureSelection = true; | ||
420 | //var myIndex = 0; | ||
421 | for (var i = 0; i < this.application.ninja.currentDocument.tlArrLayers.length; i++) { | ||
422 | if ( this.application.ninja.currentDocument.tlArrLayers[i].layerData.isSelected === true ) { | ||
423 | this.application.ninja.currentDocument.tlArrLayers[i].layerData._isFirstDraw = true; | ||
424 | } | ||
425 | } | ||
426 | |||
427 | |||
400 | this.arrLayers = this.application.ninja.currentDocument.tlArrLayers; | 428 | this.arrLayers = this.application.ninja.currentDocument.tlArrLayers; |
401 | this.currentLayerNumber = this.application.ninja.currentDocument.tllayerNumber; | 429 | this.currentLayerNumber = this.application.ninja.currentDocument.tllayerNumber; |
402 | this.currentLayerSelected = this.application.ninja.currentDocument.tlCurrentLayerSelected; | 430 | this.currentLayerSelected = this.application.ninja.currentDocument.tlCurrentLayerSelected; |
@@ -404,24 +432,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
404 | this.hashElementMapToLayer = this.application.ninja.currentDocument.tlElementHashTable; | 432 | this.hashElementMapToLayer = this.application.ninja.currentDocument.tlElementHashTable; |
405 | this.hashKey = this.application.ninja.currentDocument.hashKey; | 433 | this.hashKey = this.application.ninja.currentDocument.hashKey; |
406 | this._boolCacheArrays = true; | 434 | this._boolCacheArrays = true; |
407 | |||
408 | // Search through the arrLayers and select the layer that's already selected | ||
409 | var i = 0, | ||
410 | selectMe = 0, | ||
411 | arrLayersLength = this.arrLayers.length; | ||
412 | for (i = 0; i < arrLayersLength; i++) { | ||
413 | if (this.arrLayers[i].isSelected === true) { | ||
414 | selectMe = i; | ||
415 | } | ||
416 | } | ||
417 | |||
418 | |||
419 | this._captureSelection = true; | ||
420 | // TODO: Better solution than a timer. | ||
421 | var that = this; | ||
422 | setTimeout(function() { | ||
423 | that.selectLayer(selectMe, true); | ||
424 | }, 300) | ||
425 | } | 435 | } |
426 | } | 436 | } |
427 | }, | 437 | }, |
@@ -454,6 +464,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
454 | this._firstTimeLoaded=true; | 464 | this._firstTimeLoaded=true; |
455 | this.end_hottext.value = 25; | 465 | this.end_hottext.value = 25; |
456 | this.updateTrackContainerWidth(); | 466 | this.updateTrackContainerWidth(); |
467 | this.selectedLayerID = false; | ||
457 | 468 | ||
458 | // Clear the repetitions | 469 | // Clear the repetitions |
459 | if (this.arrLayers.length > 0) { | 470 | if (this.arrLayers.length > 0) { |
@@ -464,9 +475,12 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
464 | 475 | ||
465 | handleDocumentChange:{ | 476 | handleDocumentChange:{ |
466 | value:function(event){ | 477 | value:function(event){ |
478 | // Clear the timeline but not the cache | ||
467 | this._boolCacheArrays = false; | 479 | this._boolCacheArrays = false; |
468 | this.clearTimelinePanel(); | 480 | this.clearTimelinePanel(); |
469 | this._boolCacheArrays = true; | 481 | this._boolCacheArrays = true; |
482 | |||
483 | // Rebind the document events for the new document context | ||
470 | this._bindDocumentEvents(); | 484 | this._bindDocumentEvents(); |
471 | 485 | ||
472 | this.hashInstance = this.createLayerHashTable(); | 486 | this.hashInstance = this.createLayerHashTable(); |
@@ -1008,11 +1022,12 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
1008 | if(this.selectedKeyframes){ | 1022 | if(this.selectedKeyframes){ |
1009 | this.deselectTweens(); | 1023 | this.deselectTweens(); |
1010 | } | 1024 | } |
1025 | |||
1011 | for (i = 0; i < arrLayersLength; i++) { |