support width and height tween prop on re-opening saved doc

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

3 files changed, 26 insertions, 7 deletions

diff --git a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js
index 43370a64..31e0b3b6 100644
--- a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js
+++ b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js
@@ -246,6 +246,12 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, {
         }
     },
 
+    retrieveStoredStyleTweens:{
+        value:function(){
+
+        }
+    },
+
     updatePropKeyframeRule:{
         value:function(){
             // delete the current rule
@@ -278,14 +284,13 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, {
             var currentStyleValue = this.ninjaStylesContoller.getElementStyle(this.animatedElement, this.trackEditorProperty);
             this.propTweens[0].tweenData.tweenedProperties[this.trackEditorProperty] = currentStyleValue;
 
-
             this.animationName = this.animatedElement.classList[0] + "_" + this.trackEditorProperty;
             var currentAnimationNameString = this.parentComponent.parentComponent.parentComponent.animationNamesString;
             var newAnimationNames = currentAnimationNameString + "," + this.animationName;
-            var currentAnimationDuration = this.ninjaStylesContoller.getElementStyle(this.animatedElement, "-webkit-animation-duration");
-            var newAnimationDuration = currentAnimationDuration + "," + currentAnimationDuration;
-            var currentIterationCount = this.ninjaStylesContoller.getElementStyle(this.animatedElement, "-webkit-animation-iteration-count");
-            var newIterationCount = currentIterationCount + ",1";
+            //var currentAnimationDuration = this.ninjaStylesContoller.getElementStyle(this.animatedElement, "-webkit-animation-duration");
+            //var newAnimationDuration = currentAnimationDuration + "," + currentAnimationDuration;
+            //var currentIterationCount = this.ninjaStylesContoller.getElementStyle(this.animatedElement, "-webkit-animation-iteration-count");
+            //var newIterationCount = currentIterationCount + ",1";
 
             this.parentComponent.parentComponent.parentComponent.animationNamesString = newAnimationNames;
 
diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
index d8259281..8693e828 100644
--- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
+++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
@@ -718,7 +718,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
 
     retrieveStoredTweens:{
         value:function () {
-            var percentValue, fraction, splitValue,offsetAttribute,topOffSetAttribute,leftOffsetAttribute;
+            var percentValue, fraction, splitValue,offsetAttribute,topOffSetAttribute,leftOffsetAttribute,widthOffsetAttribute,heightOffsetAttribute;
             var currentMilliSec,currentMilliSecPerPixel,clickPosition,tempTiming,tempTimingFloat,trackTiming,i = 0;
 
             var selectedIndex = this.application.ninja.timeline.getLayerIndexByID(this.trackID);
@@ -737,11 +737,16 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
                         newTween.tweenData = {};
 
                         offsetAttribute = this.currentKeyframeRule[i].cssText.split(" ");
+                        
                         topOffSetAttribute = offsetAttribute[3].split("px");
                         leftOffsetAttribute = offsetAttribute[5].split("px");
+                        widthOffsetAttribute = offsetAttribute[7].split("px");
+                        heightOffsetAttribute = offsetAttribute[9].split("px");
 
                         var tempTopOffset = parseInt(topOffSetAttribute[0]);
-                        var tempLeftOffset =parseInt(leftOffsetAttribute[0]);
+                        var tempLeftOffset = parseInt(leftOffsetAttribute[0]);
+                        var tempWidthOffset = parseInt(widthOffsetAttribute[0]);
+                        var tempHeightOffset = parseInt(heightOffsetAttribute[0]);
 
                         if (this.currentKeyframeRule[i].keyText === "0%") {
                             newTween.tweenData.spanWidth = 0;
@@ -752,6 +757,8 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
                             newTween.tweenData.tweenedProperties = [];
                             newTween.tweenData.tweenedProperties["top"] = tempTopOffset;
                             newTween.tweenData.tweenedProperties["left"] = tempLeftOffset;
+                            newTween.tweenData.tweenedProperties["width"] = tempWidthOffset;
+                            newTween.tweenData.tweenedProperties["height"] = tempHeightOffset;
                             this.tweens.push(newTween);
                         }
                         else {
@@ -772,6 +779,8 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
                             newTween.tweenData.tweenedProperties=[];
                             newTween.tweenData.tweenedProperties["top"] = tempTopOffset;
                             newTween.tweenData.tweenedProperties["left"] = tempLeftOffset;
+                            newTween.tweenData.tweenedProperties["width"] = tempWidthOffset;
+                            newTween.tweenData.tweenedProperties["height"] = tempHeightOffset;
                             this.tweens.push(newTween);
                         }
                         this.nextKeyframe += 1;
diff --git a/js/panels/Timeline/Tween.reel/Tween.js b/js/panels/Timeline/Tween.reel/Tween.js
index 63dabefe..3c0223c1 100644
--- a/js/panels/Timeline/Tween.reel/Tween.js
+++ b/js/panels/Timeline/Tween.reel/Tween.js
@@ -282,9 +282,14 @@ var Tween = exports.Tween = Montage.create(Component, {
                 // move animated element to correct position on stage
                 var currentTop = this.tweenedProperties["top"] + "px";
                 var currentLeft = this.tweenedProperties["left"] + "px";
+                var currentWidth = this.tweenedProperties["width"] + "px";
+                var currentHeight = this.tweenedProperties["height"] + "px";
 
                 this.application.ninja.elementMediator.setProperty([this.parentComponent.parentComponent.animatedElement], "top", [currentTop], "Change", "tween");
                 this.application.ninja.elementMediator.setProperty([this.parentComponent.parentComponent.animatedElement], "left", [currentLeft], "Change", "tween");
+                this.application.ninja.elementMediator.setProperty([this.parentComponent.parentComponent.animatedElement], "width", [currentWidth], "Change", "tween");
+                this.application.ninja.elementMediator.setProperty([this.parentComponent.parentComponent.animatedElement], "height", [currentHeight], "Change", "tween");
+
             }
         }
     },