From 38d8d4ea7d033b35f95e38ebb7d6abfd81bd2c69 Mon Sep 17 00:00:00 2001 From: Jon Reid Date: Wed, 29 Feb 2012 09:56:56 -0800 Subject: Timeline: document switching + new document. --- .../Timeline/TimelinePanel.reel/TimelinePanel.js | 98 +++++++++++++++------- 1 file changed, 68 insertions(+), 30 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 01b03531..6a9e0140 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js @@ -28,7 +28,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { }, set:function (newVal) { this._arrLayers = newVal; - this.application.ninja.currentDocument.tlArrLayers = newVal; + this.updateLayers(); } }, @@ -44,6 +44,18 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this._layerRepetition = newVal; } }, + updateLayers : { + value: function() { + this.application.ninja.currentDocument.tlArrLayers = this.arrLayers; + // this.application.ninja.currentDocument.tlArrTracks = this.arrTracks; + console.log('inside of updateLayers '); + console.log(this.application.ninja.currentDocument.tlArrTracks); + + } + }, + boolUpdateLayers : { + value: true + }, _currentLayerNumber:{ value:0 @@ -100,7 +112,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { }, set:function (newVal) { this._arrTracks = newVal; - this.application.ninja.currentDocument.tlArrTracks = newVal; + this.updateLayers(); } }, @@ -182,7 +194,9 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { handleOnOpenDocument:{ value:function(){ + this.boolUpdateLayers = false; this.clearTimelinePanel(); + this.boolUpdateLayers = true; this.eventManager.addEventListener("deleteLayerClick", this, false); this.eventManager.addEventListener("newLayer", this, false); this.eventManager.addEventListener("deleteLayer", this, false); @@ -204,6 +218,8 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { handleCloseDocument: { value: function(event) { this.clearTimelinePanel(); + this.arrTracks = []; + this.arrLayers = []; } }, @@ -245,31 +261,55 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { initTimelineView:{ value:function () { var myIndex; - this.drawTimeMarkers(); + this._hashKey = "123"; + + + // Document switching + // Check to see if we have saved timeline information in the currentDocument. + if (typeof(this.application.ninja.currentDocument.isTimelineInitialized) === "undefined") { + // No, we have no information stored. Create it. + console.log('newfile!') + this.application.ninja.currentDocument.isTimelineInitialized = true; + this.application.ninja.currentDocument.tlArrLayers = []; + this.application.ninja.currentDocument.tlArrTracks = []; + _firstLayerDraw = false; + if(!this.application.ninja.documentController.creatingNewFile){ + if(this.application.ninja.currentDocument.documentRoot.children[0]){ + myIndex=0; + while(this.application.ninja.currentDocument.documentRoot.children[myIndex]) + { + this._openDoc=true; + NJevent('newLayer',{key:this._hashKey,ele:this.application.ninja.currentDocument.documentRoot.children[myIndex]}) + myIndex++; + } + } + else{ + NJevent('newLayer', this._hashKey); + this.selectLayer(0); + } + }else{ + NJevent('newLayer', this._hashKey); + this.selectLayer(0); + + } + _firstLayerDraw = true; + this.application.ninja.currentDocument.tlArrTracks = this.arrTracks; + } else { + // we do have information stored. Use it. + console.log('oldfile!') + console.log("tlArrLayers: " , this.application.ninja.currentDocument.tlArrLayers); + console.log("tlArrTracks: " , this.application.ninja.currentDocument.tlArrTracks); + this.arrLayers = this.application.ninja.currentDocument.tlArrLayers; + this.arrTracks = this.application.ninja.currentDocument.tlArrTracks; + } + + // Redraw all the things + this.layerRepetition.needsDraw = true; + this.trackRepetition.needsDraw = true; + this.needsDraw = true; - this._hashKey = "123"; - _firstLayerDraw = false; - if(!this.application.ninja.documentController.creatingNewFile){ - if(this.application.ninja.currentDocument.documentRoot.children[0]){ - myIndex=0; - while(this.application.ninja.currentDocument.documentRoot.children[myIndex]) - { - this._openDoc=true; - NJevent('newLayer',{key:this._hashKey,ele:this.application.ninja.currentDocument.documentRoot.children[myIndex]}) - myIndex++; - } - } - else{ - NJevent('newLayer', this._hashKey); - this.selectLayer(0); - } - }else{ - NJevent('newLayer', this._hashKey); - this.selectLayer(0); - } - _firstLayerDraw = true; } }, @@ -299,8 +339,10 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this.hashTrackInstance = null; this.hashLayerNumber = null; this.hashElementMapToLayer = null; - this.arrTracks = []; - this.arrLayers = []; + if (!this.boolUpdateLayers) { + + } + this.currentLayerNumber = 0; this.currentLayerSelected = false; this.currentTrackSelected = false; @@ -311,10 +353,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this.end_hottext.value = 25; this.updateTrackContainerWidth(); - // Redraw all the things - this.layerRepetition.needsDraw = true; - this.trackRepetition.needsDraw = true; - this.needsDraw = true; } }, -- cgit v1.2.3 From 8ccc989388bfbcb0d5713c44b9c97ef5ce45d31c Mon Sep 17 00:00:00 2001 From: Kruti Shah Date: Wed, 29 Feb 2012 12:30:12 -0800 Subject: Timeline: Changed the variables names to resolve issues.And removed the alert. Signed-off-by: Kruti Shah --- js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | 4 ++-- 1 file changed, 2 insertions(+), 2 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 81415951..e92c83db 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js @@ -728,7 +728,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { if(this.currentLayerSelected.elementsList[0]!==undefined){ if(this.currentTrackSelected.isTrackAnimated){ this.application.ninja.stage.clearDrawingCanvas(); - alert("cannot add elements to a layer with animated element");/* check how to clear the canvas*/ + console.log("cannot add elements to a layer with animated element"); return; }else{ this.hashElementMapToLayer.setItem(event.detail.uuid, event.detail,this.currentLayerSelected); @@ -738,12 +738,12 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this.hashElementMapToLayer.setItem(event.detail.uuid, event.detail,this.currentLayerSelected); this.currentLayerSelected.elementsList.push(event.detail); } - } }, handleElementDeleted:{ value:function (event) { + var length; this.deleteElement = event.detail; length = this.currentLayerSelected.elementsList.length - 1; -- cgit v1.2.3 From 939cb7eccb8a5ec655fbde8b470894d293832307 Mon Sep 17 00:00:00 2001 From: Jon Reid Date: Thu, 1 Mar 2012 09:21:50 -0800 Subject: Timeline: Document switching and code restructuring. --- .../Timeline/TimelinePanel.reel/TimelinePanel.js | 156 ++++++++++++--------- 1 file changed, 93 insertions(+), 63 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 67ff3c02..6d23453d 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js @@ -28,7 +28,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { }, set:function (newVal) { this._arrLayers = newVal; - this.updateLayers(); + this._cacheArrays(); } }, @@ -44,16 +44,20 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this._layerRepetition = newVal; } }, - updateLayers : { + _cacheArrays : { value: function() { - this.application.ninja.currentDocument.tlArrLayers = this.arrLayers; - // this.application.ninja.currentDocument.tlArrTracks = this.arrTracks; - console.log('inside of updateLayers '); - console.log(this.application.ninja.currentDocument.tlArrTracks); - + // Cache this.arrLayers and this.arrTracks. + console.log('cacheArrays ' + this._boolCacheArrays) + if (this._boolCacheArrays) { + console.log('caching arrays for ', this.application.ninja.currentDocument.name); + this.application.ninja.currentDocument.tlArrLayers = this.arrLayers; + this.application.ninja.currentDocument.tlArrTracks = this.arrTracks; + } } }, - boolUpdateLayers : { + + // Set to false to skip array caching array sets in current document + _boolCacheArrays : { value: true }, @@ -112,7 +116,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { }, set:function (newVal) { this._arrTracks = newVal; - this.updateLayers(); + this._cacheArrays(); } }, @@ -192,43 +196,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { } }, - handleOnOpenDocument:{ - value:function(){ - this.boolUpdateLayers = false; - this.clearTimelinePanel(); - this.boolUpdateLayers = true; - this.eventManager.addEventListener("deleteLayerClick", this, false); - this.eventManager.addEventListener("newLayer", this, false); - this.eventManager.addEventListener("deleteLayer", this, false); - this.eventManager.addEventListener("layerBinding", this, false); - this.eventManager.addEventListener("elementAdded", this, false); - this.eventManager.addEventListener("elementDeleted", this, false); - this.eventManager.addEventListener("deleteSelection", this, false); - this.eventManager.addEventListener("selectionChange", this, true); - this.hashInstance = this.createLayerHashTable(); - this.hashTrackInstance = this.createTrackHashTable(); - this.hashLayerNumber = this.createLayerNumberHash(); - this.hashElementMapToLayer = this.createElementMapToLayer(); - this.initTimelineView(); - - - } - }, - - handleCloseDocument: { - value: function(event) { - this.clearTimelinePanel(); - this.arrTracks = []; - this.arrLayers = []; - } - }, - - handleSwitchDocument : { - value: function(event) { - // Handle document change. - this.handleOnOpenDocument(); - } - }, willDraw:{ value:function () { @@ -241,6 +208,33 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { /* === END: Draw cycle === */ /* === BEGIN: Controllers === */ + + // Bind all document-specific events (pass in true to unbind) + _bindDocumentEvents : { + value: function(boolUnbind) { + var arrEvents = ["deleteLayerClick", + "newLayer", + "deleteLayer", + "layerBinding", + "elementAdded", + "elementDeleted", + "deleteSelection", + "selectionChange"], + i, + arrEventsLength = arrEvents.length; + + if (boolUnbind) { + for (i = 0; i < arrEventsLength; i++) { + this.eventManager.removeEventListener(arrEvents[i], this, false); + } + } else { + for (i = 0; i < arrEventsLength; i++) { + this.eventManager.addEventListener(arrEvents[i], this, false); + } + } + } + }, + initTimeline : { value: function() { // Set up basic Timeline functions: event listeners, etc. Things that only need to be run once. @@ -258,7 +252,8 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { } }, - initTimelineView:{ + + initTimelineForDocument:{ value:function () { var myIndex; this.drawTimeMarkers(); @@ -269,10 +264,14 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { // Check to see if we have saved timeline information in the currentDocument. if (typeof(this.application.ninja.currentDocument.isTimelineInitialized) === "undefined") { // No, we have no information stored. Create it. - console.log('newfile!') + console.log('newfile ' + this.application.ninja.currentDocument.name) this.application.ninja.currentDocument.isTimelineInitialized = true; this.application.ninja.currentDocument.tlArrLayers = []; this.application.ninja.currentDocument.tlArrTracks = []; + + + // Loop through the DOM of the document to find layers and animations. + // Fire off events as they are found. _firstLayerDraw = false; if(!this.application.ninja.documentController.creatingNewFile){ if(this.application.ninja.currentDocument.documentRoot.children[0]){ @@ -282,7 +281,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this._openDoc=true; NJevent('newLayer',{key:this._hashKey,ele:this.application.ninja.currentDocument.documentRoot.children[myIndex]}) myIndex++; - } + k } } else{ NJevent('newLayer', this._hashKey); @@ -294,14 +293,20 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { } _firstLayerDraw = true; + + // After recreating the tracks and layers, store the result in the currentDocument. this.application.ninja.currentDocument.tlArrTracks = this.arrTracks; + this.application.ninja.currentDocument.tlArrLayers = this.arrLayers; + } else { // we do have information stored. Use it. - console.log('oldfile!') - console.log("tlArrLayers: " , this.application.ninja.currentDocument.tlArrLayers); - console.log("tlArrTracks: " , this.application.ninja.currentDocument.tlArrTracks); + console.log('oldfile ' + this.application.ninja.currentDocument.name) + this._boolCacheArrays = false; + this.arrLayers = []; + this.arrTracks = []; this.arrLayers = this.application.ninja.currentDocument.tlArrLayers; this.arrTracks = this.application.ninja.currentDocument.tlArrTracks; + this._boolCacheArrays = true; } // Redraw all the things @@ -316,14 +321,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { clearTimelinePanel : { value: function() { // Remove events - this.eventManager.removeEventListener("deleteLayerClick", this, false); - this.eventManager.removeEventListener("newLayer", this, false); - this.eventManager.removeEventListener("deleteLayer", this, false); - this.eventManager.removeEventListener("layerBinding", this, false); - this.eventManager.removeEventListener("elementAdded", this, false); - this.eventManager.removeEventListener("elementDeleted", this, false); - this.eventManager.removeEventListener("deleteSelection", this, false); - this.eventManager.removeEventListener("selectionChange", this, true); + this._bindDocumentEvents(true); // Remove every event listener for every tween in TimelineTrack this.deselectTweens(); @@ -339,9 +337,8 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this.hashTrackInstance = null; this.hashLayerNumber = null; this.hashElementMapToLayer = null; - if (!this.boolUpdateLayers) { - - } + this.arrTracks = []; + this.arrLayers = []; this.currentLayerNumber = 0; this.currentLayerSelected = false; @@ -356,6 +353,38 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { } }, + + handleOnOpenDocument:{ + value:function(){ + + this._boolCacheArrays = false; + this.clearTimelinePanel(); + this._boolCacheArrays = true; + this._bindDocumentEvents(); + + this.hashInstance = this.createLayerHashTable(); + this.hashTrackInstance = this.createTrackHashTable(); + this.hashLayerNumber = this.createLayerNumberHash(); + this.hashElementMapToLayer = this.createElementMapToLayer(); + this.initTimelineForDocument(); + + + } + }, + + handleCloseDocument: { + value: function(event) { + this.clearTimelinePanel(); + } + }, + + handleSwitchDocument : { + value: function(event) { + // Handle document change. + this.handleOnOpenDocument(); + } + }, + updateTrackContainerWidth:{ value: function(){ this.container_tracks.style.width = (this.end_hottext.value * 80) + "px"; @@ -440,6 +469,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { handleDeleteLayerClick:{ value:function (event) { + console.log('handleDeleteLayerClick called') if (this.arrLayers.length === 1) { // do not delete last layer return; -- cgit v1.2.3 From a725643eba157b3c37d9acd13c6fdd48379bb0df Mon Sep 17 00:00:00 2001 From: Jon Reid Date: Thu, 1 Mar 2012 10:38:47 -0800 Subject: Timeline: Merge. Set collapser heights. --- .../Timeline/TimelinePanel.reel/TimelinePanel.js | 47 ++++++++++++++++++---- 1 file changed, 39 insertions(+), 8 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 ec9555fe..59306705 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js @@ -47,9 +47,9 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { _cacheArrays : { value: function() { // Cache this.arrLayers and this.arrTracks. - console.log('cacheArrays ' + this._boolCacheArrays) + this.log('cacheArrays ' + this._boolCacheArrays) if (this._boolCacheArrays) { - console.log('caching arrays for ', this.application.ninja.currentDocument.name); + this.log('caching arrays for ', this.application.ninja.currentDocument.name); this.application.ninja.currentDocument.tlArrLayers = this.arrLayers; this.application.ninja.currentDocument.tlArrTracks = this.arrTracks; } @@ -264,7 +264,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { // Check to see if we have saved timeline information in the currentDocument. if (typeof(this.application.ninja.currentDocument.isTimelineInitialized) === "undefined") { // No, we have no information stored. Create it. - console.log('newfile ' + this.application.ninja.currentDocument.name) + this.log('newfile ' + this.application.ninja.currentDocument.name) this.application.ninja.currentDocument.isTimelineInitialized = true; this.application.ninja.currentDocument.tlArrLayers = []; this.application.ninja.currentDocument.tlArrTracks = []; @@ -281,7 +281,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this._openDoc=true; NJevent('newLayer',{key:this._hashKey,ele:this.application.ninja.currentDocument.documentRoot.children[myIndex]}) myIndex++; - k } + } } else{ NJevent('newLayer', this._hashKey); @@ -300,7 +300,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { } else { // we do have information stored. Use it. - console.log('oldfile ' + this.application.ninja.currentDocument.name) + this.log('oldfile ' + this.application.ninja.currentDocument.name) this._boolCacheArrays = false; this.arrLayers = []; this.arrTracks = []; @@ -469,7 +469,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { handleDeleteLayerClick:{ value:function (event) { - console.log('handleDeleteLayerClick called') + this.log('handleDeleteLayerClick called') if (this.arrLayers.length === 1) { // do not delete last layer return; @@ -795,7 +795,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { if(this.currentLayerSelected.elementsList[0]!==undefined){ if(this.currentTrackSelected.isTrackAnimated){ this.application.ninja.stage.clearDrawingCanvas(); - console.log("cannot add elements to a layer with animated element"); + this.log("cannot add elements to a layer with animated element"); return; }else{ this.hashElementMapToLayer.setItem(event.detail.uuid, event.detail,this.currentLayerSelected); @@ -1167,7 +1167,38 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { }); return command; } - } + }, /* === END: Controllers === */ + + /* === BEGIN: Logging routines === */ + _boolDebug: { + enumerable: false, + value: false // set to true to enable debugging to console; false for turning off all debugging. + }, + boolDebug: { + get: function() { + return this._boolDebug; + }, + set: function(boolDebugSwitch) { + this._boolDebug = boolDebugSwitch; + } + }, + log: { + value: function(strMessage) { + if (this.boolDebug) { + console.log(this.getLineNumber() + ": " + strMessage); + } + } + }, + getLineNumber: { + value: function() { + try { + throw new Error('bazinga') + }catch(e){ + return e.stack.split("at")[3].split(":")[2]; + } + } + } + /* === END: Logging routines === */ }); -- cgit v1.2.3