From a5e3eb0cec55858cf911bffc429ce1de817a60ef Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Wed, 16 May 2012 11:20:13 -0700 Subject: methods for setting simple ease and splitting sub prop spans Signed-off-by: Jonathan Duran --- .../Timeline/PropertyTrack.reel/PropertyTrack.js | 39 ++++++++++++++++++++++ js/panels/Timeline/Tween.reel/Tween.js | 8 +++++ 2 files changed, 47 insertions(+) (limited to 'js/panels') diff --git a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js index a8adbf04..fbc3edd0 100644 --- a/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js +++ b/js/panels/Timeline/PropertyTrack.reel/PropertyTrack.js @@ -269,6 +269,45 @@ var PropertyTrack = exports.PropertyTrack = Montage.create(Component, { } }, + splitPropTween:{ + value:function (ev) { + console.log("splitting sub prop tween with new keyframe"); + var clickPos = ev.target.parentElement.offsetLeft + ev.offsetX; + var i; + var tweensLength = this.propTweens.length - 1; + var prevTween, nextTween, splitTweenIndex; + for (i = 0; i < tweensLength; i++) { + prevTween = this.propTweens[i].tweenData.keyFramePosition; + nextTween = this.propTweens[i + 1].tweenData.keyFramePosition; + if (clickPos > prevTween && clickPos < nextTween) { + //console.log(clickPos + " found on tween: "+ this.tweens[i+1].tweenData.tweenID); + splitTweenIndex = this.propTweens[i + 1].tweenData.tweenID; + this.propTweens[i + 1].tweenData.spanWidth = this.propTweens[i + 1].tweenData.keyFramePosition - clickPos; + this.propTweens[i + 1].tweenData.spanPosition = ev.target.parentElement.offsetLeft + ev.offsetX; + if (ev.target.className != "tween-span") { + // don't set styles on timeline track if event is coming from the track + } else { + ev.target.style.width = this.propTweens[i + 1].tweenData.spanWidth + "px"; + ev.target.parentElement.style.left = clickPos + "px"; + ev.target.parentElement.children[1].style.left = (this.propTweens[i + 1].tweenData.spanWidth - 3) + "px"; + } + var newTweenToInsert = {}; + newTweenToInsert.tweenData = {}; + newTweenToInsert.tweenData.spanWidth = clickPos - prevTween; + newTweenToInsert.tweenData.keyFramePosition = clickPos; + newTweenToInsert.tweenData.keyFrameMillisec = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80) * clickPos; + newTweenToInsert.tweenData.tweenID = splitTweenIndex - 1; + newTweenToInsert.tweenData.spanPosition = clickPos - newTweenToInsert.tweenData.spanWidth; + newTweenToInsert.tweenData.tweenedProperties = []; + newTweenToInsert.tweenData.tweenedProperties[this.trackEditorProperty] = this.ninjaStylesContoller.getElementStyle(this.animatedElement, this.trackEditorProperty); + this.propTweens.splice(splitTweenIndex, 0, newTweenToInsert); + break; + } + } + this.application.ninja.documentController.activeDocument.needsSave = true; + } + }, + retrieveStoredStyleTweens:{ value:function(){ console.log("retrieve style tweens"); diff --git a/js/panels/Timeline/Tween.reel/Tween.js b/js/panels/Timeline/Tween.reel/Tween.js index f857ebd4..b61b0ca9 100644 --- a/js/panels/Timeline/Tween.reel/Tween.js +++ b/js/panels/Timeline/Tween.reel/Tween.js @@ -239,6 +239,14 @@ var Tween = exports.Tween = Montage.create(Component, { } }, + setKeyframeEase:{ + value:function(easeType){ + // easeTypes - ease, ease-out, ease-in, ease-in-out, linear, cubic-bezier(x1, y1, x2, y2) + this.tweenedProperties["-webkit-animation-timing-function"] = easeType; + this.parentComponent.parentComponent.updatePropKeyframeRule(); + } + }, + selectTween:{ value: function(){ // turn on event listener for element change -- cgit v1.2.3