diff options
author | Jon Reid | 2012-03-09 15:34:46 -0800 |
---|---|---|
committer | Jon Reid | 2012-03-09 15:34:46 -0800 |
commit | ebe6a42bdf76d53a985dec528ad9702df3738f56 (patch) | |
tree | 8f60b3f4d2a95a7882a2ad336f6eeb219805ab29 | |
parent | c9fd12017da554a3962e3fef01ac42ec69d02001 (diff) | |
download | ninja-ebe6a42bdf76d53a985dec528ad9702df3738f56.tar.gz |
Timeline: Fixes for deleting layers, layer selection, persisting layer name edits and selection between document switching.
-rw-r--r-- | js/panels/Timeline/Layer.reel/Layer.js | 6 | ||||
-rw-r--r-- | js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | 109 |
2 files changed, 66 insertions, 49 deletions
diff --git a/js/panels/Timeline/Layer.reel/Layer.js b/js/panels/Timeline/Layer.reel/Layer.js index e561e45d..b41680be 100644 --- a/js/panels/Timeline/Layer.reel/Layer.js +++ b/js/panels/Timeline/Layer.reel/Layer.js | |||
@@ -82,8 +82,8 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
82 | if (newVal !== this._layerName) { | 82 | if (newVal !== this._layerName) { |
83 | this._layerEditable.value = newVal; | 83 | this._layerEditable.value = newVal; |
84 | this._layerName = newVal; | 84 | this._layerName = newVal; |
85 | //this._layerEditable.needsDraw = true; | 85 | this.layerData.layerName = newVal; |
86 | //this.needsDraw = true; | 86 | this.log('layerName setter: ' + newVal) |
87 | } | 87 | } |
88 | 88 | ||
89 | } | 89 | } |
@@ -259,6 +259,7 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
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.needsDraw = true; | 263 | //this.needsDraw = true; |
263 | } | 264 | } |
264 | 265 | ||
@@ -405,6 +406,7 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
405 | 406 | ||
406 | setData:{ | 407 | setData:{ |
407 | value:function(){ | 408 | value:function(){ |
409 | this.log('layer: setData called') | ||
408 | this.layerName = this.layerData.layerName; | 410 | this.layerName = this.layerData.layerName; |
409 | this.layerID = this.layerData.layerID; | 411 | this.layerID = this.layerData.layerID; |
410 | this.arrLayerStyles = this.layerData.arrLayerStyles; | 412 | this.arrLayerStyles = this.layerData.arrLayerStyles; |
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index a1730b37..8ae801fc 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | |||
@@ -126,9 +126,18 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
126 | } | 126 | } |
127 | }, | 127 | }, |
128 | 128 | ||
129 | currentLayerSelected:{ | 129 | _currentLayerSelected:{ |
130 | value: null | 130 | value: null |
131 | }, | 131 | }, |
132 | currentLayerSelected : { | ||
133 | get: function() { | ||
134 | return this._currentLayerSelected; | ||
135 | }, | ||
136 | set: function(newVal) { | ||
137 | this._currentLayerSelected = newVal; | ||
138 | this.application.ninja.currentDocument.tlCurrentLayerSelected = newVal; | ||
139 | } | ||
140 | }, | ||
132 | 141 | ||
133 | millisecondsOffset:{ | 142 | millisecondsOffset:{ |
134 | value:1000 | 143 | value:1000 |
@@ -391,10 +400,29 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
391 | this._boolCacheArrays = false; | 400 | this._boolCacheArrays = false; |
392 | this.arrLayers = this.application.ninja.currentDocument.tlArrLayers; | 401 | this.arrLayers = this.application.ninja.currentDocument.tlArrLayers; |
393 | this.currentLayerNumber = this.application.ninja.currentDocument.tllayerNumber; | 402 | this.currentLayerNumber = this.application.ninja.currentDocument.tllayerNumber; |
403 | this.currentLayerSelected = this.application.ninja.currentDocument.tlCurrentLayerSelected; | ||
394 | this.hashInstance = this.application.ninja.currentDocument.tlLayerHashTable; | 404 | this.hashInstance = this.application.ninja.currentDocument.tlLayerHashTable; |
395 | this.hashElementMapToLayer = this.application.ninja.currentDocument.tlElementHashTable; | 405 | this.hashElementMapToLayer = this.application.ninja.currentDocument.tlElementHashTable; |
396 | this.hashKey = this.application.ninja.currentDocument.hashKey; | 406 | this.hashKey = this.application.ninja.currentDocument.hashKey; |
397 | this._boolCacheArrays = true; | 407 | this._boolCacheArrays = true; |
408 | |||
409 | // Search through the arrLayers and select the layer that's already selected | ||
410 | var i = 0, | ||
411 | selectMe = 0, | ||
412 | arrLayersLength = this.arrLayers.length; | ||
413 | for (i = 0; i < arrLayersLength; i++) { | ||
414 | if (this.arrLayers[i].isSelected === true) { | ||
415 | selectMe = i; | ||
416 | } | ||
417 | } | ||
418 | |||
419 | |||
420 | this._captureSelection = true; | ||
421 | // TODO: Better solution than a timer. | ||
422 | var that = this; | ||
423 | setTimeout(function() { | ||
424 | that.selectLayer(selectMe, true); | ||
425 | }, 300) | ||
398 | } | 426 | } |
399 | } | 427 | } |
400 | }, | 428 | }, |
@@ -651,7 +679,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
651 | // layer on top of it. | 679 | // layer on top of it. |
652 | myIndex = this.layerRepetition.selectedIndexes[0]; | 680 | myIndex = this.layerRepetition.selectedIndexes[0]; |
653 | thingToPush.layerData.layerPosition = myIndex; | 681 | thingToPush.layerData.layerPosition = myIndex; |
654 | thingToPush.layerData.isSelected = true; | ||
655 | thingToPush.layerData.trackPosition = myIndex; | 682 | thingToPush.layerData.trackPosition = myIndex; |
656 | this.arrLayers.splice(myIndex, 0, thingToPush); | 683 | this.arrLayers.splice(myIndex, 0, thingToPush); |
657 | this._LayerUndoPosition = myIndex; | 684 | this._LayerUndoPosition = myIndex; |
@@ -665,13 +692,21 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
665 | this._LayerUndoPosition = this.arrLayers.length - 1; | 692 | this._LayerUndoPosition = this.arrLayers.length - 1; |
666 | //this.hashLayerNumber.setItem(this.hashKey, thingToPush.layerData); | 693 | //this.hashLayerNumber.setItem(this.hashKey, thingToPush.layerData); |
667 | this.hashInstance.setItem(this.hashKey, thingToPush.layerData, thingToPush.layerData.layerPosition); | 694 | this.hashInstance.setItem(this.hashKey, thingToPush.layerData, thingToPush.layerData.layerPosition); |
695 | indexToSelect = this.arrLayers.length -1; | ||
668 | } | 696 | } |
669 | 697 | ||
670 | this._LayerUndoObject = thingToPush; | 698 | this._LayerUndoObject = thingToPush; |
671 | this._LayerUndoIndex = thingToPush.layerData.layerID; | 699 | this._LayerUndoIndex = thingToPush.layerData.layerID; |
672 | this._LayerUndoStatus = true; | 700 | this._LayerUndoStatus = true; |
673 | 701 | ||
674 | this.selectLayer(indexToSelect, true); | 702 | this._captureSelection = true; |
703 | |||
704 | // TODO: Find a better solution than a timout here. | ||
705 | var that = this; | ||
706 | setTimeout(function() { | ||
707 | that.selectLayer(indexToSelect, true); | ||
708 | }, 500); | ||
709 | |||
675 | } | 710 | } |
676 | 711 | ||
677 | } | 712 | } |
@@ -768,36 +803,23 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
768 | hashVariable++; | 803 | hashVariable++; |
769 | } | 804 | } |
770 | } | 805 | } |
771 | } | 806 | } else { |
772 | else { | 807 | // Only delete a selected layer. If no layer is selected, do nothing. |
773 | if (!!this.layerRepetition.selectedIndexes) { | 808 | if (this.layerRepetition.selectedIndexes.length > 0) { |
774 | 809 | // Delete the selected item. | |
775 | var myIndex = this.layerRepetition.selectedIndexes[0]; | 810 | var myIndex = this.layerRepetition.selectedIndexes[0]; |
776 | this._LayerUndoObject = this.arrLayers[myIndex]; | 811 | this._LayerUndoObject = this.arrLayers[myIndex]; |
777 | 812 | ||
778 | dLayer = this.hashInstance.getItem(this.hashKey); | 813 | // Deleting a layer should delete associated elements, |
779 | dLayer[myIndex].layerData.deleted = true; | 814 | // But the hash tables are messed up. |
815 | // TODO: Kruti can you fix this? | ||
816 | //dLayer = this.hashInstance.getItem(this.hashKey); | ||
817 | //dLayer[myIndex].layerData.deleted = true; | ||
818 | // ElementMediator.deleteElements(dLayer[myIndex].layerData.elementsList); | ||
780 | 819 | ||
781 | this.arrLayers.splice(myIndex, 1); | 820 | this.arrLayers.splice(myIndex, 1); |
782 | this._LayerUndoIndex = this._LayerUndoObject.layerData.layerID; | 821 | this._LayerUndoIndex = this._LayerUndoObject.layerData.layerID; |
783 | this._LayerUndoPosition = myIndex; | 822 | this._LayerUndoPosition = myIndex; |
784 | |||
785 | if(myIndex===0){ | ||
786 | this.selectLayer(0); | ||
787 | } | ||
788 | else{ | ||
789 | this.selectLayer(myIndex-1); | ||
790 | } | ||
791 | ElementMediator.deleteElements(dLayer[myIndex].layerData.elementsList); | ||
792 | |||
793 | } else { | ||
794 | dLayer = this.hashInstance.getItem(this.hashKey); | ||
795 | dLayer[this.arrLayers.length - 1].layerData.deleted = true; | ||
796 | ElementMediator.deleteElements(dLayer[this.arrLayers.length - 1].layerData.elementsList); | ||
797 | this._LayerUndoPosition = this.arrLayers.length - 1; | ||
798 | this._LayerUndoObject = this.arrLayers.pop(); | ||
799 | this._LayerUndoIndex = this._LayerUndoObject.layerData.layerID; | ||
800 | |||
801 | } | 823 | } |
802 | } | 824 | } |
803 | } | 825 | } |
@@ -981,38 +1003,31 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
981 | value:function (layerIndex, userSelection) { | 1003 | value:function (layerIndex, userSelection) { |
982 | var i = 0; | 1004 | var i = 0; |
983 | var arrLayersLength = this.arrLayers.length; | 1005 | var arrLayersLength = this.arrLayers.length; |
984 | 1006 | ||
985 | if(this.selectedKeyframes){ | 1007 | if(this.selectedKeyframes){ |
986 | this.deselectTweens(); | 1008 | this.deselectTweens(); |
987 | } | 1009 | } |
988 | for (i = 0; i < arrLayersLength; i++) { | 1010 | for (i = 0; i < arrLayersLength; i++) { |
989 | if (i === layerIndex) { | 1011 | if (i === layerIndex) { |
990 | this.arrLayers[i]. |