From 27b3209543a1884e562436b1a9aa842bea1cbc9c Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Fri, 16 Mar 2012 12:21:32 -0700 Subject: Start enforcing one element per layer Signed-off-by: Jonathan Duran --- .../Timeline/TimelinePanel.reel/TimelinePanel.js | 128 +++++++++++++++------ 1 file changed, 91 insertions(+), 37 deletions(-) (limited to 'js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js') diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index a1e320c4..528d1fbf 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js @@ -68,7 +68,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { value: function() { if (this._boolCacheArrays) { this.application.ninja.currentDocument.tlArrLayers = this.arrLayers; - } } }, @@ -102,6 +101,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { } }, + // TODO - Remove hash tables _hashKey:{ value:0 }, @@ -126,6 +126,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { } }, + _currentLayerSelected:{ value: null }, @@ -156,7 +157,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { var selectIndex = this.getLayerIndexByID(newVal); this._selectedLayerID = newVal; this._captureSelection = true; - this.selectLayer(selectIndex, true); + this.selectLayer(selectIndex); } } }, @@ -226,17 +227,17 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { _breadCrumbContainer:{ value:null - }, + }, breadCrumbContainer: { + get: function() { + return this._breadCrumbContainer; + }, set: function(value) { if(this._breadCrumbContainer !== value) { this._breadCrumbContainer = value; this.LayerBinding(this.application.ninja.currentSelectedContainer); } - }, - get: function() { - return this._breadCrumbContainer; } }, @@ -346,10 +347,12 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { value: function() { this.layout_tracks = this.element.querySelector(".layout-tracks"); this.layout_markers = this.element.querySelector(".layout_markers"); - this.newlayer_button.identifier = "addLayer"; - this.newlayer_button.addEventListener("click", this, false); - this.deletelayer_button.identifier = "deleteLayer"; - this.deletelayer_button.addEventListener("click", this, false); + + //this.newlayer_button.identifier = "addLayer"; + //this.newlayer_button.addEventListener("click", this, false); + //this.deletelayer_button.identifier = "deleteLayer"; + //this.deletelayer_button.addEventListener("click", this, false); + this.timeline_leftpane.addEventListener("click", this.timelineLeftPaneClick.bind(this), false); this.layout_tracks.addEventListener("scroll", this.updateLayerScroll.bind(this), false); this.user_layers.addEventListener("scroll", this.updateLayerScroll.bind(this), false); @@ -374,8 +377,13 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this.application.ninja.currentDocument.isTimelineInitialized = true; this.application.ninja.currentDocument.tlArrLayers = []; this.application.ninja.currentDocument.tllayerNumber = 0; + + // TODO - Remove hash this.application.ninja.currentDocument.tlLayerHashTable=[]; + this.temparrLayers = []; + + // TODO - Remove hash this.hashKey = this.application.ninja.currentSelectedContainer.uuid; // Are we creating a new doc, or opening an existing one? @@ -391,24 +399,26 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { } } else { // No, it has no DOM elements. Build an empty layer object. - this.restoreLayer(1); + //this.restoreLayer(1); } // 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.temparrLayers[0].layerData.isSelected = true; + //this.temparrLayers[0].layerData._isFirstDraw = true; this.arrLayers=this.temparrLayers; } else { // New document. Create default layer. - this.createNewLayer(1); + //this.createNewLayer(1); } // After recreating the tracks and layers, store the result in the currentDocument. this.application.ninja.currentDocument.tlArrLayers = this.arrLayers; this.application.ninja.currentDocument.tllayerNumber = this.currentLayerNumber; + + // TODO - Remove both hashes? this.application.ninja.currentDocument.tlLayerHashTable = this.hashInstance; this.application.ninja.currentDocument.tlElementHashTable = this.hashElementMapToLayer; this.application.ninja.currentDocument.hashKey=this.hashKey; @@ -427,6 +437,8 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this.arrLayers = this.application.ninja.currentDocument.tlArrLayers; this.currentLayerNumber = this.application.ninja.currentDocument.tllayerNumber; this.currentLayerSelected = this.application.ninja.currentDocument.tlCurrentLayerSelected; + + // TODO - remove hash this.hashInstance = this.application.ninja.currentDocument.tlLayerHashTable; this.hashElementMapToLayer = this.application.ninja.currentDocument.tlElementHashTable; this.hashKey = this.application.ninja.currentDocument.hashKey; @@ -452,8 +464,8 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this.timebar.style.width = "0px"; // Clear variables. - this.hashInstance = null; - this.hashElementMapToLayer = null; + this.hashInstance = null; // TODO - remove hash + this.hashElementMapToLayer = null; // TODO - remove hash this.currentLayerNumber = 0; this.currentLayerSelected = false; this.selectedKeyframes = []; @@ -481,7 +493,8 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { // Rebind the document events for the new document context this._bindDocumentEvents(); - + + // TODO - remove hash this.hashInstance = this.createLayerHashTable(); this.hashElementMapToLayer = this.createElementMapToLayer(); @@ -541,8 +554,12 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { value:function(){ var key , switchSelectedLayer,layerIndex; this.deselectTweens(); + if(this.application.ninja.selectedElements[0]){ + + // TODO - element uuid should be stored directly in layer array (possibly as the layerID) key = this.application.ninja.selectedElements[0].uuid; + switchSelectedLayer = this.hashElementMapToLayer.getItem(key); if(switchSelectedLayer!==undefined){ layerIndex = this.getLayerIndexByID(switchSelectedLayer.layerID); @@ -622,11 +639,14 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this._firstTimeLoaded = false; } else { this.arrLayers.length = 0; - this.hashKey = node.uuid; + // TODO - remove hash + this.hashKey = node.uuid; if (this.returnedObject = this.hashInstance.getItem(this.hashKey)) { this._hashFind = true; } + + this.currentLayerNumber = 0; this.createNewLayer(1); this.selectLayer(0); @@ -679,6 +699,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { var newLayerName = "", thingToPush = this.createLayerTemplate(), myIndex = 0, + // unused var? indexToSelect = 0; this.currentLayerNumber = this.currentLayerNumber + 1; newLayerName = "Layer " + this.currentLayerNumber; @@ -688,6 +709,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { thingToPush.parentElement = this.application.ninja.currentSelectedContainer; thingToPush.layerData.isSelected = true; thingToPush.layerData._isFirstDraw = true; + thingToPush.layerData.created = true; for (var i = 0; i < this.arrLayers.length; i++) { this.arrLayers[i].layerData.isSelected = false; @@ -702,25 +724,29 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { thingToPush.layerData.trackPosition = myIndex; this.arrLayers.splice(myIndex, 0, thingToPush); this._LayerUndoPosition = myIndex; + //this.hashLayerNumber.setItem(this.hashKey, thingToPush.layerData); this.hashInstance.setItem(this.hashKey, thingToPush.layerData, myIndex); + // unused var indexToSelect = myIndex; } else { thingToPush.layerData.layerPosition = this.arrLayers.length - 1; this.arrLayers.push(thingToPush); this._LayerUndoPosition = this.arrLayers.length - 1; + //this.hashLayerNumber.setItem(this.hashKey, thingToPush.layerData); this.hashInstance.setItem(this.hashKey, thingToPush.layerData, thingToPush.layerData.layerPosition); - indexToSelect = this.arrLayers.length -1; + // unused var + indexToSelect = this.arrLayers.length -1; } this._LayerUndoObject = thingToPush; this._LayerUndoIndex = thingToPush.layerData.layerID; this._LayerUndoStatus = true; + this.selectLayer(myIndex); } - } }, @@ -756,6 +782,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this.temparrLayers.push(thingToPush); thingToPush.layerData.trackPosition = this.temparrLayers.length - 1; thingToPush.layerData.layerPosition = this.temparrLayers.length - 1; + this.hashInstance.setItem(this.hashKey, thingToPush.layerData, thingToPush.layerData.layerPosition); if(this._openDoc) { @@ -763,18 +790,16 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this.hashElementMapToLayer.setItem(ele.uuid,ele,this.temparrLayers[selectedIndex]); this._openDoc=false; } - /* - this._LayerUndoObject = thingToPush; - this._LayerUndoIndex = thingToPush.layerData.layerID; - this._LayerUndoStatus = true; - */ } } }, deleteLayer:{ value:function (object) { + // unusused variables and duplicate declaration of var index var dLayer,parentNode, hashVariable = 0, k = 0, index = 0, j = 0,a=0; + + // should now be able to delete the last layer if (this.arrLayers.length > 0) { if (object._undoStatus) { if (object._el.parentElementUUID !== this.application.ninja.currentSelectedContainer.uuid) { @@ -844,25 +869,50 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { handleElementAdded:{ value:function (event) { - event.detail.uuid=nj.generateRandom(); - if(this.currentLayerSelected.layerData.elementsList[0]!==undefined){ - if(this.currentLayerSelected.layerData.isTrackAnimated){ + this.insertLayer(); + console.log("inserting layer"); + + this.addElementToLayer(this.application.ninja.selectedElements[0]); + } + }, + + addElementToLayer:{ + value:function (element) { + + + console.log("setting element to layer"); + console.log(element); + console.log(this.currentLayerSelected.layerData); + + //element.uuid = nj.generateRandom(); + + // this should be unneeded with one element per layer restriction + if (this.currentLayerSelected.layerData.elementsList[0] !== undefined) { + + if (this.currentLayerSelected.layerData.isTrackAnimated) { // need to prevent element adding to dom, not just clear the drawing canvas - //this.application.ninja.stage.clearDrawingCanvas(); + // this should be unneeded with one element per layer restriction console.log("cannot add elements to a layer with animated element"); - }else{ - this.hashElementMapToLayer.setItem(event.detail.uuid, event.detail,this.currentLayerSelected); - this.currentLayerSelected.layerData.elementsList.push(event.detail); + } else { + //this.hashElementMapToLayer.setItem(element.uuid, element, this.currentLayerSelected); + + // should be simple assignment to var instead of array + this.currentLayerSelected.layerData.elementsList.push(element._element); + //this.currentLayerSelected.layerData.layerElement = event.detail; } - }else{ - this.hashElementMapToLayer.setItem(event.detail.uuid, event.detail,this.currentLayerSelected); - this.currentLayerSelected.layerData.elementsList.push(event.detail); + } else { + //this.hashElementMapToLayer.setItem(element.uuid, element, this.currentLayerSelected); + this.currentLayerSelected.layerData.elementsList.push(element._element); } } }, handleElementDeleted:{ value:function (event) { + + // With one element per layer restriction + // Deleting an element on stage should simply delete it's associated layer + var length,lengthVal; this.deleteElement = event.detail; lengthVal = this.currentLayerSelected.layerData.elementsList.length - 1; @@ -1014,6 +1064,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { selectLayer:{ value:function (layerIndex, userSelection) { + var i = 0; var arrLayersLength = this.arrLayers.length; @@ -1031,13 +1082,16 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this.layerRepetition.selectedIndexes = [layerIndex]; this.currentLayerSelected = this.arrLayers[layerIndex]; + if(userSelection){ if(this._captureSelection){ + if(this.currentLayerSelected.layerData.elementsList.length >= 1) { this.application.ninja.selectionController.selectElements(this.currentLayerSelected.layerData.elementsList); } else { this.application.ninja.selectionController.executeSelectElement(); } + } this._captureSelection = true; } @@ -1101,8 +1155,8 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { }, insertLayer:{ - value:function () { - var cmd = this.addLayerCommand(); + value:function (element) { + var cmd = this.addLayerCommand(element); cmd.execute(); cmd._el = this._LayerUndoObject; cmd._layerID = this._LayerUndoIndex; -- cgit v1.2.3 From f9891da6d6c6940f218cdc6d1e71e1c027852f48 Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Fri, 16 Mar 2012 12:54:16 -0700 Subject: Fix layer select on selection change Signed-off-by: Jonathan Duran --- .../Timeline/TimelinePanel.reel/TimelinePanel.js | 35 ++++++++++++++-------- 1 file changed, 22 insertions(+), 13 deletions(-) (limited to 'js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js') diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index 528d1fbf..3e82a760 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js @@ -557,16 +557,25 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { if(this.application.ninja.selectedElements[0]){ - // TODO - element uuid should be stored directly in layer array (possibly as the layerID) - key = this.application.ninja.selectedElements[0].uuid; - - switchSelectedLayer = this.hashElementMapToLayer.getItem(key); - if(switchSelectedLayer!==undefined){ - layerIndex = this.getLayerIndexByID(switchSelectedLayer.layerID); - this._captureSelection=false; - this.selectLayer(layerIndex); - this._captureSelection=true; + for (var i = 0; i < this.arrLayers.length; i++) { + if (this.application.ninja.selectedElements[0].uuid === this.arrLayers[i].layerData.elementsList[0].uuid) { + layerIndex = this.getLayerIndexByID(this.arrLayers[i].layerData.layerID); + this._captureSelection = false; + this.selectLayer(layerIndex); + this._captureSelection = true; + } } + +// // TODO - element uuid should be stored directly in layer array (possibly as the layerID) +// key = this.application.ninja.selectedElements[0].uuid; +// +// switchSelectedLayer = this.hashElementMapToLayer.getItem(key); +// if(switchSelectedLayer!==undefined){ +// layerIndex = this.getLayerIndexByID(switchSelectedLayer.layerID); +// this._captureSelection=false; +// this.selectLayer(layerIndex); +// this._captureSelection=true; +// } } } }, @@ -870,7 +879,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { handleElementAdded:{ value:function (event) { this.insertLayer(); - console.log("inserting layer"); + //console.log("inserting layer"); this.addElementToLayer(this.application.ninja.selectedElements[0]); } @@ -880,9 +889,9 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { value:function (element) { - console.log("setting element to layer"); - console.log(element); - console.log(this.currentLayerSelected.layerData); + //console.log("setting element to layer"); + //console.log(element); + //console.log(this.currentLayerSelected.layerData); //element.uuid = nj.generateRandom(); -- cgit v1.2.3 From 6b5cdc7f3b59a70b506b4ac5c8a4d105c90c713c Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Fri, 16 Mar 2012 15:04:13 -0700 Subject: Bug fix and cleanup Cleaning up unneeded code for one element per layer support and fixing some bugs with selection and layer sync. Signed-off-by: Jonathan Duran --- .../Timeline/TimelinePanel.reel/TimelinePanel.js | 710 ++++++++------------- 1 file changed, 251 insertions(+), 459 deletions(-) (limited to 'js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js') diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index 3e82a760..191228af 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js @@ -19,12 +19,12 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { /* === BEGIN: Models === */ _arrLayers:{ - serializable: true, + serializable:true, value:[] }, arrLayers:{ - serializable: true, + serializable:true, get:function () { return this._arrLayers; }, @@ -50,12 +50,12 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { _layerRepetition:{ - serializable: true, + serializable:true, value:null }, layerRepetition:{ - serializable: true, + serializable:true, get:function () { return this._layerRepetition; }, @@ -64,17 +64,17 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { } }, - _cacheArrays : { - value: function() { + _cacheArrays:{ + value:function () { if (this._boolCacheArrays) { this.application.ninja.currentDocument.tlArrLayers = this.arrLayers; } } }, - + // Set to false to skip array caching array sets in current document - _boolCacheArrays : { - value: true + _boolCacheArrays:{ + value:true }, _currentLayerNumber:{ @@ -94,7 +94,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { }, _setCurrentLayerNumber:{ - value:function(){ + value:function () { if (this._boolCacheArrays) { this.application.ninja.currentDocument.tllayerNumber = this.currentLayerNumber; } @@ -103,8 +103,8 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { // TODO - Remove hash tables _hashKey:{ - value:0 - }, + value:0 + }, hashKey:{ get:function () { @@ -119,7 +119,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { }, _setHashKey:{ - value:function(){ + value:function () { if (this._boolCacheArrays) { this.application.ninja.currentDocument.hashKey = this.hashKey; } @@ -128,38 +128,38 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { _currentLayerSelected:{ - value: null + value:null }, - currentLayerSelected : { - get: function() { - return this._currentLayerSelected; - }, - set: function(newVal) { - this._currentLayerSelected = newVal; - this.application.ninja.currentDocument.tlCurrentLayerSelected = newVal; - } + currentLayerSelected:{ + get:function () { + return this._currentLayerSelected; + }, + set:function (newVal) { + this._currentLayerSelected = newVal; + this.application.ninja.currentDocument.tlCurrentLayerSelected = newVal; + } }, _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); - } - } + 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); + } + } }, millisecondsOffset:{ @@ -167,16 +167,16 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { }, _masterDuration:{ - serializable: true, + serializable:true, value:0 }, masterDuration:{ serializable:true, - get:function(){ + get:function () { return this._masterDuration; }, - set:function(val){ + set:function (val) { this._masterDuration = val; this.timebar.style.width = (this._masterDuration / 12) + "px"; } @@ -226,15 +226,15 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { }, _breadCrumbContainer:{ - value:null + value:null }, - breadCrumbContainer: { - get: function() { + breadCrumbContainer:{ + get:function () { return this._breadCrumbContainer; }, - set: function(value) { - if(this._breadCrumbContainer !== value) { + set:function (value) { + if (this._breadCrumbContainer !== value) { this._breadCrumbContainer = value; this.LayerBinding(this.application.ninja.currentSelectedContainer); } @@ -261,7 +261,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { }, timeMarkerHolder:{ - value: null + value:null }, /* === END: Models === */ /* === BEGIN: Draw cycle === */ @@ -269,7 +269,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { value:function () { this.initTimeline(); // Bind the event handler for the document change events - this.eventManager.addEventListener("onOpenDocument", this.handleDocumentChange.bind(this), false); + this.eventManager.addEventListener("onOpenDocument", this.handleDocumentChange.bind(this), false); this.eventManager.addEventListener("closeDocument", this.handleDocumentChange.bind(this), false); this.eventManager.addEventListener("switchDocument", this.handleDocumentChange.bind(this), false); } @@ -285,12 +285,12 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { }, /* === END: Draw cycle === */ /* === BEGIN: Controllers === */ - // Create an empty layer template object with minimal defaults and return it for use - createLayerTemplate : { - value : function() { - var returnObj = {}; - returnObj.layerData = {}; - returnObj.layerData.layerName = null; + // Create an empty layer template object with minimal defaults and return it for use + createLayerTemplate:{ + value:function () { + var returnObj = {}; + returnObj.layerData = {}; + returnObj.layerData.layerName = null; returnObj.layerData.layerID = null; returnObj.layerData.isMainCollapsed = true; returnObj.layerData.isPositionCollapsed = true; @@ -301,7 +301,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { returnObj.layerData.deleted = false; returnObj.layerData.isSelected = false; returnObj.layerData.layerPosition = null; - returnObj.layerData.created=false; + returnObj.layerData.created = false; returnObj.layerData.isTrackAnimated = false; returnObj.layerData.currentKeyframeRule = null; returnObj.layerData.trackPosition = 0; @@ -309,21 +309,17 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { returnObj.layerData.tweens = []; returnObj.parentElementUUID = null; returnObj.parentElement = null; - return returnObj; - } - }, + return returnObj; + } + }, + // Bind all document-specific events (pass in true to unbind) - _bindDocumentEvents : { - value: function(boolUnbind) { - var arrEvents = ["deleteLayerClick", - "newLayer", - "deleteLayer", - "elementAdded", - "elementDeleted", - "selectionChange"], + _bindDocumentEvents:{ + value:function (boolUnbind) { + var arrEvents = ["elementAdded", "elementDeleted", "selectionChange"], i, arrEventsLength = arrEvents.length; - + if (boolUnbind) { for (i = 0; i < arrEventsLength; i++) { this.eventManager.removeEventListener(arrEvents[i], this, false); @@ -333,26 +329,19 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this.eventManager.addEventListener(arrEvents[i], this, false); } Object.defineBinding(this, "breadCrumbContainer", { - boundObject: this.application.ninja, + boundObject:this.application.ninja, boundObjectPropertyPath:"currentSelectedContainer", - oneway: true + oneway:true }); } } }, - - // Initialize the timeline, runs only once when the component is first loaded. - // Sets up basic event listeners, gets some selectors, etc. - initTimeline : { - value: function() { + + // Initialize the timeline, runs only once when the timeline component is first loaded + initTimeline:{ + value:function () { this.layout_tracks = this.element.querySelector(".layout-tracks"); this.layout_markers = this.element.querySelector(".layout_markers"); - - //this.newlayer_button.identifier = "addLayer"; - //this.newlayer_button.addEventListener("click", this, false); - //this.deletelayer_button.identifier = "deleteLayer"; - //this.deletelayer_button.addEventListener("click", this, false); - this.timeline_leftpane.addEventListener("click", this.timelineLeftPaneClick.bind(this), false); this.layout_tracks.addEventListener("scroll", this.updateLayerScroll.bind(this), false); this.user_layers.addEventListener("scroll", this.updateLayerScroll.bind(this), false); @@ -363,9 +352,9 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this.enablePanel(false); } }, - - // Initialize the timeline for a document. Called when a document is opened (new or existing), or - // when documents are switched. + + // Initialize the timeline for a document. + // Called when a document is opened (new or existing), or when documents are switched. initTimelineForDocument:{ value:function () { var myIndex; @@ -377,43 +366,29 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this.application.ninja.currentDocument.isTimelineInitialized = true; this.application.ninja.currentDocument.tlArrLayers = []; this.application.ninja.currentDocument.tllayerNumber = 0; - - // TODO - Remove hash - this.application.ninja.currentDocument.tlLayerHashTable=[]; - this.temparrLayers = []; // TODO - Remove hash + this.application.ninja.currentDocument.tlLayerHashTable = []; this.hashKey = this.application.ninja.currentSelectedContainer.uuid; - // Are we creating a new doc, or opening an existing one? - if(!this.application.ninja.documentController.creatingNewFile) { - // Opening an existing document. - // Does it have any DOM elements? - if(this.application.ninja.currentDocument.documentRoot.children[0]) { - // Yes, it has DOM elements. Loop through them and create a new - // object for each. - for(myIndex=0;this.application.ninja.currentDocument.documentRoot.children[myIndex];myIndex++) { - this._openDoc=true; + // Are we opening an existing doc? + if (!this.application.ninja.documentController.creatingNewFile) { + // Opening an existing document. Does it have any DOM elements? + if (this.application.ninja.currentDocument.documentRoot.children[0]) { + // Yes, it has DOM elements. Loop through them and create a new object for each. + for (myIndex = 0; this.application.ninja.currentDocument.documentRoot.children[myIndex]; myIndex++) { + this._openDoc = true; this.restoreLayer(this.application.ninja.currentDocument.documentRoot.children[myIndex]); } - } else { - // No, it has no DOM elements. Build an empty layer object. - //this.restoreLayer(1); + // select the first layer + this.temparrLayers[0].layerData.isSelected = true; + this.temparrLayers[0].layerData._isFirstDraw = true; } - - // 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; - - } else { - // New document. Create default layer. - //this.createNewLayer(1); + // Feed the new array of objects into the repetitions. + this.arrLayers = this.temparrLayers; } - + // After recreating the tracks and layers, store the result in the currentDocument. this.application.ninja.currentDocument.tlArrLayers = this.arrLayers; this.application.ninja.currentDocument.tllayerNumber = this.currentLayerNumber; @@ -421,19 +396,16 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { // TODO - Remove both hashes? this.application.ninja.currentDocument.tlLayerHashTable = this.hashInstance; this.application.ninja.currentDocument.tlElementHashTable = this.hashElementMapToLayer; - this.application.ninja.currentDocument.hashKey=this.hashKey; + this.application.ninja.currentDocument.hashKey = this.hashKey; } else { // we do have information stored. Use it. this._boolCacheArrays = false; - //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; - } - } - - + 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; @@ -442,17 +414,16 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this.hashInstance = this.application.ninja.currentDocument.tlLayerHashTable; this.hashElementMapToLayer = this.application.ninja.currentDocument.tlElementHashTable; this.hashKey = this.application.ninja.currentDocument.hashKey; - } } }, - + // Clear the currently-displayed document (and its events) from the timeline. - clearTimelinePanel : { - value: function() { + clearTimelinePanel:{ + value:function () { // Remove events this._bindDocumentEvents(true); - + // Remove every event listener for every selected tween in the timeline this.deselectTweens(); @@ -462,7 +433,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this.application.ninja.timeline.playheadmarker.style.left = "0px"; this.application.ninja.timeline.updateTimeText(0.00); this.timebar.style.width = "0px"; - + // Clear variables. this.hashInstance = null; // TODO - remove hash this.hashElementMapToLayer = null; // TODO - remove hash @@ -472,44 +443,44 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this.selectedTweens = []; this._captureSelection = false; this._openDoc = false; - this._firstTimeLoaded=true; + this._firstTimeLoaded = true; this.end_hottext.value = 25; this.updateTrackContainerWidth(); this.selectedLayerID = false; - + // Clear the repetitions if (this.arrLayers.length > 0) { - this.arrLayers = []; + this.arrLayers = []; } } }, - 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(); + 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(); // TODO - remove hash this.hashInstance = this.createLayerHashTable(); this.hashElementMapToLayer = this.createElementMapToLayer(); - + // Reinitialize the timeline...but only if there are open documents. - if (this.application.ninja.documentController._documents.length > 0) { - this.enablePanel(true); - this.initTimelineForDocument(); - } else { - this.enablePanel(false); - } + if (this.application.ninja.documentController._documents.length > 0) { + this.enablePanel(true); + this.initTimelineForDocument(); + } else { + this.enablePanel(false); + } } }, updateTrackContainerWidth:{ - value: function(){ + value:function () { this.container_tracks.style.width = (this.end_hottext.value * 80) + "px"; this.master_track.style.width = (this.end_hottext.value * 80) + "px"; this.time_markers.style.width = (this.end_hottext.value * 80) + "px"; @@ -528,7 +499,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { }, startPlayheadTracking:{ - value:function(){ + value:function () { this.time_markers.onmousemove = this.updatePlayhead.bind(this); } }, @@ -551,13 +522,11 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { }, handleSelectionChange:{ - value:function(){ - var key , switchSelectedLayer,layerIndex; + value:function () { + var layerIndex, i = 0, arrLayersLength = this.arrLayers.length; this.deselectTweens(); - - if(this.application.ninja.selectedElements[0]){ - - for (var i = 0; i < this.arrLayers.length; i++) { + if (this.application.ninja.selectedElements[0]) { + for (i = 0; i < arrLayersLength; i++) { if (this.application.ninja.selectedElements[0].uuid === this.arrLayers[i].layerData.elementsList[0].uuid) { layerIndex = this.getLayerIndexByID(this.arrLayers[i].layerData.layerID); this._captureSelection = false; @@ -565,17 +534,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this._captureSelection = true; } } - -// // TODO - element uuid should be stored directly in layer array (possibly as the layerID) -// key = this.application.ninja.selectedElements[0].uuid; -// -// switchSelectedLayer = this.hashElementMapToLayer.getItem(key); -// if(switchSelectedLayer!==undefined){ -// layerIndex = this.getLayerIndexByID(switchSelectedLayer.layerID); -// this._captureSelection=false; -// this.selectLayer(layerIndex); -// this._captureSelection=true; -// } } } }, @@ -617,33 +575,11 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { } }, - handleAddLayerClick:{ - value:function (event) { - this._isLayer = true; - this.needsDraw = true; - this.application.ninja.selectionController.executeSelectElement(); - } - }, - - handleDeleteLayerClick:{ - value:function (event) { - if (this.arrLayers.length === 1) { - // do not delete last layer - return; - } - if (this.layerRepetition.selectedIndexes === null) { - // nothing is selected, do not delete - return; - } - this.removeLayer(); - } - }, - LayerBinding:{ value:function (node) { - var i = 0; + var i = 0; - if(typeof(this.application.ninja.currentDocument.isTimelineInitialized) === "undefined"){ + if (typeof(this.application.ninja.currentDocument.isTimelineInitialized) === "undefined") { if (this._firstTimeLoaded) { this._firstTimeLoaded = false; } else { @@ -655,7 +591,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this._hashFind = true; } - this.currentLayerNumber = 0; this.createNewLayer(1); this.selectLayer(0); @@ -675,13 +610,13 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { }, createNewLayer:{ - value:function(object){ + value:function (object) { var hashVariable = 0; if (object._undoStatus) { if (object._el.parentElementUUID !== this.application.ninja.currentSelectedContainer.uuid) { dLayer = this.hashInstance.getItem(object._el.parentElementUUID); - for(hashVariable=0;dLayer[hashVariable];hashVariable++) { + for (hashVariable = 0; dLayer[hashVariable]; hashVariable++) { if (dLayer[hashVariable]._layerID === object._el._layerID) { dLayer[hashVariable].deleted = false; parentNode = dLayer[hashVariable].parentElement; @@ -692,7 +627,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this.LayerBinding(parentNode); } else { dLayer = this.hashInstance.getItem(object._el.parentElementUUID); - for(hashVariable=0;dLayer[hashVariable];hashVariable++) { + for (hashVariable = 0; dLayer[hashVariable]; hashVariable++) { if (dLayer[hashVariable]._layerID === object._el._layerID) { dLayer[hashVariable].deleted = false; @@ -705,54 +640,47 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { } } else { - var newLayerName = "", - thingToPush = this.createLayerTemplate(), - myIndex = 0, - // unused var? - indexToSelect = 0; - this.currentLayerNumber = this.currentLayerNumber + 1; - newLayerName = "Layer " + this.currentLayerNumber; - thingToPush.layerData.layerName = newLayerName; - thingToPush.layerData.layerID = this.currentLayerNumber; - thingToPush.parentElementUUID = this.hashKey; - thingToPush.parentElement = this.application.ninja.currentSelectedContainer; - thingToPush.layerData.isSelected = true; - thingToPush.layerData._isFirstDraw = true; + var newLayerName = "", + thingToPush = this.createLayerTemplate(), + myIndex = 0; + this.currentLayerNumber = this.currentLayerNumber + 1; + newLayerName = "Layer " + this.currentLayerNumber; + thingToPush.layerData.layerName = newLayerName; + thingToPush.layerData.layerID = this.currentLayerNumber; + thingToPush.parentElementUUID = this.hashKey; + thingToPush.parentElement = this.application.ninja.currentSelectedContainer; + thingToPush.layerData.isSelected = true; + thingToPush.layerData._isFirstDraw = true; thingToPush.layerData.created = true; - - for (var i = 0; i < this.arrLayers.length; i++) { - this.arrLayers[i].layerData.isSelected = false; - this.arrLayers[i].layerData._isFirstDraw = false; - } - - if (!!this.layerRepetition.selectedIndexes) { - // There is a selected layer, so we need to splice the new - // layer on top of it. - myIndex = this.layerRepetition.selectedIndexes[0]; - thingToPush.layerData.layerPosition = myIndex; - thingToPush.layerData.trackPosition = myIndex; - this.arrLayers.splice(myIndex, 0, thingToPush); - this._LayerUndoPosition = myIndex; - - //this.hashLayerNumber.setItem(this.hashKey, thingToPush.layerData); - this.hashInstance.setItem(this.hashKey, thingToPush.layerData, myIndex); - // unused var - indexToSelect = myIndex; - - } else { - thingToPush.layerData.layerPosition = this.arrLayers.length - 1; - this.arrLayers.push(thingToPush); - this._LayerUndoPosition = this.arrLayers.length - 1; - - //this.hashLayerNumber.setItem(this.hashKey, thingToPush.layerData); - this.hashInstance.setItem(this.hashKey, thingToPush.layerData, thingToPush.layerData.layerPosition); - // unused var - indexToSelect = this.arrLayers.length -1; - } - - this._LayerUndoObject = thingToPush; - this._LayerUndoIndex = thingToPush.layerData.layerID; - this._LayerUndoStatus = true; + + for (var i = 0; i < this.arrLayers.length; i++) { + this.arrLayers[i].layerData.isSelected = false; + this.arrLayers[i].layerData._isFirstDraw = false; + } + + if (this.layerRepetition.selectedIndexes) { + // There is a selected layer, so we need to splice the new layer on top of it. + myIndex = this.layerRepetition.selectedIndexes[0]; + thingToPush.layerData.layerPosition = myIndex; + thingToPush.layerData.trackPosition = myIndex; + this.arrLayers.splice(myIndex, 0, thingToPush); + this._LayerUndoPosition = myIndex; + + // TODO - remove hash + this.hashInstance.setItem(this.hashKey, thingToPush.layerData, myIndex); + + } else { + thingToPush.layerData.layerPosition = myIndex; + this.arrLayers.splice(myIndex, 0, thingToPush); + this._LayerUndoPosition = myIndex; + + // TODO - remove hash + this.hashInstance.setItem(this.hashKey, thingToPush.layerData, thingToPush.layerData.layerPosition); + } + + this._LayerUndoObject = thingToPush; + this._LayerUndoIndex = thingToPush.layerData.layerID; + this._LayerUndoStatus = true; this.selectLayer(myIndex); } @@ -761,20 +689,17 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { restoreLayer:{ value:function (ele) { - var hashIndex = 0 ,layerResult; + var hashIndex = 0 , layerResult; if (this._hashFind) { - for (layerResult = this.returnedObject[hashIndex];layerResult;hashIndex++) { + for (layerResult = this.returnedObject[hashIndex]; layerResult; hashIndex++) { if (layerResult.layerData.deleted !== true) { this.arrLayers.push(layerResult); } } this._hashFind = false; - }else { - var newLayerName = "", - thingToPush = this.createLayerTemplate(), - newTrack = {}, - myIndex = 0; + } else { + var newLayerName, thingToPush = this.createLayerTemplate(); this.currentLayerNumber = this.currentLayerNumber + 1; newLayerName = "Layer " + this.currentLayerNumber; @@ -783,21 +708,21 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { thingToPush.parentElementUUID = this.hashKey; thingToPush.parentElement = this.application.ninja.currentSelectedContainer; - if(this._openDoc){ - ele.uuid =nj.generateRandom(); + if (this._openDoc) { + ele.uuid = nj.generateRandom(); thingToPush.layerData.elementsList.push(ele); } - this.temparrLayers.push(thingToPush); - thingToPush.layerData.trackPosition = this.temparrLayers.length - 1; - thingToPush.layerData.layerPosition = this.temparrLayers.length - 1; + this.temparrLayers.push(thingToPush); + thingToPush.layerData.trackPosition = this.temparrLayers.length - 1; + thingToPush.layerData.layerPosition = this.temparrLayers.length - 1; - this.hashInstance.setItem(this.hashKey, thingToPush.layerData, thingToPush.layerData.layerPosition); + this.hashInstance.setItem(this.hashKey, thingToPush.layerData, thingToPush.layerData.layerPosition); - if(this._openDoc) { - var selectedIndex = this.getLayerIndexByID(thingToPush.layerData.layerID,this.temparrLayers); - this.hashElementMapToLayer.setItem(ele.uuid,ele,this.temparrLayers[selectedIndex]); - this._openDoc=false; + if (this._openDoc) { + var selectedIndex = this.getLayerIndexByID(thingToPush.layerData.layerID, this.temparrLayers); + this.hashElementMapToLayer.setItem(ele.uuid, ele, this.temparrLayers[selectedIndex]); + this._openDoc = false; } } } @@ -805,133 +730,26 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { deleteLayer:{ value:function (object) { - // unusused variables and duplicate declaration of var index - var dLayer,parentNode, hashVariable = 0, k = 0, index = 0, j = 0,a=0; - - // should now be able to delete the last layer - if (this.arrLayers.length > 0) { - if (object._undoStatus) { - if (object._el.parentElementUUID !== this.application.ninja.currentSelectedContainer.uuid) { - dLayer = this.hashInstance.getItem(object._el.parentElementUUID); - for(hashVariable=0;dLayer[hashVariable];hashVariable++) { - if (dLayer[hashVariable]._layerID === object._el._layerID) { - dLayer[hashVariable].deleted = true; - parentNode = dLayer[hashVariable].parentElement; - break; - } - } - this.application.ninja.currentSelectedContainer = parentNode; - this.LayerBinding(parentNode); - } - else { - dLayer = this.hashInstance.getItem(object._el.parentElementUUID); - for(hashVariable=0;dLayer[hashVariable];hashVariable++) { - if (dLayer[hashVariable].deleted === true) { - - } else if (dLayer[hashVariable]._layerID === object._el._layerID) { - while (this.arrLayers.length) { - if (dLayer[hashVariable]._layerID === this.arrLayers[k].layerData._layerID) { - dLayer[hashVariable].deleted = true; - this.arrLayers.splice(k, 1); - if(k>0){ - this.selectLayer(k-1); - }else{ - this.selectLayer(k); - } - break; - } - k++; - } - } - } - } - } else { - // Only delete a selected layer. If no layer is selected, do nothing. - if (this.layerRepetition.selectedIndexes.length > 0) { - // Delete the selected item. - var myIndex = this.layerRepetition.selectedIndexes[0]; - this._LayerUndoObject = this.arrLayers[myIndex]; - - dLayer = this.hashInstance.getItem(this.hashKey); - - for(hashVariable=0;dLayer[hashVariable];hashVariable++){ - if(this.currentLayerSelected.layerData.layerID===dLayer[hashVariable].layerID){ - var arrLayerLength=this.arrLayers.length; - for(var index=0;index 0) { + // Delete the selected layer. + var myIndex = this.layerRepetition.selectedIndexes[0]; + this._LayerUndoObject = this.arrLayers[myIndex]; + this.arrLayers.splice(myIndex, 1); } } }, handleElementAdded:{ - value:function (event) { + value:function() { this.insertLayer(); - //console.log("inserting layer"); - - this.addElementToLayer(this.application.ninja.selectedElements[0]); - } - }, - - addElementToLayer:{ - value:function (element) { - - - //console.log("setting element to layer"); - //console.log(element); - //console.log(this.currentLayerSelected.layerData); - - //element.uuid = nj.generateRandom(); - - // this should be unneeded with one element per layer restriction - if (this.currentLayerSelected.layerData.elementsList[0] !== undefined) { - - if (this.currentLayerSelected.layerData.isTrackAnimated) { - // need to prevent element adding to dom, not just clear the drawing canvas - // this should be unneeded with one element per layer restriction - console.log("cannot add elements to a layer with animated element"); - } else { - //this.hashElementMapToLayer.setItem(element.uuid, element, this.currentLayerSelected); - - // should be simple assignment to var instead of array - this.currentLayerSelected.layerData.elementsList.push(element._element); - //this.currentLayerSelected.layerData.layerElement = event.detail; - } - } else { - //this.hashElementMapToLayer.setItem(element.uuid, element, this.currentLayerSelected); - this.currentLayerSelected.layerData.elementsList.push(element._element); - } + this.currentLayerSelected.layerData.elementsList.push(this.application.ninja.selectedElements[0]._element); } }, handleElementDeleted:{ - value:function (event) { - - // With one element per layer restriction - // Deleting an element on stage should simply delete it's associated layer - - var length,lengthVal; - this.deleteElement = event.detail; - lengthVal = this.currentLayerSelected.layerData.elementsList.length - 1; - for (length = lengthVal ;length >= 0 ;length--) { - if (this.currentLayerSelected.layerData.elementsList[length] === this.deleteElement) { - this.currentLayerSelected.layerData.elementsList.splice(length, 1); - break; - } - //length--; - } + value:function () { + this.removeLayer(); } }, @@ -996,10 +814,10 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { if (hashLayerObject[key][index] !== undefined) { - for(this.counter = index ;hashLayerObject[key][this.counter];this.counter++) { + for (this.counter = index; hashLayerObject[key][this.counter]; this.counter++) { } - for(;this.counter !== index;this.counter--) { + for (; this.counter !== index; this.counter--) { hashLayerObject[key][this.counter] = hashLayerObject[key][this.counter - 1]; } } @@ -1018,55 +836,30 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { } }, - createLayerNumberHash:{ - value:function (key, value) { - var hashLayerNumberObject; - hashLayerNumberObject = Object.create(Object.prototype, { + createElementMapToLayer:{ + value:function () { + var hashMappingObject; + hashMappingObject = Object.create(Object.prototype, { + mappingArray:{ + value:{}, + writable:true + }, setItem:{ - value:function (key, value) { - if (value !== undefined) { - hashLayerNumberObject[key] = value.layerData.layerID; + value:function (key, value, layer) { + if (this.mappingArray[key] === undefined) { + this.mappingArray[key] = {}; } + this.mappingArray[key]["ele"] = value; + this.mappingArray[key].layerID = layer.layerData.layerID; } }, getItem:{ value:function (key) { - if (hashLayerNumberObject[key] === undefined) { - return; - } - return hashLayerNumberObject[key]; + return this.mappingArray[key]; } } }); - return hashLayerNumberObject; - } - }, - - createElementMapToLayer:{ - value:function(){ - var hashMappingObject; - hashMappingObject = Object.create(Object.prototype, { - mappingArray:{ - value:{}, - writable:true - }, - setItem: { - value: function(key,value,layer) { - if(this.mappingArray[key]===undefined){ - this.mappingArray[key]={}; - } - this.mappingArray[key]["ele"] = value; - this.mappingArray[key].layerID = layer.layerData.layerID; - } - }, - - getItem: { - value: function(key) { - return this.mappingArray[key]; - } - } - }); return hashMappingObject; } }, @@ -1076,11 +869,11 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { var i = 0; var arrLayersLength = this.arrLayers.length; - - if(this.selectedKeyframes){ + + if (this.selectedKeyframes) { this.deselectTweens(); } - + for (i = 0; i < arrLayersLength; i++) { if (i === layerIndex) { this.arrLayers[i].layerData.isSelected = true; @@ -1088,14 +881,14 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this.arrLayers[i].layerData.isSelected = false; } } - + this.layerRepetition.selectedIndexes = [layerIndex]; this.currentLayerSelected = this.arrLayers[layerIndex]; - if(userSelection){ - if(this._captureSelection){ + if (userSelection)