Fix position tracks collapser to use unique element

Signed-off-by: Jonathan Duran <jduran@motorola.com>

4 files changed, 41 insertions, 19 deletions

diff --git a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js
index 791239d7..0605e300 100644
--- a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js
+++ b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js
@@ -40,10 +40,6 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, {
         value:""
     },
 
-    _propTweenRepetition:{
-        value:null
-    },
-
     animatedElement:{
         value:null
     },
@@ -52,8 +48,11 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, {
         value:true
     },
 
+    _propTweenRepetition:{
+        value:null
+    },
+
     propTweenRepetition:{
-        serializable:true,
         get:function () {
             return this._propTweenRepetition;
         },
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
index 339ca5a4..a67de4cc 100644
--- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
+++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
@@ -686,6 +686,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
             returnObj.layerData.currentKeyframeRule = null;
             returnObj.layerData.trackPosition = 0;
             returnObj.layerData.arrStyleTracks = [];
+            returnObj.layerData.arrPositionTracks = [];
             returnObj.layerData.tweens = [];
             returnObj.layerData.layerTag = "";
             returnObj.layerData.isVisible = true;
diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html
index 502c455b..79014ae6 100644
--- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html
+++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.html
@@ -17,6 +17,8 @@
                            "tweenRepetition" : {"@" : "tweenRepetition"},
                            "track_lanes" : {"#" : "track_lanes"},
                            "tween": {"@" : "tween"},
+                           "positionTracksRepetition" : {"@" : "positionTracksRepetition"},
+                           "positionPropertyTrack" : {"@" : "positionPropertyTrack"},
                            "mainCollapser" : {"@" : "mainCollapser"},
                            "positionCollapser" : {"@" : "positionCollapser"},
                            "styleCollapser" : {"@" : "styleCollapser"}
@@ -81,7 +83,7 @@
                    "positionTracksRepetition": {
                        "prototype": "montage/ui/repetition.reel",
                            "properties": {
-                               "element": {"#": "content-position-tracks"},
+                               "element": {"#": "content_position_tracks"},
                                "isSelectionEnabled" : false
                            },
                            "bindings": {
@@ -95,7 +97,7 @@
                                         "positionPropertyTrack" : {
                                                 "prototype" : "js/panels/Timeline/PropertyTrack.reel",
                                                 "properties" : {
-                                                        "element":{"#": "position-track-base"}
+                                                        "element":{"#": "position_track_base"}
                                                 },
                         "bindings" : {
                             "propTrackData" : {
@@ -134,8 +136,8 @@
                                         "positionCollapser" : {
                                                 "prototype" : "js/panels/timeline/Collapser",
                                                 "properties" : {
-                                                        "element" : {"#" : "content-position-tracks"},
-                                                        "myContent" : {"#":"content-position-tracks"},
+                                                        "element" : {"#" : "content_position_collapser"},
+                                                        "myContent" : {"#":"content_position_collapser"},
                                                         "contentHeight" : 40,
                                                         "isLabelClickable" : false,
                                                         "clicker" : {"#" : "label-position"},
@@ -194,11 +196,14 @@
             <div class="label-main collapsible-label collapsible-collapsed" data-montage-id="label-main"></div>
             <div class="collapsible-content collapsible-collapsed content-main" data-montage-id="content-main">
                 <div class="label-position collapsible-label collapsible-collapsed" data-montage-id="label-position">
-                        
-                </div>
-                <div class="content-position collapsible-content collapsible-collapsed" data-montage-id="content-position-tracks">
-                        <div data-montage-id="position-track-base"></div>
-                </div>
+
+                </div>
+                <div class="content-position collapsible-content collapsible-collapsed"
+                     data-montage-id="content_position_collapser">
+                    <div data-montage-id="content_position_tracks">
+                        <div data-montage-id="position_track_base"></div>
+                    </div>
+                </div>
 
                 <div class="label-styles collapsible-label collapsible-collapsed" data-montage-id="label-styles">
                         
diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
index 84bac2cb..26ccfe09 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;
         }
     },
+
+    positionPropertyTrack:{
+        value:null
+    },
     
     _isFirstDraw: {
         value: true
@@ -171,9 +175,6 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
         },
         set: function(newVal) {
                 this._arrPositionTracks = newVal;
-                if (typeof(this.trackData) === "undefined") {
-                        //this.createTrackData();
-                }
                 this.trackData.arrPositionTracks = newVal;
             
         }
@@ -189,8 +190,8 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
                 this._positionTracksRepetition = newVal;
         }
     },
-    
-    
+
+
     /* Transform Property Tracks */
     _arrTransformTracks : {
         value: []
@@ -470,6 +471,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
             this.bypassAnimation = this.trackData.bypassAnimation;
             this.trackID = this.trackData.layerID;
             this.tweens = this.trackData.tweens;
+            this.arrPositionTracks = this.trackData.arrPositionTracks;
             this.animatedElement = this.trackData.animatedElement;
             this.arrStyleTracks = this.trackData.arrStyleTracks;
             this.isTrackAnimated = this.trackData.isTrackAnimated;
@@ -486,6 +488,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
             this.needsDraw = true;
         }
     },
+
     createTrackData: {
         value: function() {
                 tempData = {};
@@ -494,6 +497,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
             tempData.tweens = this.tweens;
             tempData.animatedElement = this.animatedElement; 
             tempData.arrStyleTracks = this.arrStyleTracks;
+            tempData.arrPositionTracks = this.arrPositionTracks;
             tempData.isTrackAnimated = this.isTrackAnimated;
             tempData.trackDuration = this.trackDuration;
             tempData.animationName = this.animationName;
@@ -785,10 +789,23 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
                 this.nextKeyframe += 1;
             }
 
+            this.createMatchingPositionSizeTweens(clickPos);