1 files changed, 91 insertions, 62 deletions

diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
index 556c082d..a69f131d 100644
--- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
+++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
@@ -31,7 +31,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
         set:function (newVal) {
             this._arrLayers = newVal;
             this.needsDraw = true;
-            this._cacheArrays();
+            this.cacheTimeline();
         }
     },
 
@@ -64,15 +64,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
         }
     },
 
-    _cacheArrays:{
-        value:function () {
-            if (this._boolCacheArrays) {
-                this.application.ninja.currentDocument.tlArrLayers = this.arrLayers;
-                this.application.ninja.currentDocument.tlCurrentSelectedContainer=this.application.ninja.currentSelectedContainer;
-            }
-        }
-    },
-
     // Set to false to skip array caching array sets in current document
     _boolCacheArrays:{
         value:true
@@ -89,15 +80,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
         set:function (newVal) {
             if (newVal !== this._currentLayerNumber) {
                 this._currentLayerNumber = newVal;
-                this._setCurrentLayerNumber();
-            }
-        }
-    },
-
-    _setCurrentLayerNumber:{
-        value:function () {
-            if (this._boolCacheArrays) {
-                this.application.ninja.currentDocument.tllayerNumber = this.currentLayerNumber;
+                this.cacheTimeline();
             }
         }
     },
@@ -111,7 +94,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
         },
         set:function (newVal) {
             this._currentLayerSelected = newVal;
-            this.application.ninja.currentDocument.tlCurrentLayerSelected = newVal;
+            this.cacheTimeline();
         }
     },
 
@@ -300,7 +283,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
 
                         this.arrLayers.splice(dragLayerIndex, 1);
                         this.arrLayers.splice(dropLayerIndex, 0, dragLayer);
-                        this.application.ninja.currentDocument.tlArrLayers = this.arrLayers;
+                        this.cacheTimeline();
                         
                         // Clear for future DnD
                         this._dropLayerID = null;
@@ -432,6 +415,31 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
         }
     },
     
+    // cache Timeline data in currentDocument.
+    cacheTimeline: {
+        value: function() {
+                        // Store the timeline data in currentDocument...
+                        if (this._boolCacheArrays) {
+                                // ... but only if we're supposed to.
+                        this.application.ninja.currentDocument.tlArrLayers = this.arrLayers;
+                        this.application.ninja.currentDocument.tlCurrentSelectedContainer = this.currentSelectedContainer;
+                        this.application.ninja.currentDocument.tllayerNumber = this.currentLayerNumber;
+                        this.application.ninja.currentDocument.tlCurrentLayerSelected = this.currentLayerSelected;      
+                        }
+        }
+    },
+    // Initialize Timeline cache in currentDocument.
+    initTimelineCache: {
+        value: function() {
+                        // Initialize the currentDocument for a new set of timeline data.
+                        this.application.ninja.currentDocument.isTimelineInitialized = true;
+                        this.application.ninja.currentDocument.tlArrLayers = [];
+                this.application.ninja.currentDocument.tlCurrentSelectedContainer = this.application.ninja.currentSelectedContainer;
+                this.application.ninja.currentDocument.tllayerNumber = this.currentLayerNumber;
+                this.application.ninja.currentDocument.tlCurrentLayerSelected = null;
+        }
+    },
+    
     // Create an array of style objects for an element, for use
     // in creating a new layer
     createLayerStyles : {
@@ -445,14 +453,16 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
                         newStyle = {}, 
                         styleID = "1@0"; // format: layerID + "@" + style counter
                         
+                /* Example new style    
             newStyle.styleID = styleID;
-                        newStyle.whichView = "propval";
-                        newStyle.editorProperty = "top";
-                        newStyle.editorValue = 0;
-                        newStyle.ruleTweener = false;
+                        newStyle.whichView = "propval";         // Which view do we want to show, usually property/value view (see Style)
+                        newStyle.editorProperty = "top";        // the style property
+                        newStyle.editorValue = 0;                       // The current value
+                        newStyle.ruleTweener = false; 
                         newStyle.isSelected = false;
                         
                         returnArray.push(newStyle);
+                        */
                         
                         return returnArray;
                 
@@ -532,66 +542,82 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
             this.drawTimeMarkers();
             // Document switching
             // Check to see if we have saved timeline information in the currentDocument.
-            if (typeof(this.application.ninja.currentDocument.isTimelineInitialized) === "undefined" || this.application.ninja.breadCrumbClick) {
-                // No, we have no information stored.  Create it.
-                this.application.ninja.currentDocument.isTimelineInitialized = true;
-                this.application.ninja.currentDocument.tlArrLayers = [];
-                this.application.ninja.currentDocument.tllayerNumber = 0;
-                this.application.ninja.currentDocument.tlCurrentSelectedContainer = null;
+            if (typeof(this.application.ninja.currentDocument.isTimelineInitialized) === "undefined") {
+                // No, we have no information stored.
+                // This could mean we are creating a new file, OR are opening an existing file.
+                
+                // First, initialize the caches.
+                                this.initTimelineCache();
                 this.temparrLayers = [];
 
-                // Are we opening an existing doc?
+                                // That's all we need to do for a brand new file. 
+                // But what if we're opening an existing document?
                 if (!this.application.ninja.documentController.creatingNewFile) {
-                    // Opening an existing document. Does it have any DOM elements?
-                    if(this.application.ninja.breadCrumbClick){
-                        var parentNode = this.application.ninja.currentSelectedContainer;
-                        for (myIndex = 0; parentNode.children[myIndex]; myIndex++) {
-                            this._openDoc = true;
-                            this.restoreLayer(parentNode.children[myIndex]);
-                        }
-
-                    }else if (this.application.ninja.currentDocument.documentRoot.children[0]) {
+                    // Opening an existing document. If it has DOM elements we need to restore their timeline info
+                    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]);
                         }
                     }
-                    // Feed the new array of objects into the repetitions.
-                    this.arrLayers = this.temparrLayers;
-                }else if(this.application.ninja.breadCrumbClick){
-                    var parentNode = this.application.ninja.currentSelectedContainer;
-                    for (myIndex = 0; parentNode.children[myIndex]; myIndex++) {
-                        this._openDoc = true;
-                        this.restoreLayer(parentNode.children[myIndex]);
-                    }
-                    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;
-                this.application.ninja.currentDocument.tlCurrentSelectedContainer=this.application.ninja.currentSelectedContainer;
-
+                
+                // Draw the repetition.
+                this.arrLayers = this.temparrLayers;
+                this.currentLayerNumber = this.arrLayers.length;
+                
+                        } else if (this.application.ninja.breadCrumbClick) {
+                                // Information stored, but we're moving up or down in the breadcrumb.