Lock Position and Size keyframes to main track keyframes

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

2 files changed, 20 insertions, 15 deletions

diff --git a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js
index 0605e300..3a998617 100644
--- a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js
+++ b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js
@@ -17,7 +17,7 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, {
         value:function(){
             this.element.addEventListener("click", this, false);
             this.trackID = this.parentComponent.parentComponent.parentComponent.trackID;
-            this.animatedElement = this.parentComponent.parentComponent.parentComponent.animatedElement;
+            this.animatedElement = this.parentComponent.parentComponent.parentComponent.parentComponent.animatedElement;
             this.ninjaStylesContoller = this.application.ninja.stylesController;
         }
     },
@@ -180,7 +180,7 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, {
             if (ev.shiftKey) {
 
                 if (this.trackType == "position") {
-                    this.parentComponent.parentComponent.parentComponent.handleNewTween(ev);
+                    this.parentComponent.parentComponent.parentComponent.parentComponent.handleNewTween(ev);
                 }
 
                 if (this.propTweens.length < 1) {
@@ -199,16 +199,17 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, {
                             this.trackEditorProperty = this.application.ninja.timeline.arrLayers[selectIndex].layerData.arrLayerStyles[currentSelectedStyleIndex].editorProperty;
                             //console.log("Property track editorProperty set to: " + this.trackEditorProperty);
                         }
+                        this.insertPropTween(0);
+                        this.addPropAnimationRuleToElement(ev);
+                        this.updatePropKeyframeRule();
                     } else if (this.trackType == "position") {
                         //console.log("Property track editorProperty set to: " + this.trackEditorProperty);
                     }
-
-                    this.insertPropTween(0);
-                    this.addPropAnimationRuleToElement(ev);
-                    this.updatePropKeyframeRule();
                 } else {
                     this.handleNewPropTween(ev);
-                    this.updatePropKeyframeRule();
+                    if (this.trackType == "style") {
+                        this.updatePropKeyframeRule();
+                    }
                 }
             }
         }
diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
index 26ccfe09..1a8b6f4e 100644
--- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
+++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
@@ -763,12 +763,16 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
                 newTween.tweenData.keyFrameMillisec = 0;
                 newTween.tweenData.tweenID = 0;
                 newTween.tweenData.spanPosition = 0;
+                newTween.tweenData.easing = "none";
                 newTween.tweenData.tweenedProperties = [];
                 newTween.tweenData.tweenedProperties["top"] = this.animatedElement.offsetTop + "px";
                 newTween.tweenData.tweenedProperties["left"] = this.animatedElement.offsetLeft + "px";
                 newTween.tweenData.tweenedProperties["width"] = this.animatedElement.offsetWidth + "px";
                 newTween.tweenData.tweenedProperties["height"] = this.animatedElement.offsetHeight + "px";
                 this.tweens.push(newTween);
+
+                this.createMatchingPositionSizeTween(newTween);
+
             } else {
                 newTween.tweenData.spanWidth = clickPos - this.tweens[this.tweens.length - 1].tweenData.keyFramePosition;
                 newTween.tweenData.keyFramePosition = clickPos;
@@ -787,21 +791,22 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
                 var animationDuration = (this.trackDuration / 1000) + "s";
                 this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-duration", animationDuration);
                 this.nextKeyframe += 1;
+
+                this.createMatchingPositionSizeTween(newTween);
             }
 
-            this.createMatchingPositionSizeTweens(clickPos);
+
 
             this.application.ninja.currentDocument.model.needsSave = true;
         }
     },
 
-    createMatchingPositionSizeTweens:{
-        value:function (position) {
-            console.log(this.positionTracksRepetition);
+    createMatchingPositionSizeTween:{
+        value:function (newTween) {
             var i;
-            var posTracks = this.positionTracksRepetition.length;
+            var posTracks = this.positionTracksRepetition.childComponents.length;
             for (i = 0; i < posTracks; i++) {
-
+                this.positionTracksRepetition.childComponents[i].propTweens.push(newTween);
             }
         }
     },
@@ -812,8 +817,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
                 i,
                 tweensLength = this.tweens.length-1,
                 prevTween, nextTween, splitTweenIndex;
-            
-            consol.log(ev.target.className)
+
             for(i=0; i<tweensLength; i++){
                 prevTween = this.tweens[i].tweenData.keyFramePosition;
                 nextTween = this.tweens[i+1].tweenData.keyFramePosition;