2 files changed, 292 insertions, 116 deletions

diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html
index 92adee05..77481ac0 100644
--- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html
+++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html
@@ -101,6 +101,11 @@
                                         "boundObjectPropertyPath" : "objectAtCurrentIteration.isTransformCollapsed",
                                         "oneway" : false
                                 },
+                                "animateCollapser" : {
+                                        "boundObject" : {"@" : "repetition1"},
+                                        "boundObjectPropertyPath" : "objectAtCurrentIteration.animateCollapser",
+                                        "oneway" : false
+                                },
                                 "isSelected" : {
                                         "boundObject" : {"@" : "repetition1"},
                                         "boundObjectPropertyPath" : "objectAtCurrentIteration.isSelected",
@@ -116,6 +121,11 @@
                                         "boundObjectPropertyPath" : "objectAtCurrentIteration.isStyleCollapsed",
                                         "oneway" : false
                                 },
+                                "animateCollapser" : {
+                                        "boundObject" : {"@" : "repetition1"},
+                                        "boundObjectPropertyPath" : "objectAtCurrentIteration.animateCollapser",
+                                        "oneway" : false
+                                },
                                 "dtextPositionX" : {
                                         "boundObject" : {"@" : "repetition1"},
                                         "boundObjectPropertyPath" : "objectAtCurrentIteration.dtextPositionX",
@@ -164,7 +174,7 @@
                         "bindings": {
                             "objects": {
                                 "boundObject": {"@": "owner"},
-                                "boundObjectPropertyPath": "arrTracks",
+                                "boundObjectPropertyPath": "arrLayers",
                                 "oneway": false
                             }
                         }
@@ -178,7 +188,7 @@
                         "bindings" : {
                                 "trackID" : {
                                         "boundObject" : {"@" : "repetition2"},
-                                        "boundObjectPropertyPath" : "objectAtCurrentIteration.trackID",
+                                        "boundObjectPropertyPath" : "objectAtCurrentIteration.layerID",
                                         "oneway" : false
                                 },
                                 "tweens" : {
@@ -231,6 +241,11 @@
                                         "boundObjectPropertyPath" : "objectAtCurrentIteration.isTransformCollapsed",
                                         "oneway" : false
                                 },
+                                "animateCollapser" : {
+                                        "boundObject" : {"@" : "repetition2"},
+                                        "boundObjectPropertyPath" : "objectAtCurrentIteration.animateCollapser",
+                                        "oneway" : false
+                                },
                                 "isStyleCollapsed" : {
                                         "boundObject" : {"@" : "repetition2"},
                                         "boundObjectPropertyPath" : "objectAtCurrentIteration.isStyleCollapsed",
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
index d7d5328e..91277a63 100644
--- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
+++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
@@ -28,6 +28,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
         },
         set:function (newVal) {
             this._arrLayers = newVal;
+            this._cacheArrays();
         }
     },
 
@@ -44,6 +45,19 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
         }
     },
 
+    _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
+    },
+
     _currentLayerNumber:{
         value:0
     },
@@ -63,10 +77,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
         value: null
     },
 
-    currentTrackSelected:{
-        value: null
-    },
-
     millisecondsOffset:{
         value:1000
     },
@@ -99,6 +109,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
         },
         set:function (newVal) {
             this._arrTracks = newVal;
+            this._cacheArrays();
         }
     },
 
@@ -163,37 +174,21 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
         value:false,
         writable:true
     },
+
     timeMarkerHolder:{
         value: null
     },
     /* === END: Models === */
-
     /* === BEGIN: Draw cycle === */
     prepareForDraw:{
-            value:function () {
-                this.eventManager.addEventListener( "onOpenDocument", this, false);
-            }
-        },
-
-    handleOnOpenDocument:{
-        value:function(){
-            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();
-
-
+        value:function () {
+            this.initTimeline();
+            this.eventManager.addEventListener("onOpenDocument", this, false);
+            this.eventManager.addEventListener("closeDocument", this, false);
+            this.eventManager.addEventListener("switchDocument", this, false);
         }
     },
+
     willDraw:{
         value:function () {
             if (this._isLayer) {
@@ -203,12 +198,37 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
         }
     },
     /* === END: Draw cycle === */
-
     /* === BEGIN: Controllers === */
-    initTimelineView:{
-        value:function () {
-            var myIndex;
-            this.layout_tracks = this.element.querySelector(".layout-tracks");
+        // 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++) {