From 21c941bd1fe55e511a72bfa5dc3019748158bd4a Mon Sep 17 00:00:00 2001 From: Jon Reid Date: Thu, 15 Mar 2012 15:00:45 -0700 Subject: Timeline: Fix for layer selection problems on file open and switch. --- js/panels/Timeline/Layer.reel/Layer.js | 19 ++++-- .../Timeline/TimelinePanel.reel/TimelinePanel.js | 69 +++++++++++++--------- 2 files changed, 57 insertions(+), 31 deletions(-) (limited to 'js/panels/Timeline') 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, { if (value !== this._isSelected) { // Only concerned about different values if (value === false) { - // If changing from false to true, we need to deselect any associated styles + // If changing from true to false, we need to deselect any associated styles this.selectStyle(false); } this._isSelected = value; this.layerData.isSelected = value; - //this.needsDraw = true; } } @@ -381,7 +380,6 @@ var Layer = exports.Layer = Montage.create(Component, { return this._bypassAnimation; }, set: function(newVal) { - //console.log("layer.js _bypassAnimation setter " + newVal) this._bypassAnimation = newVal; } }, @@ -406,7 +404,6 @@ var Layer = exports.Layer = Montage.create(Component, { setData:{ value:function(){ - this.log('layer: setData called') this.layerName = this.layerData.layerName; this.layerID = this.layerData.layerID; this.arrLayerStyles = this.layerData.arrLayerStyles; @@ -424,9 +421,13 @@ var Layer = exports.Layer = Montage.create(Component, { this.dtextScaleX = this.layerData.dtextScaleX; this.dtextScaleY = this.layerData.dtextScaleY; this.dtextRotate = this.layerData.dtextRotate; + this._isFirstDraw = this.layerData._isFirstDraw; this.needsDraw = true; } }, + _isFirstDraw : { + value: true + }, /* END: Models */ @@ -482,6 +483,16 @@ var Layer = exports.Layer = Montage.create(Component, { this.element.classList.remove("selected"); } } + }, + didDraw: { + value: function() { + if ((this.isSelected === true) && (this._isFirstDraw === true)) { + // Once we're done drawing the first time we need to tell the TimelinePanel if + // this layer is supposed to be selected. + this.parentComponent.parentComponent.selectedLayerID = this.layerID; + this._isFirstDraw = false; + } + } }, /* End: Draw cycle */ diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index 1afb9e5a..212b933e 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, { } }, + _selectedLayerID:{ + value: false + }, + selectedLayerID : { + get: function() { + return this._selectedLayerID; + }, + set: function(newVal) { + if (newVal === false) { + // We are clearing the timeline, so just set the value and return. + this._selectedLayerID = newVal; + return; + } + if (newVal !== this._selectedLayerID) { + var selectIndex = this.getLayerIndexByID(newVal); + this._selectedLayerID = newVal; + this._captureSelection = true; + this.selectLayer(selectIndex, true); + } + } + }, + millisecondsOffset:{ value:1000 }, @@ -374,14 +396,11 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { // Feed the new array of objects into the repetitions // and select the first layer. + this.temparrLayers[0].layerData.isSelected = true; + this.temparrLayers[0].layerData._isFirstDraw = true; + this.arrLayers=this.temparrLayers; - - // TODO: We need a better solution to this race condition than a timeout. - this._captureSelection = true; - var that = this; - setTimeout(function() { - that.selectLayer(0, true); - }, 1000) + } else { // New document. Create default layer. this.createNewLayer(1); @@ -397,6 +416,15 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { } else { // we do have information stored. Use it. this._boolCacheArrays = false; + this._captureSelection = true; + //var myIndex = 0; + for (var i = 0; i < this.application.ninja.currentDocument.tlArrLayers.length; i++) { + if ( this.application.ninja.currentDocument.tlArrLayers[i].layerData.isSelected === true ) { + this.application.ninja.currentDocument.tlArrLayers[i].layerData._isFirstDraw = true; + } + } + + this.arrLayers = this.application.ninja.currentDocument.tlArrLayers; this.currentLayerNumber = this.application.ninja.currentDocument.tllayerNumber; this.currentLayerSelected = this.application.ninja.currentDocument.tlCurrentLayerSelected; @@ -404,24 +432,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this.hashElementMapToLayer = this.application.ninja.currentDocument.tlElementHashTable; this.hashKey = this.application.ninja.currentDocument.hashKey; this._boolCacheArrays = true; - - // Search through the arrLayers and select the layer that's already selected - var i = 0, - selectMe = 0, - arrLayersLength = this.arrLayers.length; - for (i = 0; i < arrLayersLength; i++) { - if (this.arrLayers[i].isSelected === true) { - selectMe = i; - } - } - - - this._captureSelection = true; - // TODO: Better solution than a timer. - var that = this; - setTimeout(function() { - that.selectLayer(selectMe, true); - }, 300) } } }, @@ -454,6 +464,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this._firstTimeLoaded=true; this.end_hottext.value = 25; this.updateTrackContainerWidth(); + this.selectedLayerID = false; // Clear the repetitions if (this.arrLayers.length > 0) { @@ -464,9 +475,12 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { handleDocumentChange:{ value:function(event){ + // Clear the timeline but not the cache this._boolCacheArrays = false; this.clearTimelinePanel(); this._boolCacheArrays = true; + + // Rebind the document events for the new document context this._bindDocumentEvents(); this.hashInstance = this.createLayerHashTable(); @@ -1008,11 +1022,12 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { if(this.selectedKeyframes){ this.deselectTweens(); } + for (i = 0; i < arrLayersLength; i++) { if (i === layerIndex) { - this.arrLayers[i].isSelected = true; + this.arrLayers[i].layerData.isSelected = true; } else { - this.arrLayers[i].isSelected = false; + this.arrLayers[i].layerData.isSelected = false; } } -- cgit v1.2.3