4 files changed, 432 insertions, 133 deletions

diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html
index 091470f3..502c455b 100644
--- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html
+++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html
@@ -15,10 +15,10 @@
                        "properties": {
                            "element": {"#": "track"},
                            "tweenRepetition" : {"@" : "tweenRepetition"},
+                           "track_lanes" : {"#" : "track_lanes"},
                            "tween": {"@" : "tween"},
                            "mainCollapser" : {"@" : "mainCollapser"},
                            "positionCollapser" : {"@" : "positionCollapser"},
-                           "transformCollapser" : {"@" : "transformCollapser"},
                            "styleCollapser" : {"@" : "styleCollapser"}
                        }
                    },
@@ -51,7 +51,6 @@
                                }
                            }
                    },
-
                    "styleTrackRepetition": {
                        "prototype": "montage/ui/repetition.reel",
                            "properties": {
@@ -66,6 +65,19 @@
                                }
                            }
                    },
+                   "stylePropertyTrack" : {
+                        "prototype" : "js/panels/Timeline/PropertyTrack.reel",
+                                "properties" : {
+                                        "element":{"#": "style-track-base"}
+                                },
+                        "bindings" : {
+                            "propTrackData" : {
+                                    "boundObject" : {"@" : "styleTrackRepetition"},
+                                    "boundObjectPropertyPath" : "objectAtCurrentIteration.propTrackData",
+                                    "oneway" : false
+                                }
+                        }
+                   },
                    "positionTracksRepetition": {
                        "prototype": "montage/ui/repetition.reel",
                            "properties": {
@@ -84,27 +96,14 @@
                                                 "prototype" : "js/panels/Timeline/PropertyTrack.reel",
                                                 "properties" : {
                                                         "element":{"#": "position-track-base"}
-                                                }
-                                        },
-                   "transformTracksRepetition": {
-                       "prototype": "montage/ui/repetition.reel",
-                           "properties": {
-                               "element": {"#": "content-transform-tracks"},
-                               "isSelectionEnabled" : false
-                           },
-                           "bindings": {
-                               "objects": {
-                                   "boundObject": {"@": "owner"},
-                                   "boundObjectPropertyPath": "arrTransformTracks",
-                                   "oneway": false
-                               }
-                           }
-                   },
-                                        "transformPropertyTrack" : {
-                                                "prototype" : "js/panels/Timeline/PropertyTrack.reel",
-                                                "properties" : {
-                                                        "element":{"#": "transform-track-base"}
-                                                }
+                                                },
+                        "bindings" : {
+                            "propTrackData" : {
+                                 "boundObject" : {"@" : "positionTracksRepetition"},
+                                 "boundObjectPropertyPath" : "objectAtCurrentIteration.propTrackData",
+                                 "oneway" : false
+                            }
+                        }
                                         },
                                         
                                         "mainCollapser" : {
@@ -157,31 +156,6 @@
                                                 }
                                         },
                                         
-                                        "transformCollapser" : {
-                                                "prototype" : "js/panels/timeline/Collapser",
-                                                "properties" : {
-                                                        "element" : {"#" : "content-transform-tracks"},
-                                                        "myContent" : {"#":"content-transform-tracks"},
-                                                        "contentHeight" : 40,
-                                                        "isLabelClickable" : false,
-                                                        "clicker" : {"#" : "label-transform"},
-                                                        "isCollapsed" : true,
-                                                        "isAnimated" : true     
-                                                },
-                                                "bindings" : {
-                                                        "isToggling" : {
-                                                                "boundObject" : {"@" : "owner" },
-                                                                "boundObjectPropertyPath" : "isTransformCollapsed",
-                                                                "oneway" : false
-                                                        },
-                                                        "bypassAnimation" : {
-                                                                "boundObject" : {"@": "owner"},
-                                                                "boundObjectPropertyPath" : "bypassAnimation",
-                                                                "oneway" : false
-                                                        }
-                                                }
-                                        },
-                                        
                                         "styleCollapser" : {
                                                 "prototype" : "js/panels/timeline/Collapser",
                                                 "properties" : {
@@ -214,7 +188,7 @@
         <body>
 
         <div data-montage-id="track" class="timeline-track">
-            <div data-montage-id="track_lanes" class="tracklane">
+            <div data-montage-id="track_lanes" class="tracklane" style="position: relative;">
                 <div data-montage-id="track_lane"></div>
             </div>
             <div class="label-main collapsible-label collapsible-collapsed" data-montage-id="label-main"></div>
@@ -225,17 +199,12 @@
                 <div class="content-position collapsible-content collapsible-collapsed" data-montage-id="content-position-tracks">
                         <div data-montage-id="position-track-base"></div>
                 </div>
-                <div class="label-transform collapsible-label collapsible-collapsed" data-montage-id="label-transform">
-                        
-                </div>
-                <div class="content-transform collapsible-content collapsible-collapsed" data-montage-id="content-transform-tracks">
-                        <div data-montage-id="transform-track-base"></div>
-                </div>
+
                 <div class="label-styles collapsible-label collapsible-collapsed" data-montage-id="label-styles">
                         
                 </div>
                 <div data-montage-id="content-styles" class="content-styles collapsible-content collapsible-collapsed">
-                        <div class="timeline-track"></div>
+                        <div data-montage-id="style-track-base"></div>
                 </div>
             </div>
         </div>
diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
index 87a5e156..3db57a3a 100644
--- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
+++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
@@ -41,6 +41,10 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
             this._tween = newVal;
         }
     },
+    
+    _isFirstDraw: {
+        value: true
+    },
 
     _isVisible:{
         value: true
@@ -147,6 +151,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
         value: null
     },
     styleTracksRepetition : {
+        serializable:true,
         get: function() {
                 return this._styleTracksRepetition;
         },
@@ -200,17 +205,6 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
             this.trackData.arrTransformTracks = newVal;
         }
     },
-    _transformTracksRepetition: {
-        value: null
-    },
-    transformTracksRepetition : {
-        get: function() {