diff options
author | Kruti Shah | 2012-06-26 13:10:50 -0700 |
---|---|---|
committer | Kruti Shah | 2012-06-26 13:10:50 -0700 |
commit | 0217858c93c54c9b65da4c4c52730a5221664ea8 (patch) | |
tree | 696ba23b6c66237eae5c98b0c3fee62909841708 | |
parent | a2047a565aa5ef8643c5d71de3cc484191d6c671 (diff) | |
parent | d9170ea8ac54aa2aefd43de15defb439e65fa1f3 (diff) | |
download | ninja-0217858c93c54c9b65da4c4c52730a5221664ea8.tar.gz |
Merge branch 'refs/heads/TimelineUberJD' into Timeline-local-kruti
-rw-r--r-- | js/panels/Timeline/Keyframe.reel/Keyframe.js | 10 | ||||
-rw-r--r-- | js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js | 8 | ||||
-rw-r--r-- | js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | 7 | ||||
-rw-r--r-- | js/panels/Timeline/Tween.reel/Tween.js | 1 |
4 files changed, 18 insertions, 8 deletions
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, { | |||
76 | 76 | ||
77 | selectKeyframe:{ | 77 | selectKeyframe:{ |
78 | value:function(){ | 78 | value:function(){ |
79 | |||
80 | if(this.parentComponent.parentComponent.parentComponent.trackType == "position"){ | ||
81 | var tweenID = this.parentComponent.tweenID; | ||
82 | var mainTrack = this.parentComponent.parentComponent.parentComponent.parentComponent.parentComponent.parentComponent.parentComponent; | ||
83 | mainTrack.childComponents[0].childComponents[tweenID].childComponents[0].selectKeyframe(); | ||
84 | return; | ||
85 | } | ||
86 | |||
79 | this.isSelected=true; | 87 | this.isSelected=true; |
80 | this.element.style.left = (this.position - 6) + "px"; | 88 | this.element.style.left = (this.position - 6) + "px"; |
81 | this.application.ninja.timeline.selectedStyle = this.parentComponent.parentComponent.parentComponent.trackEditorProperty | 89 | this.application.ninja.timeline.selectedStyle = this.parentComponent.parentComponent.parentComponent.trackEditorProperty; |
82 | this.parentComponent.selectTween(); | 90 | this.parentComponent.selectTween(); |
83 | } | 91 | } |
84 | }, | 92 | }, |
diff --git a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js index c18d6eff..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, { | |||
442 | 442 | ||
443 | for (var i = 0; i < this.propTweens.length; i++) { | 443 | for (var i = 0; i < this.propTweens.length; i++) { |
444 | var keyMill = parseInt(this.propTweens[i].tweenData.keyFrameMillisec); | 444 | var keyMill = parseInt(this.propTweens[i].tweenData.keyFrameMillisec); |
445 | // TODO - trackDur should be parseFloat rounded to significant digits | 445 | // trackDur should be parseFloat rounded to significant digits |
446 | var trackDur = parseInt(this.trackDuration); | 446 | var trackDur = parseInt(this.trackDuration); |
447 | var keyframePercent = Math.round((keyMill / trackDur) * 100) + "%"; | 447 | var keyframePercent = Math.round((keyMill / trackDur) * 100) + "%"; |
448 | var keyframePropertyString = " " + keyframePercent + " {"; | 448 | var keyframePropertyString = " " + keyframePercent + " {"; |
449 | for(var prop in this.propTweens[i].tweenData.tweenedProperties){ | 449 | for(var prop in this.propTweens[i].tweenData.tweenedProperties){ |
450 | keyframePropertyString += prop + ": " + this.propTweens[i].tweenData.tweenedProperties[prop]; | 450 | keyframePropertyString += prop + ": " + this.propTweens[i].tweenData.tweenedProperties[prop] + ";"; |
451 | } | 451 | } |
452 | keyframePropertyString += "}"; | 452 | keyframePropertyString += "}"; |
453 | keyframeString += keyframePropertyString; | 453 | keyframeString += keyframePropertyString; |
@@ -469,7 +469,7 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, { | |||
469 | this.propTweens[0].tweenData.tweenedProperties[this.trackEditorProperty] = currentStyleValue; | 469 | this.propTweens[0].tweenData.tweenedProperties[this.trackEditorProperty] = currentStyleValue; |
470 | 470 | ||
471 | this.animationName = this.animatedElement.classList[0] + "_" + this.trackEditorProperty; | 471 | this.animationName = this.animatedElement.classList[0] + "_" + this.trackEditorProperty; |
472 | var currentAnimationNameString = this.parentComponent.parentComponent.parentComponent.animationNamesString; | 472 | var currentAnimationNameString = this.parentComponent.parentComponent.parentComponent.parentComponent.animationNamesString; |
473 | var newAnimationNames = currentAnimationNameString + "," + this.animationName; | 473 | var newAnimationNames = currentAnimationNameString + "," + this.animationName; |
474 | var currentAnimationDuration = this.ninjaStylesContoller.getElementStyle(this.animatedElement, "-webkit-animation-duration"); | 474 | var currentAnimationDuration = this.ninjaStylesContoller.getElementStyle(this.animatedElement, "-webkit-animation-duration"); |
475 | var newAnimationDuration = currentAnimationDuration + "," + currentAnimationDuration; | 475 | var newAnimationDuration = currentAnimationDuration + "," + currentAnimationDuration; |
@@ -479,8 +479,8 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, { | |||
479 | this.parentComponent.parentComponent.parentComponent.animationNamesString = newAnimationNames; | 479 | this.parentComponent.parentComponent.parentComponent.animationNamesString = newAnimationNames; |
480 | 480 | ||
481 | this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-name", newAnimationNames); | 481 | this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-name", newAnimationNames); |
482 | |||
483 | this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-duration", newAnimationDuration); | 482 | this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-duration", newAnimationDuration); |
483 | this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-fill-mode", "forwards"); | ||
484 | this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-iteration-count", newIterationCount); | 484 | this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-iteration-count", newIterationCount); |
485 | 485 | ||
486 | var initRule = "@-webkit-keyframes " + this.animationName + " { 0% {" + this.trackEditorProperty + ": " + currentStyleValue + ";} 100% {" + this.trackEditorProperty + ": " + currentStyleValue + ";} }"; | 486 | var initRule = "@-webkit-keyframes " + this.animationName + " { 0% {" + this.trackEditorProperty + ": " + currentStyleValue + ";} 100% {" + this.trackEditorProperty + ": " + currentStyleValue + ";} }"; |
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, { | |||
1039 | value:function (tweenEvent) { | 1039 | value:function (tweenEvent) { |
1040 | this.tweens[0].tweenData.tweenedProperties["top"] = this.animatedElement.offsetTop + "px"; | 1040 | this.tweens[0].tweenData.tweenedProperties["top"] = this.animatedElement.offsetTop + "px"; |
1041 | this.tweens[0].tweenData.tweenedProperties["left"] = this.animatedElement.offsetLeft + "px"; | 1041 | this.tweens[0].tweenData.tweenedProperties["left"] = this.animatedElement.offsetLeft + "px"; |
1042 | this.tweens[0].tweenData.tweenedProperties["width"] = this.animatedElement.offsetWidth + "px"; | ||
1043 | this.tweens[0].tweenData.tweenedProperties["height"] = this.animatedElement.offsetHeight + "px"; | ||
1042 | var animationDuration = Math.round(this.trackDuration / 1000) + "s"; | 1044 | var animationDuration = Math.round(this.trackDuration / 1000) + "s"; |
1043 | this.animationName = this.animatedElement.classList[0] + "_PositionSize"; | 1045 | this.animationName = this.animatedElement.classList[0] + "_PositionSize"; |
1044 | this.animationNamesString = this.animationName; | 1046 | this.animationNamesString = this.animationName; |
1045 | this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-name", this.animationName); | 1047 | this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-name", this.animationName); |
1046 | this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-duration", animationDuration); | 1048 | this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-duration", animationDuration); |
1049 | this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-fill-mode", "forwards"); | ||
1047 | this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-iteration-count", 1); | 1050 | this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-iteration-count", 1); |
1051 | |||
1048 | 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;} }"; | 1052 | 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;} }"; |
1049 | 1053 | ||
1050 | this.currentKeyframeRule = this.ninjaStylesContoller.addRule(initRule); | 1054 | this.currentKeyframeRule = this.ninjaStylesContoller.addRule(initRule); |
1051 | |||
1052 | this.insertTween(tweenEvent.offsetX); | 1055 | this.insertTween(tweenEvent.offsetX); |
1053 | this.isTrackAnimated = true; | 1056 | this.isTrackAnimated = true; |
1054 | } | 1057 | } |
@@ -1062,7 +1065,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { | |||
1062 | // build the new keyframe string | 1065 | // build the new keyframe string |
1063 | var keyframeString = "@-webkit-keyframes " + this.animationName + " {"; | 1066 | var keyframeString = "@-webkit-keyframes " + this.animationName + " {"; |
1064 | 1067 | ||
1065 | console.log(this.animationName); | 1068 | //console.log(this.animationName); |
1066 | 1069 | ||
1067 | for (var i = 0; i < this.tweens.length; i++) { | 1070 | for (var i = 0; i < this.tweens.length; i++) { |
1068 | var keyMill = parseInt(this.tweens[i].tweenData.keyFrameMillisec); | 1071 | var keyMill = parseInt(this.tweens[i].tweenData.keyFrameMillisec); |
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, { | |||
206 | if (event.detail.source && event.detail.source !== "tween") { | 206 | if (event.detail.source && event.detail.source !== "tween") { |
207 | 207 | ||
208 | if(this.parentComponent.parentComponent.isSubproperty){ | 208 | if(this.parentComponent.parentComponent.isSubproperty){ |
209 | console.log("setting style tween property") | ||
210 | this.setStyleTweenProperty(event.detail); | 209 | this.setStyleTweenProperty(event.detail); |
211 | } else { | 210 | } else { |
212 | // check for correct element selection | 211 | // check for correct element selection |