none
ease
ease-out
ease-out
ease-in
ease-in-out
linear

prevTween && position < nextTween) { + + // We will insert a new tween at this index + splitTweenIndex = i+1; + + // Update the next tween to have new span position and width. + this.tweens[i+1].tweenData.spanPosition = position; + this.tweens[i+1].spanPosition = position; + this.tweens[i+1].tweenData.spanWidth = this.tweens[i+1].tweenData.keyFramePosition - position; + this.tweens[i+1].spanWidth = this.tweens[i+1].keyFramePosition - position; + + // You'd think that would be enough to make the component associated with that part of the array redraw, wouldn't you? + // Turns out we have to manually poke the desired childComponent in the repetition to register its new changes. + // So we have to get the index of the actual componentin the repetition, which may not match our iteration index. + for (j = 0; j < tweensLength +1; j++) { + if (this.tweenRepetition.childComponents[j].keyFramePosition === nextTween) { + nextComponentIndex = j; + } + } + this.tweenRepetition.childComponents[nextComponentIndex].setData(); + + // Create the new tween and splice it into the model + var newTweenToInsert = {}; + newTweenToInsert.tweenData = {}; + newTweenToInsert.tweenData.spanWidth = position - prevTween; + newTweenToInsert.tweenData.keyFramePosition = position; + newTweenToInsert.tweenData.keyFrameMillisec = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80) * position; + newTweenToInsert.tweenData.tweenID = this.tweens.length; + newTweenToInsert.tweenData.spanPosition = position - newTweenToInsert.tweenData.spanWidth; + newTweenToInsert.tweenData.tweenedProperties = []; + newTweenToInsert.tweenData.tweenedProperties["top"] = this.animatedElement.offsetTop + "px"; + newTweenToInsert.tweenData.tweenedProperties["left"] = this.animatedElement.offsetLeft + "px"; + newTweenToInsert.tweenData.tweenedProperties["width"] = this.animatedElement.offsetWidth + "px"; + newTweenToInsert.tweenData.tweenedProperties["height"] = this.animatedElement.offsetHeight + "px"; + this.tweens.splice(splitTweenIndex, 0, newTweenToInsert); + + // We are done, so end the loop. + i = tweensLength; + } + } + + // We've made a change, so set the needsSave flag + this.application.ninja.currentDocument.model.needsSave = true; + + // Our tween IDs are now all messed up. Fix them. + for (i = 0; i <= tweensLength+1; i++) { + this.tweens[i].tweenID = i; + this.tweens[i].tweenData.tweenID = i; + } + } + }, + retrieveStoredTweens:{ value:function () { var percentValue, fraction, splitValue,offsetAttribute,topOffSetAttribute,leftOffsetAttribute,widthOffsetAttribute,heightOffsetAttribute; @@ -885,6 +971,9 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { newTween.tweenData.tweenID = this.nextKeyframe; newTween.tweenData.spanPosition =clickPosition - newTween.tweenData.spanWidth; newTween.tweenData.easing = this.currentKeyframeRule[i].style.webkitAnimationName; + if (newTween.tweenData.easing == "") { + newTween.tweenData.easing = "none"; + } 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 51a9e215..dcc139a5 100644 --- a/js/panels/Timeline/Tween.reel/Tween.js +++ b/js/panels/Timeline/Tween.reel/Tween.js @@ -110,6 +110,7 @@ var Tween = exports.Tween = Montage.create(Component, { }, set:function (value) { this._tweenID = value; + this.tweenData.tweenID = value; } }, @@ -156,7 +157,7 @@ var Tween = exports.Tween = Montage.create(Component, { }, _easing: { - value: "ease-in" + value: "none" }, easing: { serializable: true, @@ -171,9 +172,11 @@ var Tween = exports.Tween = Montage.create(Component, { draw:{ value:function () { + this.tweenspan.element.style.width = this.spanWidth + "px"; + this.keyframe.element.style.left = (this.spanWidth -5) + "px"; + this.tweenspan.spanWidth = this.spanWidth; this.element.style.left = this.spanPosition + "px"; this.keyframe.position = this.spanWidth; - this.tweenspan.spanWidth = this.spanWidth; this.tweenspan.easing = this.easing; if(this.isTweenAnimated){ this.tweenspan.highlightSpan(); -- cgit v1.2.3