aboutsummaryrefslogtreecommitdiff
path: root/js/panels/Timeline/TimelineTrack.reel
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/Timeline/TimelineTrack.reel')
-rw-r--r--js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js39
1 files changed, 35 insertions, 4 deletions
diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
index a1b1ce74..35440cc4 100644
--- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
+++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
@@ -671,7 +671,40 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
671 671
672 splitTween:{ 672 splitTween:{
673 value:function (ev) { 673 value:function (ev) {
674 console.log("Splitting an existing span with a new keyframe is not yet supported."); 674 console.log("Splitting an existing span with a new keyframe.");
675 var clickPos = ev.target.parentElement.offsetLeft + ev.offsetX;
676 var i;
677 var tweensLength = this.tweens.length-1;
678 var prevTween, nextTween, splitTweenIndex;
679 for(i=0; i<tweensLength; i++){
680 prevTween = this.tweens[i].tweenData.keyFramePosition;
681 nextTween = this.tweens[i+1].tweenData.keyFramePosition;
682 if(clickPos > prevTween && clickPos < nextTween){
683 console.log(clickPos + " found on tween: "+ this.tweens[i+1].tweenData.tweenID);
684 splitTweenIndex = this.tweens[i+1].tweenData.tweenID;
685 this.tweens[i+1].tweenData.spanWidth = this.tweens[i+1].tweenData.keyFramePosition - clickPos;
686 this.tweens[i+1].tweenData.spanPosition = ev.target.parentElement.offsetLeft + ev.offsetX;
687 ev.target.style.width = this.tweens[i+1].tweenData.spanWidth + "px";
688 ev.target.parentElement.style.left = clickPos + "px";
689 ev.target.parentElement.children[1].style.left = (this.tweens[i+1].tweenData.spanWidth - 3) + "px";
690
691 var newTweenToInsert = {};
692 newTweenToInsert.tweenData = {};
693 newTweenToInsert.tweenData.spanWidth = clickPos - prevTween;
694 newTweenToInsert.tweenData.keyFramePosition = clickPos;
695 newTweenToInsert.tweenData.keyFrameMillisec = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80) * clickPos;
696 newTweenToInsert.tweenData.tweenID = splitTweenIndex - 1;
697 newTweenToInsert.tweenData.spanPosition = clickPos - newTweenToInsert.tweenData.spanWidth;
698 newTweenToInsert.tweenData.tweenedProperties = [];
699 newTweenToInsert.tweenData.tweenedProperties["top"] = this.animatedElement.offsetTop;
700 newTweenToInsert.tweenData.tweenedProperties["left"] = this.animatedElement.offsetLeft;
701 newTweenToInsert.tweenData.tweenedProperties["width"] = this.animatedElement.offsetWidth;
702 newTweenToInsert.tweenData.tweenedProperties["height"] = this.animatedElement.offsetHeight;
703 this.tweens.splice(splitTweenIndex, 0, newTweenToInsert);
704 }
705 }
706
707 this.application.ninja.documentController.activeDocument.needsSave = true;
675 } 708 }
676 }, 709 },
677 710
@@ -746,7 +779,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
746 this.tweens[0].tweenData.tweenedProperties["top"] = this.animatedElement.offsetTop; 779 this.tweens[0].tweenData.tweenedProperties["top"] = this.animatedElement.offsetTop;
747 this.tweens[0].tweenData.tweenedProperties["left"] = this.animatedElement.offsetLeft; 780 this.tweens[0].tweenData.tweenedProperties["left"] = this.animatedElement.offsetLeft;
748 var animationDuration = Math.round(this.trackDuration / 1000) + "s"; 781 var animationDuration = Math.round(this.trackDuration / 1000) + "s";
749 this.animationName = "animation_" + this.animatedElement.classList[0]; 782 this.animationName = this.animatedElement.classList[0] + "_PositionSize";
750 this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-name", this.animationName); 783 this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-name", this.animationName);
751 this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-duration", animationDuration); 784 this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-duration", animationDuration);
752 this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-iteration-count", 1); 785 this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-iteration-count", 1);
@@ -766,8 +799,6 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
766 // delete the current rule 799 // delete the current rule
767 this.ninjaStylesContoller.deleteRule(this.currentKeyframeRule); 800 this.ninjaStylesContoller.deleteRule(this.currentKeyframeRule);
768 801
769 // first combine all style track tween arrays with the main track tween array
770
771 // build the new keyframe string 802 // build the new keyframe string
772 var keyframeString = "@-webkit-keyframes " + this.animationName + " {"; 803 var keyframeString = "@-webkit-keyframes " + this.animationName + " {";
773 804