From 64a3eb467e3ba92d2b0dd2c060d09ad6331cb763 Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Tue, 26 Jun 2012 10:36:47 -0700 Subject: Fix animation to end at last keyframe Signed-off-by: Jonathan Duran --- js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) (limited to 'js/panels') diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index 3a8d1ff3..98989022 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -1039,16 +1039,19 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { value:function (tweenEvent) { this.tweens[0].tweenData.tweenedProperties["top"] = this.animatedElement.offsetTop + "px"; this.tweens[0].tweenData.tweenedProperties["left"] = this.animatedElement.offsetLeft + "px"; + this.tweens[0].tweenData.tweenedProperties["width"] = this.animatedElement.offsetWidth + "px"; + this.tweens[0].tweenData.tweenedProperties["height"] = this.animatedElement.offsetHeight + "px"; var animationDuration = Math.round(this.trackDuration / 1000) + "s"; this.animationName = this.animatedElement.classList[0] + "_PositionSize"; this.animationNamesString = this.animationName; this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-name", this.animationName); this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-duration", animationDuration); + this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-fill-mode", "forwards"); this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-iteration-count", 1); + var initRule = "@-webkit-keyframes " + this.animationName + " { 0% {top: " + this.animatedElement.offsetTop + "px; left: " + this.animatedElement.offsetLeft + "px;} 100% {top: " + this.animatedElement.offsetTop + "px; left: " + this.animatedElement.offsetLeft + "px;} }"; this.currentKeyframeRule = this.ninjaStylesContoller.addRule(initRule); - this.insertTween(tweenEvent.offsetX); this.isTrackAnimated = true; } @@ -1062,7 +1065,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { // build the new keyframe string var keyframeString = "@-webkit-keyframes " + this.animationName + " {"; - console.log(this.animationName); + //console.log(this.animationName); for (var i = 0; i < this.tweens.length; i++) { var keyMill = parseInt(this.tweens[i].tweenData.keyFrameMillisec); -- cgit v1.2.3 From f8643c11746786f8e47801bbc510b246d337a71b Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Tue, 26 Jun 2012 10:40:01 -0700 Subject: Fix end animation for style tracks Signed-off-by: Jonathan Duran --- js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'js/panels') diff --git a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js index c18d6eff..291782b9 100644 --- a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js +++ b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js @@ -479,8 +479,8 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, { this.parentComponent.parentComponent.parentComponent.animationNamesString = newAnimationNames; this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-name", newAnimationNames); - this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-duration", newAnimationDuration); + this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-fill-mode", "forwards"); this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-iteration-count", newIterationCount); var initRule = "@-webkit-keyframes " + this.animationName + " { 0% {" + this.trackEditorProperty + ": " + currentStyleValue + ";} 100% {" + this.trackEditorProperty + ": " + currentStyleValue + ";} }"; -- cgit v1.2.3 From d506220a65f2edf195b3b43aa7dbd47839a7eef7 Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Tue, 26 Jun 2012 11:31:01 -0700 Subject: Fix sub prop animations Signed-off-by: Jonathan Duran --- js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js | 6 +++--- js/panels/Timeline/Tween.reel/Tween.js | 1 - 2 files changed, 3 insertions(+), 4 deletions(-) (limited to 'js/panels') diff --git a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js index 291782b9..31ba8253 100644 --- a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js +++ b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js @@ -442,12 +442,12 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, { for (var i = 0; i < this.propTweens.length; i++) { var keyMill = parseInt(this.propTweens[i].tweenData.keyFrameMillisec); - // TODO - trackDur should be parseFloat rounded to significant digits + // trackDur should be parseFloat rounded to significant digits var trackDur = parseInt(this.trackDuration); var keyframePercent = Math.round((keyMill / trackDur) * 100) + "%"; var keyframePropertyString = " " + keyframePercent + " {"; for(var prop in this.propTweens[i].tweenData.tweenedProperties){ - keyframePropertyString += prop + ": " + this.propTweens[i].tweenData.tweenedProperties[prop]; + keyframePropertyString += prop + ": " + this.propTweens[i].tweenData.tweenedProperties[prop] + ";"; } keyframePropertyString += "}"; keyframeString += keyframePropertyString; @@ -469,7 +469,7 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, { this.propTweens[0].tweenData.tweenedProperties[this.trackEditorProperty] = currentStyleValue; this.animationName = this.animatedElement.classList[0] + "_" + this.trackEditorProperty; - var currentAnimationNameString = this.parentComponent.parentComponent.parentComponent.animationNamesString; + var currentAnimationNameString = this.parentComponent.parentComponent.parentComponent.parentComponent.animationNamesString; var newAnimationNames = currentAnimationNameString + "," + this.animationName; var currentAnimationDuration = this.ninjaStylesContoller.getElementStyle(this.animatedElement, "-webkit-animation-duration"); var newAnimationDuration = currentAnimationDuration + "," + currentAnimationDuration; diff --git a/js/panels/Timeline/Tween.reel/Tween.js b/js/panels/Timeline/Tween.reel/Tween.js index 682a8619..2d4ae75d 100644 --- a/js/panels/Timeline/Tween.reel/Tween.js +++ b/js/panels/Timeline/Tween.reel/Tween.js @@ -206,7 +206,6 @@ var Tween = exports.Tween = Montage.create(Component, { if (event.detail.source && event.detail.source !== "tween") { if(this.parentComponent.parentComponent.isSubproperty){ - console.log("setting style tween property") this.setStyleTweenProperty(event.detail); } else { // check for correct element selection -- cgit v1.2.3 From d9170ea8ac54aa2aefd43de15defb439e65fa1f3 Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Tue, 26 Jun 2012 12:11:41 -0700 Subject: Fix sub prop tween selection to select main tween Signed-off-by: Jonathan Duran --- js/panels/Timeline/Keyframe.reel/Keyframe.js | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) (limited to 'js/panels') diff --git a/js/panels/Timeline/Keyframe.reel/Keyframe.js b/js/panels/Timeline/Keyframe.reel/Keyframe.js index ba6952aa..95a94b36 100644 --- a/js/panels/Timeline/Keyframe.reel/Keyframe.js +++ b/js/panels/Timeline/Keyframe.reel/Keyframe.js @@ -76,9 +76,17 @@ var Keyframe = exports.Keyframe = Montage.create(Component, { selectKeyframe:{ value:function(){ + + if(this.parentComponent.parentComponent.parentComponent.trackType == "position"){ + var tweenID = this.parentComponent.tweenID; + var mainTrack = this.parentComponent.parentComponent.parentComponent.parentComponent.parentComponent.parentComponent.parentComponent; + mainTrack.childComponents[0].childComponents[tweenID].childComponents[0].selectKeyframe(); + return; + } + this.isSelected=true; this.element.style.left = (this.position - 6) + "px"; - this.application.ninja.timeline.selectedStyle = this.parentComponent.parentComponent.parentComponent.trackEditorProperty + this.application.ninja.timeline.selectedStyle = this.parentComponent.parentComponent.parentComponent.trackEditorProperty; this.parentComponent.selectTween(); } }, -- cgit v1.2.3