3 files changed, 56 insertions, 3 deletions

diff --git a/js/panels/Timeline/Layer.reel/Layer.js b/js/panels/Timeline/Layer.reel/Layer.js
index 776d5ec8..2deb20da 100644
--- a/js/panels/Timeline/Layer.reel/Layer.js
+++ b/js/panels/Timeline/Layer.reel/Layer.js
@@ -752,12 +752,20 @@ var Layer = exports.Layer = Montage.create(Component, {
                         //defaultEventManager.dispatchEvent(newEvent);
                         
                         // Dispatch the event to the TimelineTrack component associated with this Layer.
-                        var myIndex = this.application.ninja.timeline.getActiveLayerIndex(),
+                        var myIndex = false,
+                                i = 0, 
+                                arrLayersLength = this.parentComponent.parentComponent.arrLayers.length,
                                 arrTracks = document.querySelectorAll('[data-montage-id="track"]');
-
+                        
+                        for (i = 0; i < arrLayersLength; i++) {
+                                if (this.stageElement == this.parentComponent.parentComponent.arrLayers[i].layerData.stageElement) {
+                                        myIndex = i;
+                                }
+                        }
+                        
                         if (myIndex !== false) {
                                 arrTracks[myIndex].dispatchEvent(newEvent);
-                        }
+                        } 
                 }
         },
 
@@ -945,12 +953,14 @@ var Layer = exports.Layer = Montage.create(Component, {
                                 this.isMainCollapsed = false;
                         } else {
                                 this.isMainCollapsed = true;
+                                this.application.ninja.timeline.synchScrollbars(43);
                         }
                         this.triggerOutgoingBinding();
                 }
         },
         handlePositionCollapserClick : {
                 value: function(event) {
+                        var myHeight = this.positionCollapser.element.offsetHeight;
                         this.positionCollapser.bypassAnimation = false;
                         this.bypassAnimation = false;
                         this.layerData.bypassAnimation = false;
@@ -958,12 +968,14 @@ var Layer = exports.Layer = Montage.create(Component, {
                                 this.isPositionCollapsed = false;
                         } else {
                                 this.isPositionCollapsed = true;
+                                this.application.ninja.timeline.synchScrollbars(myHeight);
                         }
                         this.triggerOutgoingBinding();
                 }
         },
         handleStyleCollapserClick : {
                 value: function(event) {
+                        var myHeight = this.styleCollapser.element.offsetHeight;
                         this.styleCollapser.bypassAnimation = false;
                         this.bypassAnimation = false;
                         this.layerData.bypassAnimation = false;
@@ -971,6 +983,7 @@ var Layer = exports.Layer = Montage.create(Component, {
                                 this.isStyleCollapsed = false;
                         } else {
                                 this.isStyleCollapsed = true;
+                                this.application.ninja.timeline.synchScrollbars(myHeight);
                         }
                         this.triggerOutgoingBinding();
                 }
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
index 040ae7be..4185e54a 100644
--- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
+++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
@@ -243,6 +243,10 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
         value: false
     },
     
+    _areTracksCollapsing: {
+        value: false
+    },
+    
     _currentOpenSpanMenu: {
         value: false
     },
@@ -687,6 +691,14 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
                         // We have shuffled layers, so we need to update this.selectedLayers.
                         this.selectLayers([])
                 }
+
+                // Do we need to scroll the layers?
+                if (this._areTracksCollapsing !== false) {
+                        //console.log("diddraw: user_layers, layout_tracks", this.user_layers.scrollTop, this.layout_tracks.scrollTop);
+                    //this.layout_tracks.scrollTop = this.user_layers.scrollTop;\
+                    this.layout_tracks.scrollTop = this._areTracksCollapsing;
+                        this._areTracksCollapsing = false;
+                }
         }
     },
 
@@ -1097,11 +1109,25 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
             this.drawTimeMarkers();
         }
     },
+    
+    synchScrollbars: {
+        value: function(intScrollBy) {
+                //this.updateLayerScroll();
+                //this.user_layers.scrollTop = 0;
+                //this.layout_tracks.scrollTop = this.user_layers.scrollTop;
+                //console.log("synch: user_layers, layout_tracks", this.user_layers.scrollTop, this.layout_tracks.scrollTop);
+                this._areTracksCollapsing = this.layout_tracks.scrollTop - intScrollBy;
+                this.needsDraw = true;
+
+        }
+    },
 
     updateLayerScroll:{
         value:function () {
+                //console.log("TimelinePanel.updateLayerScroll")
                 this._areTracksScrolling = true;
                 this.needsDraw = true;
+                
         }
     },
 
diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
index 98989022..d4eabbf5 100644
--- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
+++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
@@ -72,6 +72,19 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
                 this.trackData.isVisible = value;
         }
     },
+    
+    _stageElement: {
+        value: null
+    },
+    stageElement: {
+        get: function() {
+                return this._stageElement;
+        },
+        set: function(newVal) {
+                this._stageElement = newVal;
+                this.trackData.stageElement = newVal;
+        }
+    },
 
     // Are the various collapsers collapsed or not
     _isMainCollapsed:{
@@ -484,6 +497,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
             this.isStyleCollapsed = this.trackData.isStyleCollapsed;
             this.trackPosition = this.trackData.trackPosition;
             this.isVisible = this.trackData.isVisible;
+            this.stageElement = this.trackData.stageElement;
             this.trackEditorProperty = "master";
             this.needsDraw = true;
         }