From d555b8e68bb672be620e15171039ab9ec8f1fabd Mon Sep 17 00:00:00 2001 From: Kruti Shah Date: Mon, 26 Mar 2012 11:08:04 -0700 Subject: Timeline : Adding Zoom Slider Signed-off-by: Kruti Shah --- js/panels/Timeline/Tween.reel/Tween.js | 75 ++++++++++++++++++++++++++++++++++ 1 file changed, 75 insertions(+) (limited to 'js/panels/Timeline/Tween.reel/Tween.js') diff --git a/js/panels/Timeline/Tween.reel/Tween.js b/js/panels/Timeline/Tween.reel/Tween.js index 2b308d9a..e8c7e187 100644 --- a/js/panels/Timeline/Tween.reel/Tween.js +++ b/js/panels/Timeline/Tween.reel/Tween.js @@ -44,6 +44,7 @@ var Tween = exports.Tween = Montage.create(Component, { }, set: function(value){ this._spanWidth = value; + this.needsDraw=true; } }, @@ -58,6 +59,7 @@ var Tween = exports.Tween = Montage.create(Component, { }, set:function (value) { this._spanPosition = value; + this.needsDraw=true; } }, @@ -72,6 +74,7 @@ var Tween = exports.Tween = Montage.create(Component, { }, set:function (value) { this._keyFramePosition = value; + this.needsDraw=true; } }, @@ -133,6 +136,12 @@ var Tween = exports.Tween = Montage.create(Component, { } }, + prepareForDraw:{ + value:function(){ + this.eventManager.addEventListener("tlZoomSlider", this, false); + } + }, + draw:{ value:function () { this.element.style.left = this.spanPosition + "px"; @@ -216,6 +225,72 @@ var Tween = exports.Tween = Montage.create(Component, { // deselect the keyframe for this tween this.keyframe.deselectKeyframe(); + } + }, + + handleTlZoomSlider:{ + value:function(event){ + var currentMilliSecPerPixel , currentMilliSec , clickPos,i=0; + + length = this.application.ninja.timeline.tempArray.length; + if(length > 0 && this.application.ninja.timeline.tempArray[length-1]!== this.parentComponent.parentComponent.trackID){ + this.application.ninja.timeline.tempArray.push(this.parentComponent.parentComponent.trackID); + var i = this.application.ninja.timeline.tweenarray.length-1; + for(;this.currentTween = this.application.ninja.timeline.tweenarray[i];i--){ + if(this.application.ninja.timeline.tweenarray[i].tweenID===0){ + this.currentTween.spanWidth=0; + this.currentTween.spanPosition=0; + this.currentTween.keyFramePosition=0; + this.currentTween.keyFrameMillisec=0; + this.needsDraw=true; + }else{ + currentMilliSecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80); + currentMilliSec = this.currentTween.keyFrameMillisec; + clickPos = currentMilliSec / currentMilliSecPerPixel; + this.currentTween.spanWidth = clickPos-this.application.ninja.timeline.tweenarray[i+1].keyFramePosition; + this.currentTween.keyFramePosition = clickPos; + this.currentTween.spanPosition=clickPos-this.currentTween.spanWidth; + this.needsDraw=true; + } + + } + this.application.ninja.timeline.tweenarray.length=0; + this.application.ninja.timeline.tweenarray.push(this); + }else if(length===0){ + this.application.ninja.timeline.tempArray.push(this.parentComponent.parentComponent.trackID); + this.application.ninja.timeline.tweenarray.push(this); + }else{ + this.application.ninja.timeline.tweenarray.push(this); + } + + var levelNumber = this.application.ninja.timeline.getLayerIndexByID(this.parentComponent.parentComponent.trackID); + var k = this.application.ninja.timeline.tweenarray.length-1; + if(this.parentComponent.parentComponent.tweens.length === this.application.ninja.timeline.tweenarray.length && levelNumber===0){ + for(;this.currentTween = this.application.ninja.timeline.tweenarray[k];k--){ + if(this.application.ninja.timeline.tweenarray[k].tweenID===0){ + this.currentTween.spanWidth=0; + this.currentTween.spanPosition=0; + this.currentTween.keyFramePosition=0; + this.currentTween.keyFrameMillisec=0; + this.needsDraw=true; + }else{ + currentMilliSecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80); + currentMilliSec = this.currentTween.keyFrameMillisec; + clickPos = currentMilliSec / currentMilliSecPerPixel; + this.currentTween.spanWidth = clickPos-this.application.ninja.timeline.tweenarray[k+1].keyFramePosition; + this.currentTween.keyFramePosition = clickPos; + this.currentTween.spanPosition=clickPos-this.currentTween.spanWidth; + this.needsDraw=true; + } + + } + this.application.ninja.timeline.tempArray.length=0; + this.application.ninja.timeline.tweenarray.length=0; + } + + + } } + }); -- cgit v1.2.3 From 5a977f2ac151766530c129e26edc39055d11c07f Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Mon, 26 Mar 2012 11:49:48 -0700 Subject: Fix bug with track properties getting over written Signed-off-by: Jonathan Duran --- js/panels/Timeline/Tween.reel/Tween.js | 1 + 1 file changed, 1 insertion(+) (limited to 'js/panels/Timeline/Tween.reel/Tween.js') diff --git a/js/panels/Timeline/Tween.reel/Tween.js b/js/panels/Timeline/Tween.reel/Tween.js index 2b308d9a..77aeb4a7 100644 --- a/js/panels/Timeline/Tween.reel/Tween.js +++ b/js/panels/Timeline/Tween.reel/Tween.js @@ -203,6 +203,7 @@ var Tween = exports.Tween = Montage.create(Component, { // move animated element to correct position on stage var currentTop = this.tweenedProperties["top"] + "px"; var currentLeft = this.tweenedProperties["left"] + "px"; + ElementsMediator.setProperty([this.parentComponent.parentComponent.animatedElement], "top", [currentTop], "Change", "tween"); ElementsMediator.setProperty([this.parentComponent.parentComponent.animatedElement], "left", [currentLeft], "Change", "tween"); -- cgit v1.2.3 From 0013aae80fc22642db6a2753f7dbd5a150f3b3cc Mon Sep 17 00:00:00 2001 From: Kruti Shah Date: Mon, 2 Apr 2012 16:04:58 -0700 Subject: TImeline : Bug Fix 1429 & The zoom tweendata Signed-off-by: Kruti Shah --- js/panels/Timeline/Tween.reel/Tween.js | 120 +++++++++++++++++---------------- 1 file changed, 63 insertions(+), 57 deletions(-) (limited to 'js/panels/Timeline/Tween.reel/Tween.js') diff --git a/js/panels/Timeline/Tween.reel/Tween.js b/js/panels/Timeline/Tween.reel/Tween.js index 28c9a585..bd62a212 100644 --- a/js/panels/Timeline/Tween.reel/Tween.js +++ b/js/panels/Timeline/Tween.reel/Tween.js @@ -230,68 +230,74 @@ var Tween = exports.Tween = Montage.create(Component, { }, handleTlZoomSlider:{ - value:function(event){ - var currentMilliSecPerPixel , currentMilliSec , clickPos,i=0; - - length = this.application.ninja.timeline.tempArray.length; - if(length > 0 && this.application.ninja.timeline.tempArray[length-1]!== this.parentComponent.parentComponent.trackID){ - this.application.ninja.timeline.tempArray.push(this.parentComponent.parentComponent.trackID); - var i = this.application.ninja.timeline.tweenarray.length-1; - for(;this.currentTween = this.application.ninja.timeline.tweenarray[i];i--){ - if(this.application.ninja.timeline.tweenarray[i].tweenID===0){ - this.currentTween.spanWidth=0; - this.currentTween.spanPosition=0; - this.currentTween.keyFramePosition=0; - this.currentTween.keyFrameMillisec=0; - this.needsDraw=true; - }else{ - currentMilliSecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80); - currentMilliSec = this.currentTween.keyFrameMillisec; - clickPos = currentMilliSec / currentMilliSecPerPixel; - this.currentTween.spanWidth = clickPos-this.application.ninja.timeline.tweenarray[i+1].keyFramePosition; - this.currentTween.keyFramePosition = clickPos; - this.currentTween.spanPosition=clickPos-this.currentTween.spanWidth; - this.needsDraw=true; - } + value:function(event){ + var currentMilliSecPerPixel , currentMilliSec , clickPos,thingToPush; + + length = this.application.ninja.timeline.tempArray.length; + if(length > 0 && this.application.ninja.timeline.tempArray[length-1]!== this.parentComponent.parentComponent.trackID){ + this.application.ninja.timeline.tempArray.push(this.parentComponent.parentComponent.trackID); + var i = this.application.ninja.timeline.tweenarray.length-1; + for(var index=0;this.currentTween = this.parentComponent.parentComponent.tweens[index];i--,index++){ + if(this.parentComponent.parentComponent.tweens[index].tweenData.tweenID===0){ + this.currentTween.tweenData.spanWidth=0; + this.currentTween.tweenData.spanPosition=0; + this.currentTween.tweenData.keyFramePosition=0; + this.currentTween.tweenData.keyFrameMillisec=0; + this.setData(); + }else{ + currentMilliSecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80); + currentMilliSec = this.currentTween.tweenData.keyFrameMillisec; + clickPos = currentMilliSec / currentMilliSecPerPixel; + this.currentTween.tweenData.spanWidth = clickPos-this.application.ninja.timeline.tweenarray[i+1].keyFramePosition; + this.currentTween.tweenData.keyFramePosition = clickPos; + this.currentTween.tweenData.spanPosition=clickPos-this.currentTween.tweenData.spanWidth; + this.setData(); + } + } + this.application.ninja.timeline.tweenarray=[]; + thingToPush = {}; + thingToPush.tweenID = this.tweenID; + thingToPush.keyFramePosition = this.keyFramePosition; + this.application.ninja.timeline.tweenarray.push(thingToPush); + }else if(length===0){ + this.application.ninja.timeline.tempArray.push(this.parentComponent.parentComponent.trackID); + thingToPush = {}; + thingToPush.tweenID = this.tweenID; + thingToPush.keyFramePosition = this.keyFramePosition; + this.application.ninja.timeline.tweenarray.push(thingToPush); + }else{ + thingToPush = {}; + thingToPush.tweenID = this.tweenID; + thingToPush.keyFramePosition = this.keyFramePosition; + this.application.ninja.timeline.tweenarray.push(thingToPush); } - this.application.ninja.timeline.tweenarray.length=0; - this.application.ninja.timeline.tweenarray.push(this); - }else if(length===0){ - this.application.ninja.timeline.tempArray.push(this.parentComponent.parentComponent.trackID); - this.application.ninja.timeline.tweenarray.push(this); - }else{ - this.application.ninja.timeline.tweenarray.push(this); - } - var levelNumber = this.application.ninja.timeline.getLayerIndexByID(this.parentComponent.parentComponent.trackID); - var k = this.application.ninja.timeline.tweenarray.length-1; - if(this.parentComponent.parentComponent.tweens.length === this.application.ninja.timeline.tweenarray.length && levelNumber===0){ - for(;this.currentTween = this.application.ninja.timeline.tweenarray[k];k--){ - if(this.application.ninja.timeline.tweenarray[k].tweenID===0){ - this.currentTween.spanWidth=0; - this.currentTween.spanPosition=0; - this.currentTween.keyFramePosition=0; - this.currentTween.keyFrameMillisec=0; - this.needsDraw=true; - }else{ - currentMilliSecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80); - currentMilliSec = this.currentTween.keyFrameMillisec; - clickPos = currentMilliSec / currentMilliSecPerPixel; - this.currentTween.spanWidth = clickPos-this.application.ninja.timeline.tweenarray[k+1].keyFramePosition; - this.currentTween.keyFramePosition = clickPos; - this.currentTween.spanPosition=clickPos-this.currentTween.spanWidth; - this.needsDraw=true; - } + var levelNumber = this.application.ninja.timeline.getLayerIndexByID(this.parentComponent.parentComponent.trackID); + var k = this.application.ninja.timeline.tweenarray.length-1; + if(this.parentComponent.parentComponent.tweens.length === this.application.ninja.timeline.tweenarray.length && levelNumber===0){ + for(var indexValue=0;this.currentTween = this.parentComponent.parentComponent.tweens[indexValue];k--,indexValue++){ + if(this.parentComponent.parentComponent.tweens[indexValue].tweenData.tweenID===0){ + this.currentTween.tweenData.spanWidth=0; + this.currentTween.tweenData.spanPosition=0; + this.currentTween.tweenData.keyFramePosition=0; + this.currentTween.tweenData.keyFrameMillisec=0; + this.setData(); + }else{ + currentMilliSecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80); + currentMilliSec = this.currentTween.tweenData.keyFrameMillisec; + clickPos = currentMilliSec / currentMilliSecPerPixel; + this.currentTween.tweenData.spanWidth = clickPos-this.application.ninja.timeline.tweenarray[k+1].keyFramePosition; + this.currentTween.tweenData.keyFramePosition = clickPos; + this.currentTween.tweenData.spanPosition=clickPos-this.currentTween.tweenData.spanWidth; + this.setData(); + } + } + this.application.ninja.timeline.tempArray=[]; + this.application.ninja.timeline.tweenarray=[]; } - this.application.ninja.timeline.tempArray.length=0; - this.application.ninja.timeline.tweenarray.length=0; } - - - } - } -}); + }); -- cgit v1.2.3 From 1ca98c8c69ea3ef28e8bc050326306424824296d Mon Sep 17 00:00:00 2001 From: Jon Reid Date: Tue, 3 Apr 2012 12:56:19 -0700 Subject: Timeline: Initial implementation of timeline zoom. --- js/panels/Timeline/Tween.reel/Tween.js | 83 ++-------------------------------- 1 file changed, 5 insertions(+), 78 deletions(-) (limited to 'js/panels/Timeline/Tween.reel/Tween.js') diff --git a/js/panels/Timeline/Tween.reel/Tween.js b/js/panels/Timeline/Tween.reel/Tween.js index bd62a212..27828c3c 100644 --- a/js/panels/Timeline/Tween.reel/Tween.js +++ b/js/panels/Timeline/Tween.reel/Tween.js @@ -44,6 +44,7 @@ var Tween = exports.Tween = Montage.create(Component, { }, set: function(value){ this._spanWidth = value; + this.tweenData.spanWidth = value; this.needsDraw=true; } }, @@ -59,6 +60,7 @@ var Tween = exports.Tween = Montage.create(Component, { }, set:function (value) { this._spanPosition = value; + this.tweenData.spanPosition = value; this.needsDraw=true; } }, @@ -74,6 +76,7 @@ var Tween = exports.Tween = Montage.create(Component, { }, set:function (value) { this._keyFramePosition = value; + this.tweenData.keyFramePosition = value; this.needsDraw=true; } }, @@ -136,11 +139,6 @@ var Tween = exports.Tween = Montage.create(Component, { } }, - prepareForDraw:{ - value:function(){ - this.eventManager.addEventListener("tlZoomSlider", this, false); - } - }, draw:{ value:function () { @@ -227,77 +225,6 @@ var Tween = exports.Tween = Montage.create(Component, { // deselect the keyframe for this tween this.keyframe.deselectKeyframe(); } - }, - - handleTlZoomSlider:{ - value:function(event){ - var currentMilliSecPerPixel , currentMilliSec , clickPos,thingToPush; - - length = this.application.ninja.timeline.tempArray.length; - if(length > 0 && this.application.ninja.timeline.tempArray[length-1]!== this.parentComponent.parentComponent.trackID){ - this.application.ninja.timeline.tempArray.push(this.parentComponent.parentComponent.trackID); - var i = this.application.ninja.timeline.tweenarray.length-1; - for(var index=0;this.currentTween = this.parentComponent.parentComponent.tweens[index];i--,index++){ - if(this.parentComponent.parentComponent.tweens[index].tweenData.tweenID===0){ - this.currentTween.tweenData.spanWidth=0; - this.currentTween.tweenData.spanPosition=0; - this.currentTween.tweenData.keyFramePosition=0; - this.currentTween.tweenData.keyFrameMillisec=0; - this.setData(); - }else{ - currentMilliSecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80); - currentMilliSec = this.currentTween.tweenData.keyFrameMillisec; - clickPos = currentMilliSec / currentMilliSecPerPixel; - this.currentTween.tweenData.spanWidth = clickPos-this.application.ninja.timeline.tweenarray[i+1].keyFramePosition; - this.currentTween.tweenData.keyFramePosition = clickPos; - this.currentTween.tweenData.spanPosition=clickPos-this.currentTween.tweenData.spanWidth; - this.setData(); - } - - } - this.application.ninja.timeline.tweenarray=[]; - thingToPush = {}; - thingToPush.tweenID = this.tweenID; - thingToPush.keyFramePosition = this.keyFramePosition; - this.application.ninja.timeline.tweenarray.push(thingToPush); - }else if(length===0){ - this.application.ninja.timeline.tempArray.push(this.parentComponent.parentComponent.trackID); - thingToPush = {}; - thingToPush.tweenID = this.tweenID; - thingToPush.keyFramePosition = this.keyFramePosition; - this.application.ninja.timeline.tweenarray.push(thingToPush); - }else{ - thingToPush = {}; - thingToPush.tweenID = this.tweenID; - thingToPush.keyFramePosition = this.keyFramePosition; - this.application.ninja.timeline.tweenarray.push(thingToPush); - } - - var levelNumber = this.application.ninja.timeline.getLayerIndexByID(this.parentComponent.parentComponent.trackID); - var k = this.application.ninja.timeline.tweenarray.length-1; - if(this.parentComponent.parentComponent.tweens.length === this.application.ninja.timeline.tweenarray.length && levelNumber===0){ - for(var indexValue=0;this.currentTween = this.parentComponent.parentComponent.tweens[indexValue];k--,indexValue++){ - if(this.parentComponent.parentComponent.tweens[indexValue].tweenData.tweenID===0){ - this.currentTween.tweenData.spanWidth=0; - this.currentTween.tweenData.spanPosition=0; - this.currentTween.tweenData.keyFramePosition=0; - this.currentTween.tweenData.keyFrameMillisec=0; - this.setData(); - }else{ - currentMilliSecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80); - currentMilliSec = this.currentTween.tweenData.keyFrameMillisec; - clickPos = currentMilliSec / currentMilliSecPerPixel; - this.currentTween.tweenData.spanWidth = clickPos-this.application.ninja.timeline.tweenarray[k+1].keyFramePosition; - this.currentTween.tweenData.keyFramePosition = clickPos; - this.currentTween.tweenData.spanPosition=clickPos-this.currentTween.tweenData.spanWidth; - this.setData(); - } - - } - this.application.ninja.timeline.tempArray=[]; - this.application.ninja.timeline.tweenarray=[]; - } - } - } + } - }); +}); -- cgit v1.2.3 From 422b14fc60be84c116115f2e71e3499e232f3f05 Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Tue, 10 Apr 2012 10:11:21 -0700 Subject: Abs. vs. Rel. animation postion functions Signed-off-by: Jonathan Duran --- js/panels/Timeline/Tween.reel/Tween.js | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) (limited to 'js/panels/Timeline/Tween.reel/Tween.js') diff --git a/js/panels/Timeline/Tween.reel/Tween.js b/js/panels/Timeline/Tween.reel/Tween.js index 5410c77c..0a67df43 100644 --- a/js/panels/Timeline/Tween.reel/Tween.js +++ b/js/panels/Timeline/Tween.reel/Tween.js @@ -187,6 +187,25 @@ var Tween = exports.Tween = Montage.create(Component, { } }, + setAbsoluteTweenProperties:{ + value:function () { + if (this.parentComponent.parentComponent.animatedElement.offsetTop != this.tweenedProperties["top"] && this.parentComponent.parentComponent.animatedElement.offsetLeft != this.tweenedProperties["left"]) { + this.tweenedProperties["top"] = this.parentComponent.parentComponent.animatedElement.offsetTop; + this.tweenedProperties["left"] = this.parentComponent.parentComponent.animatedElement.offsetLeft; + this.parentComponent.parentComponent.updateKeyframeRule(); + } + // highlight the tween's span + this.tweenspan.highlightSpan(); + this.isTweenAnimated = true; + } + }, + + setRelativeTweenProperties:{ + value:function(){ + + } + }, + selectTween:{ value: function(){ // turn on event listener for element change -- cgit v1.2.3 From 7547b87f99a3a8903955e5b026b0a4ea889fb87a Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Wed, 11 Apr 2012 08:28:07 -0700 Subject: More Absolute vs Relative changes and cleanup Signed-off-by: Jonathan Duran --- js/panels/Timeline/Tween.reel/Tween.js | 24 +++++++++++------------- 1 file changed, 11 insertions(+), 13 deletions(-) (limited to 'js/panels/Timeline/Tween.reel/Tween.js') diff --git a/js/panels/Timeline/Tween.reel/Tween.js b/js/panels/Timeline/Tween.reel/Tween.js index 0a67df43..e4fb42b3 100644 --- a/js/panels/Timeline/Tween.reel/Tween.js +++ b/js/panels/Timeline/Tween.reel/Tween.js @@ -166,29 +166,27 @@ var Tween = exports.Tween = Montage.create(Component, { handleElementChange:{ value:function (event) { - + // temp - testing var + var useAbsolute = true; + if (event.detail.source && event.detail.source !== "tween") { // check for correct element selection - if (this.application.ninja.selectedElements[0]!= this.parentComponent.parentComponent.animatedElement) { + if (this.application.ninja.selectedElements[0] != this.parentComponent.parentComponent.animatedElement) { console.log("Wrong element selected for this keyframe track"); } else { - // update tweenedProperties and tell containing track to update CSS rule - // temp read only top and left. need to change to loop over event details for prop changes generically - if (this.parentComponent.parentComponent.animatedElement.offsetTop != this.tweenedProperties["top"] && this.parentComponent.parentComponent.animatedElement.offsetLeft != this.tweenedProperties["left"]) { - this.tweenedProperties["top"] = this.parentComponent.parentComponent.animatedElement.offsetTop; - this.tweenedProperties["left"] = this.parentComponent.parentComponent.animatedElement.offsetLeft; - this.parentComponent.parentComponent.updateKeyframeRule(); + if(useAbsolute){ + this.setAbsoluteTweenProperties(event.detail); + } else { + this.setRelativeTweenProperties(event.detail); } - // highlight the tween's span - this.tweenspan.highlightSpan(); - this.isTweenAnimated = true; } } } }, setAbsoluteTweenProperties:{ - value:function () { + value:function (eventDetail) { + console.log(eventDetail); if (this.parentComponent.parentComponent.animatedElement.offsetTop != this.tweenedProperties["top"] && this.parentComponent.parentComponent.animatedElement.offsetLeft != this.tweenedProperties["left"]) { this.tweenedProperties["top"] = this.parentComponent.parentComponent.animatedElement.offsetTop; this.tweenedProperties["left"] = this.parentComponent.parentComponent.animatedElement.offsetLeft; @@ -201,7 +199,7 @@ var Tween = exports.Tween = Montage.create(Component, { }, setRelativeTweenProperties:{ - value:function(){ + value:function(eventDetail){ } }, -- cgit v1.2.3 From 9f39474ac006be7decf67437d8ef14c9ee0a1756 Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Wed, 18 Apr 2012 10:20:33 -0700 Subject: FIX for layer selection when adding a keyframe in unselected layer Signed-off-by: Jonathan Duran --- js/panels/Timeline/Tween.reel/Tween.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'js/panels/Timeline/Tween.reel/Tween.js') diff --git a/js/panels/Timeline/Tween.reel/Tween.js b/js/panels/Timeline/Tween.reel/Tween.js index e4fb42b3..5fdf71d6 100644 --- a/js/panels/Timeline/Tween.reel/Tween.js +++ b/js/panels/Timeline/Tween.reel/Tween.js @@ -186,7 +186,7 @@ var Tween = exports.Tween = Montage.create(Component, { setAbsoluteTweenProperties:{ value:function (eventDetail) { - console.log(eventDetail); + //console.log(eventDetail); if (this.parentComponent.parentComponent.animatedElement.offsetTop != this.tweenedProperties["top"] && this.parentComponent.parentComponent.animatedElement.offsetLeft != this.tweenedProperties["left"]) { this.tweenedProperties["top"] = this.parentComponent.parentComponent.animatedElement.offsetTop; this.tweenedProperties["left"] = this.parentComponent.parentComponent.animatedElement.offsetLeft; @@ -200,7 +200,7 @@ var Tween = exports.Tween = Montage.create(Component, { setRelativeTweenProperties:{ value:function(eventDetail){ - + //console.log(eventDetail); } }, -- cgit v1.2.3 From 276f0424550e74461edf8d19172a52d2e8eb49c7 Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Thu, 19 Apr 2012 09:42:23 -0700 Subject: Remove unneeded require Signed-off-by: Jonathan Duran --- js/panels/Timeline/Tween.reel/Tween.js | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) (limited to 'js/panels/Timeline/Tween.reel/Tween.js') diff --git a/js/panels/Timeline/Tween.reel/Tween.js b/js/panels/Timeline/Tween.reel/Tween.js index 5fdf71d6..7dcd397c 100644 --- a/js/panels/Timeline/Tween.reel/Tween.js +++ b/js/panels/Timeline/Tween.reel/Tween.js @@ -6,7 +6,6 @@ var Montage = require("montage/core/core").Montage; var Component = require("montage/ui/component").Component; -var ElementsMediator = require("js/mediators/element-mediator").ElementMediator; var Tween = exports.Tween = Montage.create(Component, { @@ -228,8 +227,8 @@ var Tween = exports.Tween = Montage.create(Component, { var currentTop = this.tweenedProperties["top"] + "px"; var currentLeft = this.tweenedProperties["left"] + "px"; - ElementsMediator.setProperty([this.parentComponent.parentComponent.animatedElement], "top", [currentTop], "Change", "tween"); - ElementsMediator.setProperty([this.parentComponent.parentComponent.animatedElement], "left", [currentLeft], "Change", "tween"); + this.application.ninja.elementMediator.setProperty([this.parentComponent.parentComponent.animatedElement], "top", [currentTop], "Change", "tween"); + this.application.ninja.elementMediator.setProperty([this.parentComponent.parentComponent.animatedElement], "left", [currentLeft], "Change", "tween"); } }, -- cgit v1.2.3 From 47488a6ff1b7fc32e2485b3dd82afe207b936b35 Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Tue, 24 Apr 2012 08:46:22 -0700 Subject: Turn on width and height as tweenable properties Signed-off-by: Jonathan Duran --- js/panels/Timeline/Tween.reel/Tween.js | 29 +++++++++++++++++++++++++++-- 1 file changed, 27 insertions(+), 2 deletions(-) (limited to 'js/panels/Timeline/Tween.reel/Tween.js') diff --git a/js/panels/Timeline/Tween.reel/Tween.js b/js/panels/Timeline/Tween.reel/Tween.js index 7dcd397c..b13a037f 100644 --- a/js/panels/Timeline/Tween.reel/Tween.js +++ b/js/panels/Timeline/Tween.reel/Tween.js @@ -186,11 +186,36 @@ var Tween = exports.Tween = Montage.create(Component, { setAbsoluteTweenProperties:{ value:function (eventDetail) { //console.log(eventDetail); - if (this.parentComponent.parentComponent.animatedElement.offsetTop != this.tweenedProperties["top"] && this.parentComponent.parentComponent.animatedElement.offsetLeft != this.tweenedProperties["left"]) { + + // top + if(this.parentComponent.parentComponent.animatedElement.offsetTop != this.tweenedProperties["top"]){ this.tweenedProperties["top"] = this.parentComponent.parentComponent.animatedElement.offsetTop; + } + + // left + if(this.parentComponent.parentComponent.animatedElement.offsetLeft != this.tweenedProperties["left"]){ this.tweenedProperties["left"] = this.parentComponent.parentComponent.animatedElement.offsetLeft; - this.parentComponent.parentComponent.updateKeyframeRule(); } + + // width + if (this.parentComponent.parentComponent.animatedElement.offsetWidth != this.tweenedProperties["width"]){ + this.tweenedProperties["width"] = this.parentComponent.parentComponent.animatedElement.offsetWidth; + } + + // height + if (this.parentComponent.parentComponent.animatedElement.offsetHeight != this.tweenedProperties["height"]){ + this.tweenedProperties["height"] = this.parentComponent.parentComponent.animatedElement.offsetHeight; + } + + // skewX + + // skewY + + // rotation + + // tell track to update css rule + this.parentComponent.parentComponent.updateKeyframeRule(); + // highlight the tween's span this.tweenspan.highlightSpan(); this.isTweenAnimated = true; -- cgit v1.2.3