From f6f722feecf88c8afe59327eaf8557ce4012abc7 Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Thu, 10 May 2012 22:40:02 -0700 Subject: Fixing the dirty document flag. Disabling the stylesheets dirty flag because === true on document open. Signed-off-by: Valerio Virgillito --- js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'js/panels/Timeline/TimelineTrack.reel') diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index efeeba00..2c15a99c 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -568,7 +568,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { this.nextKeyframe += 1; } - this.application.ninja.documentController.activeDocument.needsSave = true; + this.application.ninja.documentController.activeDocument.model.needsSave = true; } }, @@ -687,7 +687,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { keyframeString += " }"; // set the keyframe string as the new rule this.currentKeyframeRule = this.ninjaStylesContoller.addRule(keyframeString); - this.application.ninja.documentController.activeDocument.needsSave = true; + this.application.ninja.documentController.activeDocument.model.needsSave = true; } }, -- cgit v1.2.3 From a696dffcc84b4d2719f8fa918676f9575858ca9a Mon Sep 17 00:00:00 2001 From: Jon Reid Date: Thu, 17 May 2012 16:52:16 -0700 Subject: Timeline: Multiselect improvements. New convenience methods. Multiselect drag and drop. --- js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) (limited to 'js/panels/Timeline/TimelineTrack.reel') diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index a38ecb30..d6f34383 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -468,8 +468,8 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { this.ninjaStylesContoller = this.application.ninja.stylesController; var selectedIndex = this.application.ninja.timeline.getLayerIndexByID(this.trackID); if (selectedIndex !== false) { - if(this.application.ninja.timeline.arrLayers[selectedIndex].layerData.elementsList[0]){ - this.animatedElement = this.application.ninja.timeline.arrLayers[selectedIndex].layerData.elementsList[0]; + if(this.application.ninja.timeline.arrLayers[selectedIndex].layerData.stageElement){ + this.animatedElement = this.application.ninja.timeline.arrLayers[selectedIndex].layerData.stageElement; } } @@ -597,7 +597,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { // This needs to move to a keyboard shortcut that is TBD var selectedIndex = this.application.ninja.timeline.getLayerIndexByID(this.trackID); if (ev.shiftKey) { - if (this.application.ninja.timeline.arrLayers[selectedIndex].layerData.elementsList.length == 1) { + //if (this.application.ninja.timeline.arrLayers[selectedIndex].layerData.elementsList.length == 1) { if (this.tweens.length < 1) { this.insertTween(0); this.addAnimationRuleToElement(ev); @@ -612,10 +612,10 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { this.updateKeyframeRule(); } } - } else { + //} else { // TEMP error check - console.log("There must be exactly one element in an animated layer."); - } + //console.log("There must be exactly one element in an animated layer."); + //} } } }, @@ -644,7 +644,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { newTween.tweenData = {}; if (clickPos == 0) { - this.animatedElement = this.application.ninja.timeline.currentLayerSelected.layerData.elementsList[0]; + this.animatedElement = this.application.ninja.timeline.currentLayerSelected.layerData.stageElement; newTween.tweenData.spanWidth = 0; newTween.tweenData.keyFramePosition = 0; newTween.tweenData.keyFrameMillisec = 0; @@ -727,7 +727,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { var selectedIndex = this.application.ninja.timeline.getLayerIndexByID(this.trackID); this.application.ninja.timeline.arrLayers[selectedIndex].layerData.created=true; - this.animatedElement = this.application.ninja.timeline.arrLayers[selectedIndex].layerData.elementsList[0]; + this.animatedElement = this.application.ninja.timeline.arrLayers[selectedIndex].layerData.stageElement; if(this.animatedElement!==undefined){ this.animationName = this.application.ninja.stylesController.getElementStyle(this.animatedElement, "-webkit-animation-name"); this.animationNamesString = this.animationName; -- cgit v1.2.3 From d3e2e8c0e4be6a324eac3a3ea050b4c41183f79b Mon Sep 17 00:00:00 2001 From: Jon Reid Date: Thu, 17 May 2012 17:16:11 -0700 Subject: Timeline: Bug fixes for multiselect --- js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'js/panels/Timeline/TimelineTrack.reel') diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index 0e430000..e4e90d51 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -644,7 +644,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { newTween.tweenData = {}; if (clickPos == 0) { - this.animatedElement = this.application.ninja.timeline.currentLayerSelected.layerData.stageElement; + this.animatedElement = this.application.ninja.timeline.arrLayers[this.application.ninja.timeline.currentLayersSelected[0]].layerData.stageElement; newTween.tweenData.spanWidth = 0; newTween.tweenData.keyFramePosition = 0; newTween.tweenData.keyFrameMillisec = 0; -- cgit v1.2.3 From d3f67c2e306cb1888099f4decba00a9d8727cc43 Mon Sep 17 00:00:00 2001 From: Jon Reid Date: Tue, 22 May 2012 18:23:36 -0700 Subject: Timeline: New easing selector in spans. --- js/panels/Timeline/TimelineTrack.reel/css/TimelineTrack.css | 2 +- js/panels/Timeline/TimelineTrack.reel/scss/TimelineTrack.scss | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) (limited to 'js/panels/Timeline/TimelineTrack.reel') diff --git a/js/panels/Timeline/TimelineTrack.reel/css/TimelineTrack.css b/js/panels/Timeline/TimelineTrack.reel/css/TimelineTrack.css index 03d1cf8d..9ea5ce01 100644 --- a/js/panels/Timeline/TimelineTrack.reel/css/TimelineTrack.css +++ b/js/panels/Timeline/TimelineTrack.reel/css/TimelineTrack.css @@ -17,7 +17,7 @@ border-bottom-style: solid; border-bottom-width: thin; background-image: url("../images/gridline.jpg"); - overflow: hidden; + overflow: visible; } /* line 34, ../scss/TimelineTrack.scss */ diff --git a/js/panels/Timeline/TimelineTrack.reel/scss/TimelineTrack.scss b/js/panels/Timeline/TimelineTrack.reel/scss/TimelineTrack.scss index 1b025c74..bad754a6 100644 --- a/js/panels/Timeline/TimelineTrack.reel/scss/TimelineTrack.scss +++ b/js/panels/Timeline/TimelineTrack.reel/scss/TimelineTrack.scss @@ -28,7 +28,7 @@ border-bottom-style: solid; border-bottom-width: thin; background-image: url("../images/gridline.jpg"); - overflow: hidden; + overflow: visible; } .keyframe{ -- cgit v1.2.3 From f92838b6ec33e2eb0f8eb06f3cbc7419f38143a1 Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Wed, 23 May 2012 11:43:43 -0700 Subject: Diamond keyframes Signed-off-by: Jonathan Duran --- .../Timeline/TimelineTrack.reel/TimelineTrack.js | 35 ++++++++++++++++++---- 1 file changed, 29 insertions(+), 6 deletions(-) (limited to 'js/panels/Timeline/TimelineTrack.reel') diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index 2fe60d72..faa3ba77 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -321,6 +321,19 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { } }, + _ruleList:{ + value:[] + }, + + ruleList:{ + get:function () { + return this._ruleList; + }, + set:function (val) { + this._ruleList = val; + } + }, + animationNamesString:{ value:"" }, @@ -735,7 +748,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { var animationNameList = this.animationName.split(","); if(animationNameList.length > 1){ this.animationName = animationNameList[0]; - this.extractKeyframesFromRules(animationNameList); + this.getAllAnimationRules(animationNameList); } this.animationNamesString = this.animationName; @@ -806,14 +819,24 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { } }, - extractKeyframesFromRules:{ + getAllAnimationRules:{ value:function(ruleNames){ //console.log(ruleNames); + for(var i in ruleNames){ - console.log(ruleNames[i].replace(/^\s+|\s+$/g,"")); - var currName = ruleNames[i].replace(/^\s+|\s+$/g,""); - var test = this.application.ninja.stylesController.getAnimationRuleWithName(currName, this.application.ninja.currentDocument._document); - console.log(test); + var currentName = ruleNames[i].replace(/^\s+|\s+$/g,""); // trim whitespace + var currentRule = this.application.ninja.stylesController.getAnimationRuleWithName(currentName, this.application.ninja.currentDocument._document); + this.ruleList[currentName] = currentRule; + } + this.recreatePropertyTracks(this.ruleList); + } + }, + + recreatePropertyTracks:{ + value:function(ruleSet){ + for(var i in ruleSet){ + //console.log(i); + //console.log(ruleSet[i]); } } }, -- cgit v1.2.3 From f1dbf7c58e91a27c80f3a607e87ad122d803c500 Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Wed, 23 May 2012 13:29:13 -0700 Subject: Timeline triggerBinding needs to be set to false in the track data. Signed-off-by: Nivesh Rajbhandari --- js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) (limited to 'js/panels/Timeline/TimelineTrack.reel') diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index 2c15a99c..3d83dc36 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -405,11 +405,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { triggerOutgoingBinding : { value: function() { - if (this.trackData.triggerBinding === true) { - this.trackData.triggerBinding = false; - } else { - this.trackData.triggerBinding = true; - } + this.trackData.triggerBinding = !this.trackData.triggerBinding; } }, -- cgit v1.2.3 From a8dff9f5cb9dec84e6805118d49903710b361275 Mon Sep 17 00:00:00 2001 From: Jon Reid Date: Wed, 23 May 2012 15:44:41 -0700 Subject: Timeline: Easing selection per keyframe. --- js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) (limited to 'js/panels/Timeline/TimelineTrack.reel') diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index faa3ba77..b195dbd6 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -994,9 +994,10 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { this._dragAndDropHelper = event.target.cloneNode(true); this._dragAndDropHelper.style.opacity = 0.8; this._dragAndDropHelper.style.position = "absolute"; - this._dragAndDropHelper.style.top = "2px"; + this._dragAndDropHelper.style.top = "5px"; this._dragAndDropHelper.style.left = "0px"; this._dragAndDropHelper.style.zIndex = 700; + this._dragAndDropHelper.classList.add("keyframeSelected"); //this._dragAndDropHelper.style.width = window.getComputedStyle(this.container_layers, null).getPropertyValue("width"); this._dragAndDropHelper.classList.add("track-dnd-helper"); -- cgit v1.2.3 From 5914c5b2209c4b8daac4249bb76cda5c9314c4e6 Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Thu, 24 May 2012 00:07:23 -0700 Subject: Cleaning up referencing to 'documentRoot' and '_document' Moved to reference new model in DOM architecture rework. This should not affect anything, just moving the references, and also the setting to the render methods in the design view. --- js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'js/panels/Timeline/TimelineTrack.reel') diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index 2c15a99c..adc50c58 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -438,7 +438,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { didDraw:{ value:function () { if ((!this.application.ninja.documentController.creatingNewFile)||(!this.application.ninja.currentDocument.setLevel)) { - if (this.application.ninja.currentDocument.documentRoot.children[0]) { + if (this.application.ninja.currentDocument.model.documentRoot.children[0]) { var selectedIndex = this.application.ninja.timeline.getLayerIndexByID(this.trackID); if (selectedIndex !== false) { if (!this.application.ninja.timeline.arrLayers[selectedIndex].layerData.created) { @@ -592,7 +592,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { trackTiming = this.application.ninja.stylesController.getElementStyle(this.animatedElement, "-webkit-animation-duration"); this.nextKeyframe = 0; - this.currentKeyframeRule = this.application.ninja.stylesController.getAnimationRuleWithName(this.animationName, this.application.ninja.currentDocument._document); + this.currentKeyframeRule = this.application.ninja.stylesController.getAnimationRuleWithName(this.animationName, this.application.ninja.currentDocument.model.views.design.document); for (i =0; this.currentKeyframeRule[i] ;i++) { var newTween = {}; -- cgit v1.2.3 From 2e4831cf0fe04f37a179f84b098ae0899d4e40b8 Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Thu, 24 May 2012 09:34:05 -0700 Subject: recreating layer props Signed-off-by: Jonathan Duran --- .../Timeline/TimelineTrack.reel/TimelineTrack.js | 29 +++++++++++++++++++--- 1 file changed, 25 insertions(+), 4 deletions(-) (limited to 'js/panels/Timeline/TimelineTrack.reel') diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index faa3ba77..47e04d71 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -834,9 +834,17 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { recreatePropertyTracks:{ value:function(ruleSet){ + + //var selectIndex = this.application.ninja.timeline.getLayerIndexByID(this.trackID); + //var test = this.application.ninja.timeline.layerRepetition.childComponents[0].addStyle(); + //console.log(test); + for(var i in ruleSet){ - //console.log(i); + console.log(i); //console.log(ruleSet[i]); + var styleProp = ruleSet[i][0].style[0]; + console.log(styleProp); + this.application.ninja.timeline.layerRepetition.childComponents[0].addStyle(styleProp); } } }, @@ -958,9 +966,22 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { this.arrStyleTracks.push(newStyleTrack); - } else if (layerEvent.layerEventType === "deleteStyle") { - // TODO: Delete the right track. Index can be passed in event object, use that for splice(). - this.arrStyleTracks.pop(); + } else if (layerEvent.layerEventType === "restoreStyle") { + var restoredStyleTrack = {}; + restoredStyleTrack.propTrackData = {}; + restoredStyleTrack.propTrackData.styleSelection = layerEvent.styleSelection; + restoredStyleTrack.propTrackData.propTweens = []; + restoredStyleTrack.propTrackData.trackType = "style"; + restoredStyleTrack.propTrackData.trackEditorProperty = layerEvent.trackEditorProperty; + restoredStyleTrack.propTrackData.styleIndex = layerEvent.styleIndex; + + this.arrStyleTracks.push(restoredStyleTrack); + + this.isStyleCollapsed = true; + } + else if (layerEvent.layerEventType === "deleteStyle") { + // TODO: Delete the right track. Index can be passed in event object, use that for splice(). + this.arrStyleTracks.pop(); } } }, -- cgit v1.2.3 From 003d08198368d93078049ee879aaac4275ac4817 Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Thu, 24 May 2012 10:49:09 -0700 Subject: collapse fix for restored style layers Signed-off-by: Jonathan Duran --- .../Timeline/TimelineTrack.reel/TimelineTrack.js | 51 +++++++++++----------- 1 file changed, 26 insertions(+), 25 deletions(-) (limited to 'js/panels/Timeline/TimelineTrack.reel') diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index a5722335..9c8b5206 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -664,10 +664,10 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { newTween.tweenData.tweenID = 0; newTween.tweenData.spanPosition = 0; newTween.tweenData.tweenedProperties = []; - newTween.tweenData.tweenedProperties["top"] = this.animatedElement.offsetTop; - newTween.tweenData.tweenedProperties["left"] = this.animatedElement.offsetLeft; - newTween.tweenData.tweenedProperties["width"] = this.animatedElement.offsetWidth; - newTween.tweenData.tweenedProperties["height"] = this.animatedElement.offsetHeight; + newTween.tweenData.tweenedProperties["top"] = this.animatedElement.offsetTop + "px"; + newTween.tweenData.tweenedProperties["left"] = this.animatedElement.offsetLeft + "px"; + newTween.tweenData.tweenedProperties["width"] = this.animatedElement.offsetWidth + "px"; + newTween.tweenData.tweenedProperties["height"] = this.animatedElement.offsetHeight + "px"; this.tweens.push(newTween); } else { newTween.tweenData.spanWidth = clickPos - this.tweens[this.tweens.length - 1].tweenData.keyFramePosition; @@ -676,10 +676,10 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { newTween.tweenData.tweenID = this.nextKeyframe; newTween.tweenData.spanPosition = clickPos - newTween.tweenData.spanWidth; newTween.tweenData.tweenedProperties = []; - newTween.tweenData.tweenedProperties["top"] = this.animatedElement.offsetTop; - newTween.tweenData.tweenedProperties["left"] = this.animatedElement.offsetLeft; - newTween.tweenData.tweenedProperties["width"] = this.animatedElement.offsetWidth; - newTween.tweenData.tweenedProperties["height"] = this.animatedElement.offsetHeight; + newTween.tweenData.tweenedProperties["top"] = this.animatedElement.offsetTop + "px"; + newTween.tweenData.tweenedProperties["left"] = this.animatedElement.offsetLeft + "px"; + newTween.tweenData.tweenedProperties["width"] = this.animatedElement.offsetWidth + "px"; + newTween.tweenData.tweenedProperties["height"] = this.animatedElement.offsetHeight + "px"; this.tweens.push(newTween); // update the animation duration @@ -721,10 +721,10 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { newTweenToInsert.tweenData.tweenID = splitTweenIndex - 1; newTweenToInsert.tweenData.spanPosition = clickPos - newTweenToInsert.tweenData.spanWidth; newTweenToInsert.tweenData.tweenedProperties = []; - newTweenToInsert.tweenData.tweenedProperties["top"] = this.animatedElement.offsetTop; - newTweenToInsert.tweenData.tweenedProperties["left"] = this.animatedElement.offsetLeft; - newTweenToInsert.tweenData.tweenedProperties["width"] = this.animatedElement.offsetWidth; - newTweenToInsert.tweenData.tweenedProperties["height"] = this.animatedElement.offsetHeight; + 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); break; } @@ -783,10 +783,10 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { newTween.tweenData.tweenID = 0; newTween.tweenData.spanPosition = 0; newTween.tweenData.tweenedProperties = []; - newTween.tweenData.tweenedProperties["top"] = tempTopOffset; - newTween.tweenData.tweenedProperties["left"] = tempLeftOffset; - newTween.tweenData.tweenedProperties["width"] = tempWidthOffset; - newTween.tweenData.tweenedProperties["height"] = tempHeightOffset; + newTween.tweenData.tweenedProperties["top"] = tempTopOffset + "px"; + newTween.tweenData.tweenedProperties["left"] = tempLeftOffset + "px"; + newTween.tweenData.tweenedProperties["width"] = tempWidthOffset + "px"; + newTween.tweenData.tweenedProperties["height"] = tempHeightOffset + "px"; this.tweens.push(newTween); } else { @@ -805,10 +805,10 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { newTween.tweenData.tweenID = this.nextKeyframe; newTween.tweenData.spanPosition =clickPosition - newTween.tweenData.spanWidth; newTween.tweenData.tweenedProperties=[]; - newTween.tweenData.tweenedProperties["top"] = tempTopOffset; - newTween.tweenData.tweenedProperties["left"] = tempLeftOffset; - newTween.tweenData.tweenedProperties["width"] = tempWidthOffset; - newTween.tweenData.tweenedProperties["height"] = tempHeightOffset; + newTween.tweenData.tweenedProperties["top"] = tempTopOffset + "px"; + newTween.tweenData.tweenedProperties["left"] = tempLeftOffset + "px"; + newTween.tweenData.tweenedProperties["width"] = tempWidthOffset + "px"; + newTween.tweenData.tweenedProperties["height"] = tempHeightOffset + "px"; this.tweens.push(newTween); } this.nextKeyframe += 1; @@ -851,16 +851,14 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { addAnimationRuleToElement:{ value:function (tweenEvent) { - this.tweens[0].tweenData.tweenedProperties["top"] = this.animatedElement.offsetTop; - this.tweens[0].tweenData.tweenedProperties["left"] = this.animatedElement.offsetLeft; + this.tweens[0].tweenData.tweenedProperties["top"] = this.animatedElement.offsetTop + "px"; + this.tweens[0].tweenData.tweenedProperties["left"] = this.animatedElement.offsetLeft + "px"; var animationDuration = Math.round(this.trackDuration / 1000) + "s"; this.animationName = this.animatedElement.classList[0] + "_PositionSize"; this.animationNamesString = this.animationName; this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-name", this.animationName); this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-duration", animationDuration); this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-iteration-count", 1); - this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-fill-mode", "both"); - this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-transition-timing-function", "linear"); 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;} }"; this.currentKeyframeRule = this.ninjaStylesContoller.addRule(initRule); @@ -885,12 +883,14 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { var keyframePercent = Math.round((keyMill / trackDur) * 100) + "%"; var keyframePropertyString = " " + keyframePercent + " {"; for(var prop in this.tweens[i].tweenData.tweenedProperties){ - keyframePropertyString += prop + ": " + this.tweens[i].tweenData.tweenedProperties[prop] + "px;"; + console.log(prop + " - " + this.tweens[i].tweenData.tweenedProperties[prop]); + keyframePropertyString += prop + ": " + this.tweens[i].tweenData.tweenedProperties[prop] + ";"; } keyframePropertyString += "}"; keyframeString += keyframePropertyString; } keyframeString += " }"; + console.log(keyframeString); // set the keyframe string as the new rule this.currentKeyframeRule = this.ninjaStylesContoller.addRule(keyframeString); this.application.ninja.documentController.activeDocument.needsSave = true; @@ -978,6 +978,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { this.arrStyleTracks.push(restoredStyleTrack); this.isStyleCollapsed = true; + this.triggerOutgoingBinding(); } else if (layerEvent.layerEventType === "deleteStyle") { // TODO: Delete the right track. Index can be passed in event object, use that for splice(). -- cgit v1.2.3 From b0a736deb4f3bb515e0ca4009fe4f98e22cec2c0 Mon Sep 17 00:00:00 2001 From: Jon Reid Date: Fri, 25 May 2012 10:15:48 -0700 Subject: Timeline: Better fix for keeping styles/tracks in synch when adding styles on document open. --- js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | 3 --- 1 file changed, 3 deletions(-) (limited to 'js/panels/Timeline/TimelineTrack.reel') diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index 9c8b5206..8fd62187 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -976,9 +976,6 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { restoredStyleTrack.propTrackData.styleIndex = layerEvent.styleIndex; this.arrStyleTracks.push(restoredStyleTrack); - - this.isStyleCollapsed = true; - this.triggerOutgoingBinding(); } else if (layerEvent.layerEventType === "deleteStyle") { // TODO: Delete the right track. Index can be passed in event object, use that for splice(). -- cgit v1.2.3 From 4a4bee3c7f1132d069926a5a8a67817a9df7a7e8 Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Fri, 25 May 2012 11:02:26 -0700 Subject: update retrieveStoredTweens method change the method to retrieve the keyframe styles for each keyframe generically instead of hard coding for top, left, width and height Signed-off-by: Jonathan Duran --- .../Timeline/TimelineTrack.reel/TimelineTrack.js | 40 ++++++++++------------ 1 file changed, 19 insertions(+), 21 deletions(-) (limited to 'js/panels/Timeline/TimelineTrack.reel') diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index 9c8b5206..8d9fd964 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -764,17 +764,25 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { var newTween = {}; newTween.tweenData = {}; - offsetAttribute = this.currentKeyframeRule[i].cssText.split(" "); - - topOffSetAttribute = offsetAttribute[3].split("px"); - leftOffsetAttribute = offsetAttribute[5].split("px"); - widthOffsetAttribute = offsetAttribute[7].split("px"); - heightOffsetAttribute = offsetAttribute[9].split("px"); - - var tempTopOffset = parseInt(topOffSetAttribute[0]); - var tempLeftOffset = parseInt(leftOffsetAttribute[0]); - var tempWidthOffset = parseInt(widthOffsetAttribute[0]); - var tempHeightOffset = parseInt(heightOffsetAttribute[0]); + var j, styleLength = this.currentKeyframeRule[i].style.length, keyframeStyles = []; + + for(j=0; j --- js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | 12 ++---------- 1 file changed, 2 insertions(+), 10 deletions(-) (limited to 'js/panels/Timeline/TimelineTrack.reel') diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index 8d9fd964..5839e0ac 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -819,7 +819,6 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { getAllAnimationRules:{ value:function(ruleNames){ - //console.log(ruleNames); for(var i in ruleNames){ var currentName = ruleNames[i].replace(/^\s+|\s+$/g,""); // trim whitespace @@ -833,17 +832,11 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { recreatePropertyTracks:{ value:function(ruleSet){ - //var selectIndex = this.application.ninja.timeline.getLayerIndexByID(this.trackID); - //var test = this.application.ninja.timeline.layerRepetition.childComponents[0].addStyle(); - //console.log(test); - for(var i in ruleSet){ - console.log(i); - //console.log(ruleSet[i]); var styleProp = ruleSet[i][0].style[0]; - console.log(styleProp); this.application.ninja.timeline.layerRepetition.childComponents[0].addStyle(styleProp); } + } }, @@ -881,14 +874,13 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { var keyframePercent = Math.round((keyMill / trackDur) * 100) + "%"; var keyframePropertyString = " " + keyframePercent + " {"; for(var prop in this.tweens[i].tweenData.tweenedProperties){ - console.log(prop + " - " + this.tweens[i].tweenData.tweenedProperties[prop]); + //console.log(prop + " - " + this.tweens[i].tweenData.tweenedProperties[prop]); keyframePropertyString += prop + ": " + this.tweens[i].tweenData.tweenedProperties[prop] + ";"; } keyframePropertyString += "}"; keyframeString += keyframePropertyString; } keyframeString += " }"; - console.log(keyframeString); // set the keyframe string as the new rule this.currentKeyframeRule = this.ninjaStylesContoller.addRule(keyframeString); this.application.ninja.documentController.activeDocument.needsSave = true; -- cgit v1.2.3 From 6808427d3c0defa9f00884711b316f4e76ac54fc Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Fri, 25 May 2012 14:08:44 -0700 Subject: animation name string fix Signed-off-by: Jonathan Duran --- js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) (limited to 'js/panels/Timeline/TimelineTrack.reel') diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index 5839e0ac..f90e10c2 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -747,12 +747,13 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { // check for multiple animation names var animationNameList = this.animationName.split(","); if(animationNameList.length > 1){ + this.animationNamesString = this.animationName; this.animationName = animationNameList[0]; this.getAllAnimationRules(animationNameList); + } else { + this.animationNamesString = this.animationName; } - this.animationNamesString = this.animationName; - // build tweens for this tracks's keyframe rule if(this.animationName){ trackTiming = this.application.ninja.stylesController.getElementStyle(this.animatedElement, "-webkit-animation-duration"); -- cgit v1.2.3 From 517661250fb478f460df3f57f4654bf85723ea2a Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Tue, 29 May 2012 11:32:04 -0700 Subject: fix to set default prop for tween Signed-off-by: Jonathan Duran --- js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | 4 ++++ 1 file changed, 4 insertions(+) (limited to 'js/panels/Timeline/TimelineTrack.reel') diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index 835fc785..075290c7 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -820,12 +820,14 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { getAllAnimationRules:{ value:function(ruleNames){ + ruleNames.splice(0,1); // temp remove first animation already retrieved for main track for(var i in ruleNames){ var currentName = ruleNames[i].replace(/^\s+|\s+$/g,""); // trim whitespace var currentRule = this.application.ninja.stylesController.getAnimationRuleWithName(currentName, this.application.ninja.currentDocument._document); this.ruleList[currentName] = currentRule; } + this.recreatePropertyTracks(this.ruleList); } }, @@ -833,8 +835,10 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { recreatePropertyTracks:{ value:function(ruleSet){ + for(var i in ruleSet){ var styleProp = ruleSet[i][0].style[0]; + console.log(styleProp); this.application.ninja.timeline.layerRepetition.childComponents[0].addStyle(styleProp); } -- cgit v1.2.3