From 38d8d4ea7d033b35f95e38ebb7d6abfd81bd2c69 Mon Sep 17 00:00:00 2001 From: Jon Reid Date: Wed, 29 Feb 2012 09:56:56 -0800 Subject: Timeline: document switching + new document. --- .../Timeline/TimelinePanel.reel/TimelinePanel.js | 98 +++++++++++++++------- 1 file changed, 68 insertions(+), 30 deletions(-) (limited to 'js/panels') diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index 01b03531..6a9e0140 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js @@ -28,7 +28,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { }, set:function (newVal) { this._arrLayers = newVal; - this.application.ninja.currentDocument.tlArrLayers = newVal; + this.updateLayers(); } }, @@ -44,6 +44,18 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this._layerRepetition = newVal; } }, + updateLayers : { + value: function() { + this.application.ninja.currentDocument.tlArrLayers = this.arrLayers; + // this.application.ninja.currentDocument.tlArrTracks = this.arrTracks; + console.log('inside of updateLayers '); + console.log(this.application.ninja.currentDocument.tlArrTracks); + + } + }, + boolUpdateLayers : { + value: true + }, _currentLayerNumber:{ value:0 @@ -100,7 +112,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { }, set:function (newVal) { this._arrTracks = newVal; - this.application.ninja.currentDocument.tlArrTracks = newVal; + this.updateLayers(); } }, @@ -182,7 +194,9 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { handleOnOpenDocument:{ value:function(){ + this.boolUpdateLayers = false; this.clearTimelinePanel(); + this.boolUpdateLayers = true; this.eventManager.addEventListener("deleteLayerClick", this, false); this.eventManager.addEventListener("newLayer", this, false); this.eventManager.addEventListener("deleteLayer", this, false); @@ -204,6 +218,8 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { handleCloseDocument: { value: function(event) { this.clearTimelinePanel(); + this.arrTracks = []; + this.arrLayers = []; } }, @@ -245,31 +261,55 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { initTimelineView:{ value:function () { var myIndex; - this.drawTimeMarkers(); + this._hashKey = "123"; + + + // Document switching + // Check to see if we have saved timeline information in the currentDocument. + if (typeof(this.application.ninja.currentDocument.isTimelineInitialized) === "undefined") { + // No, we have no information stored. Create it. + console.log('newfile!') + this.application.ninja.currentDocument.isTimelineInitialized = true; + this.application.ninja.currentDocument.tlArrLayers = []; + this.application.ninja.currentDocument.tlArrTracks = []; + _firstLayerDraw = false; + if(!this.application.ninja.documentController.creatingNewFile){ + if(this.application.ninja.currentDocument.documentRoot.children[0]){ + myIndex=0; + while(this.application.ninja.currentDocument.documentRoot.children[myIndex]) + { + this._openDoc=true; + NJevent('newLayer',{key:this._hashKey,ele:this.application.ninja.currentDocument.documentRoot.children[myIndex]}) + myIndex++; + } + } + else{ + NJevent('newLayer', this._hashKey); + this.selectLayer(0); + } + }else{ + NJevent('newLayer', this._hashKey); + this.selectLayer(0); + + } + _firstLayerDraw = true; + this.application.ninja.currentDocument.tlArrTracks = this.arrTracks; + } else { + // we do have information stored. Use it. + console.log('oldfile!') + console.log("tlArrLayers: " , this.application.ninja.currentDocument.tlArrLayers); + console.log("tlArrTracks: " , this.application.ninja.currentDocument.tlArrTracks); + this.arrLayers = this.application.ninja.currentDocument.tlArrLayers; + this.arrTracks = this.application.ninja.currentDocument.tlArrTracks; + } + + // Redraw all the things + this.layerRepetition.needsDraw = true; + this.trackRepetition.needsDraw = true; + this.needsDraw = true; - this._hashKey = "123"; - _firstLayerDraw = false; - if(!this.application.ninja.documentController.creatingNewFile){ - if(this.application.ninja.currentDocument.documentRoot.children[0]){ - myIndex=0; - while(this.application.ninja.currentDocument.documentRoot.children[myIndex]) - { - this._openDoc=true; - NJevent('newLayer',{key:this._hashKey,ele:this.application.ninja.currentDocument.documentRoot.children[myIndex]}) - myIndex++; - } - } - else{ - NJevent('newLayer', this._hashKey); - this.selectLayer(0); - } - }else{ - NJevent('newLayer', this._hashKey); - this.selectLayer(0); - } - _firstLayerDraw = true; } }, @@ -299,8 +339,10 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this.hashTrackInstance = null; this.hashLayerNumber = null; this.hashElementMapToLayer = null; - this.arrTracks = []; - this.arrLayers = []; + if (!this.boolUpdateLayers) { + + } + this.currentLayerNumber = 0; this.currentLayerSelected = false; this.currentTrackSelected = false; @@ -311,10 +353,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this.end_hottext.value = 25; this.updateTrackContainerWidth(); - // Redraw all the things - this.layerRepetition.needsDraw = true; - this.trackRepetition.needsDraw = true; - this.needsDraw = true; } }, -- cgit v1.2.3 From 8ccc989388bfbcb0d5713c44b9c97ef5ce45d31c Mon Sep 17 00:00:00 2001 From: Kruti Shah Date: Wed, 29 Feb 2012 12:30:12 -0800 Subject: Timeline: Changed the variables names to resolve issues.And removed the alert. Signed-off-by: Kruti Shah --- .../Timeline/TimelinePanel.reel/TimelinePanel.js | 4 +- .../Timeline/TimelineTrack.reel/TimelineTrack.js | 45 ++++++++++------------ 2 files changed, 23 insertions(+), 26 deletions(-) (limited to 'js/panels') diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index 81415951..e92c83db 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js @@ -728,7 +728,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { if(this.currentLayerSelected.elementsList[0]!==undefined){ if(this.currentTrackSelected.isTrackAnimated){ this.application.ninja.stage.clearDrawingCanvas(); - alert("cannot add elements to a layer with animated element");/* check how to clear the canvas*/ + console.log("cannot add elements to a layer with animated element"); return; }else{ this.hashElementMapToLayer.setItem(event.detail.uuid, event.detail,this.currentLayerSelected); @@ -738,12 +738,12 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this.hashElementMapToLayer.setItem(event.detail.uuid, event.detail,this.currentLayerSelected); this.currentLayerSelected.elementsList.push(event.detail); } - } }, handleElementDeleted:{ value:function (event) { + var length; this.deleteElement = event.detail; length = this.currentLayerSelected.elementsList.length - 1; diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index bf97c0fd..a2aaa550 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -459,7 +459,8 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { retrieveStoredTweens:{ value:function () { - var percentValue, fraction, splitValue,offsetAttribute,topOffSetAttribute,leftOffsetAttribute, i = 0; + var percentValue, fraction, splitValue,offsetAttribute,topOffSetAttribute,leftOffsetAttribute + var animationTiming,trackTiming,currentMilliSec,currentMilliSecPerPixel,clickPosition,i = 0; var selectedIndex = this.application.ninja.timeline.getLayerIndexByID(this.trackID); this.application.ninja.timeline.arrLayers[selectedIndex].created=true; @@ -467,23 +468,23 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { if(this.animatedElement!==undefined){ this.animationName = this.application.ninja.stylesController.getElementStyle(this.animatedElement, "-webkit-animation-name"); if(this.animationName){ - this.animationDuration = this.application.ninja.stylesController.getElementStyle(this.animatedElement, "-webkit-animation-duration"); - this.trackDuration = this.animationDuration.split("s"); - this.currentMilliSec = this.trackDuration[0] * 1000; - this.currentMillisecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80); - this.clickPos = this.currentMilliSec / this.currentMillisecPerPixel; + animationTiming = this.application.ninja.stylesController.getElementStyle(this.animatedElement, "-webkit-animation-duration"); + trackTiming = animationTiming.split("s"); + currentMilliSec = trackTiming[0] * 1000; + currentMilliSecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80); + clickPosition = currentMilliSec / currentMilliSecPerPixel; this.nextKeyframe = 0; this.currentKeyframeRule = this.application.ninja.stylesController.getAnimationRuleWithName(this.animationName, this.application.ninja.currentDocument._document); - while (this.currentKeyframeRule[i]) { + for (i =0; this.currentKeyframeRule[i] ;i++) { var newTween = {}; offsetAttribute = this.currentKeyframeRule[i].cssText.split(" "); topOffSetAttribute = offsetAttribute[3].split("px"); leftOffsetAttribute = offsetAttribute[5].split("px"); - parseInt(topOffSetAttribute[0]); - parseInt(leftOffsetAttribute[0]); + var tempTopOffset = parseInt(topOffSetAttribute[0]); + var tempLeftOffset =parseInt(leftOffsetAttribute[0]); if (this.currentKeyframeRule[i].keyText === "0%") { newTween.spanWidth = 0; @@ -492,8 +493,8 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { newTween.tweenID = 0; newTween.spanPosition = 0; newTween.tweenedProperties = []; - newTween.tweenedProperties["top"] = topOffSetAttribute[0]; - newTween.tweenedProperties["left"] = leftOffsetAttribute[0]; + newTween.tweenedProperties["top"] = tempTopOffset; + newTween.tweenedProperties["left"] = tempLeftOffset; this.tweens.push(newTween); } @@ -501,30 +502,26 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { percentValue = this.currentKeyframeRule[i].keyText; splitValue = percentValue.split("%"); fraction = splitValue[0] / 100; - this.currentMilliSec = fraction * this.trackDuration[0] * 1000; - this.currentMillisecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80); - this.clickPos = this.currentMilliSec / this.currentMillisecPerPixel; - newTween.spanWidth = this.clickPos - this.tweens[this.tweens.length - 1].keyFramePosition; - newTween.keyFramePosition = this.clickPos; - newTween.keyFrameMillisec = this.currentMilliSec; + currentMilliSec = fraction * trackTiming[0] * 1000; + currentMilliSecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80); + clickPosition = currentMilliSec / currentMilliSecPerPixel; + newTween.spanWidth = clickPosition - this.tweens[this.tweens.length - 1].keyFramePosition; + newTween.keyFramePosition = clickPosition; + newTween.keyFrameMillisec = currentMilliSec; newTween.tweenID = this.nextKeyframe; - newTween.spanPosition = this.clickPos - newTween.spanWidth; + newTween.spanPosition =clickPosition - newTween.spanWidth; newTween.tweenedProperties=[]; - newTween.tweenedProperties["top"] = topOffSetAttribute[0]; - newTween.tweenedProperties["left"] = leftOffsetAttribute[0]; + newTween.tweenedProperties["top"] = tempTopOffset; + newTween.tweenedProperties["left"] = tempLeftOffset; this.tweens.push(newTween); } - i++; this.nextKeyframe += 1; } this.isTrackAnimated = true; } } - else{ - return; - } } }, -- cgit v1.2.3 From 6e28beaca4ebc740fdc637d65f0b966c59fd05d2 Mon Sep 17 00:00:00 2001 From: Kruti Shah Date: Wed, 29 Feb 2012 12:36:46 -0800 Subject: TImeline: Cleanup Signed-off-by: Kruti Shah --- js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) (limited to 'js/panels') diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index a2aaa550..7394d42e 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -476,7 +476,9 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { this.nextKeyframe = 0; this.currentKeyframeRule = this.application.ninja.stylesController.getAnimationRuleWithName(this.animationName, this.application.ninja.currentDocument._document); - for (i =0; this.currentKeyframeRule[i] ;i++) { + var currentKeyFrameRuleLength = this.currentKeyframeRule.length; + + for (i =0; i --- js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) (limited to 'js/panels') diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index 7394d42e..f8f4f6b8 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -476,9 +476,8 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { this.nextKeyframe = 0; this.currentKeyframeRule = this.application.ninja.stylesController.getAnimationRuleWithName(this.animationName, this.application.ninja.currentDocument._document); - var currentKeyFrameRuleLength = this.currentKeyframeRule.length; - - for (i =0; i Date: Wed Feb 29 12:12:11 2012 -0800 Merge pull request #88 from mqg734/ToolFixes Fix for performance issue when moving shapes. commit 98d491f7e57ff5a9b091e332d7d1e81061e39efa Merge: 052d980 d417b33 Author: Valerio Virgillito Date: Wed Feb 29 12:10:57 2012 -0800 Merge branch 'SnapManagerFixes' of https://github.com/mqg734/ninja-internal into integration-candidate commit 052d9805a6f0a3a90d6849eb94eabffb7ec26962 Merge: 3d233f2 2f3e4d1 Author: Valerio Virgillito Date: Wed Feb 29 12:10:03 2012 -0800 Merge branch 'integration-candidate' of github.com:Motorola-Mobility/ninja-internal into integration-candidate commit 3d233f25cff057fff5c5a75e4c4b40e88c22a8f5 Merge: 3dbe798 209e078 Author: Valerio Virgillito Date: Wed Feb 29 12:09:43 2012 -0800 Merge branch 'NiveshColor' of https://github.com/mqg734/ninja-internal into integration-candidate commit 2f3e4d12aa15077d3cc9794862156e57b7815e68 Merge: 850f3a1 0996a51 Author: Valerio Virgillito Date: Wed Feb 29 12:06:21 2012 -0800 Merge pull request #87 from joseeight/FileIO-Build-Candidate Fixes to preview caching issues commit 850f3a1f7ab81ec80b6de1c49f2d2bbcbfe87c8e Merge: 1568367 5f777eb Author: Valerio Virgillito Date: Wed Feb 29 12:05:48 2012 -0800 Merge pull request #86 from imix23ways/Timeline Timeline commit 1568367213e760463f3ee29a531aa345fda6bd6d Merge: 3dbe798 271a8f2 Author: Valerio Virgillito Date: Wed Feb 29 12:03:23 2012 -0800 Merge pull request #85 from pushkarjoshi/brushtool Brushtool commit a89e30ab834a48be32b6122e0c8ac1e0c3ed43e8 Author: Nivesh Rajbhandari Date: Wed Feb 29 11:58:28 2012 -0800 Fix for performance issue when moving shapes. We don't need to call render except if the geometry and materials change. This is more easy to see with shapes like the brush tool. Signed-off-by: Nivesh Rajbhandari commit 271a8f2b29d87d12c81d03e3f1e2c05b816a138d Author: Pushkar Joshi Date: Wed Feb 29 11:50:41 2012 -0800 prevent extremely long path rendering (temporary fix) commit 0996a519afccbed526912807c70c20d598e9cae7 Merge: 98f1cfc 03d277d Author: Jose Antonio Marquez Date: Wed Feb 29 11:46:59 2012 -0800 Merge branch 'refs/heads/FileIO' into FileIO-Build-Candidate commit 03d277db80b6cea9a25320c0575ae2bf7a6d7e6e Author: Jose Antonio Marquez Date: Wed Feb 29 11:46:44 2012 -0800 Preview Fix Adding save all logic before preview, temporary fix. commit 46fb52be241dced940d46629c809a09c86ed4438 Author: Pushkar Joshi Date: Wed Feb 29 11:38:33 2012 -0800 changed the registration point of the brush tool icon and added a temporary check to prevent extremely long brush strokes commit 98f1cfc58f545702a18166ab216362d667c18915 Merge: da83f44 bb3e42b Author: Jose Antonio Marquez Date: Wed Feb 29 11:29:09 2012 -0800 Merge branch 'refs/heads/FileIO' into FileIO-Build-Candidate commit bb3e42b531848b400670df6caf0f3ce02adf1243 Author: Jose Antonio Marquez Date: Wed Feb 29 11:28:58 2012 -0800 Fix: Caching issue with chrome tab API Using window.open to test movie. commit f000a3cced9adbfff1d7aa641e6eb42ad6edf7e8 Author: Pushkar Joshi Date: Wed Feb 29 10:21:06 2012 -0800 change in comment only commit 795329d2225ff3b760f7f0ea3bb6b5e68f6c6b5b Author: Jose Antonio Marquez Date: Wed Feb 29 10:07:53 2012 -0800 Making class level url template variable Created a class level variable for the URL to be parsed out of the user files. commit f931c48a7d0bcf1222cf05787e3294839ed0b9fb Author: Pushkar Joshi Date: Wed Feb 29 09:47:41 2012 -0800 resample the brush stroke so we don't have gaps if the path is drawn rapidly, and, allow to change the stroke color, and, more efficient stroke rendering by drawing translated radial gradients (instead of creating new gradients for each stroke sample) commit d417b3315f1aa6dd52fea10cbf5f17a213ef8726 Author: Nivesh Rajbhandari Date: Wed Feb 29 06:50:51 2012 -0800 SnapManager fixes for sag tags. Signed-off-by: Nivesh Rajbhandari commit 209e0781e926212bbaaad9e8ca4b61a0c389b30f Author: Nivesh Rajbhandari Date: Tue Feb 28 17:19:42 2012 -0800 We need to remove color buttons from the color model when updating the PI for selection change. Signed-off-by: Nivesh Rajbhandari commit b43efdcbfa671a46d1edaeb1555f508fe2ad0338 Merge: 16d6a90 f2ab699 Author: Pushkar Joshi Date: Tue Feb 28 14:55:08 2012 -0800 Merge branch 'pentool' into brushtool commit 16d6a90579cdafede931a9c818689fad2e622d8b Merge: 03ca7a5 63307c9 Author: Pushkar Joshi Date: Tue Feb 28 14:19:25 2012 -0800 Merge branch 'pentool' into brushtool commit 03ca7a5ed13c25faaa9100bb666e062fd15335e6 Merge: fcb12cc 053fc63 Author: Pushkar Joshi Date: Fri Feb 24 12:08:49 2012 -0800 Merge branch 'pentool' into brushtool Conflicts: imports/codemirror/mode/scheme/scheme.js js/tools/BrushTool.js commit fcb12cc09eb3cd3b42bd215877ba18f449275b75 Author: Pushkar Joshi Date: Fri Feb 10 14:16:56 2012 -0800 render the brush stroke as a sequence of rectangles, with each rectangle having its own linear gradient commit 6bb00e69713bd7131b2bc0a15e4e0cb6071d616c Merge: 5f42bd1 666ae3e Author: Pushkar Joshi Date: Thu Feb 9 13:42:59 2012 -0800 Merge branch 'master' into brushtool commit 5f42bd1f7723483d374cdd3fe51ef8298c86a1a2 Merge: abeb9f1 fba39db Author: Pushkar Joshi Date: Thu Feb 9 10:55:58 2012 -0800 Merge branch 'pentool' into brushtool commit abeb9f1e23679200bb2f4a3ccbcebfb37645975c Author: Pushkar Joshi Date: Thu Feb 9 10:45:50 2012 -0800 first phase of simple resampling to prevent tiny segments Signed-off-by: Jonathan Duran --- js/panels/properties/content.reel/content.js | 22 ++++++++++++++++++++++ .../color-select.reel/color-select.html | 4 +++- .../custom-rows/color-select.reel/color-select.js | 21 +++++++++++++++++++++ .../properties/sections/custom.reel/custom.js | 5 +++++ 4 files changed, 51 insertions(+), 1 deletion(-) (limited to 'js/panels') diff --git a/js/panels/properties/content.reel/content.js b/js/panels/properties/content.reel/content.js index cc9ec96a..72c02ffd 100755 --- a/js/panels/properties/content.reel/content.js +++ b/js/panels/properties/content.reel/content.js @@ -172,6 +172,17 @@ exports.Content = Montage.create(Component, { this.positionSize.widthSize = parseFloat(ElementsMediator.getProperty(stage, "width")); if(this.customPi !== stage.elementModel.pi) { + // We need to unregister color chips from the previous selection from the Color Model + var len = this.customSections.length; + for(var n = 0, controls; n < len; n++) { + controls = this.customSections[n].content.controls; + if(controls["colorSelect"]) { + controls["colorSelect"].destroy(); + } else if(controls["stageBackground"]) { + controls["stageBackground"].destroy(); + } + } + this.customPi = stage.elementModel.pi; this.displayCustomProperties(stage, stage.elementModel.pi); } @@ -237,6 +248,17 @@ exports.Content = Montage.create(Component, { // Custom Section if(this.customPi !== el.elementModel.pi) { + // We need to unregister color chips from the previous selection from the Color Model + var len = this.customSections.length; + for(var n = 0, controls; n < len; n++) { + controls = this.customSections[n].content.controls; + if(controls["colorSelect"]) { + controls["colorSelect"].destroy(); + } else if(controls["stageBackground"]) { + controls["stageBackground"].destroy(); + } + } + this.customPi = el.elementModel.pi; this.displayCustomProperties(el, el.elementModel.pi); } diff --git a/js/panels/properties/sections/custom-rows/color-select.reel/color-select.html b/js/panels/properties/sections/custom-rows/color-select.reel/color-select.html index 9c2588b9..96cc4de7 100755 --- a/js/panels/properties/sections/custom-rows/color-select.reel/color-select.html +++ b/js/panels/properties/sections/custom-rows/color-select.reel/color-select.html @@ -14,7 +14,9 @@ "properties" : { "element" : {"#": "section"}, "Stroke" : {"#": "Stroke"}, - "Fill" : {"#": "Fill"} + "Fill" : {"#": "Fill"}, + "strokeChip" : {"@": "colorChip"}, + "fillChip" : {"@": "colorChip2"} } }, diff --git a/js/panels/properties/sections/custom-rows/color-select.reel/color-select.js b/js/panels/properties/sections/custom-rows/color-select.reel/color-select.js index 60f8efef..3e81ff67 100755 --- a/js/panels/properties/sections/custom-rows/color-select.reel/color-select.js +++ b/js/panels/properties/sections/custom-rows/color-select.reel/color-select.js @@ -17,6 +17,14 @@ exports.ColorSelect = Montage.create(Component, { value: null }, + strokeChip: { + value: null + }, + + fillChip: { + value: null + }, + handleChange: { value: function(e) { @@ -57,6 +65,19 @@ exports.ColorSelect = Montage.create(Component, { // } } + }, + + destroy: { + value: function() { + if(this.strokeChip) + { + this.strokeChip.destroy(); + } + if(this.fillChip) + { + this.fillChip.destroy(); + } + } } }); \ No newline at end of file diff --git a/js/panels/properties/sections/custom.reel/custom.js b/js/panels/properties/sections/custom.reel/custom.js index a2b9b9fa..a537d323 100755 --- a/js/panels/properties/sections/custom.reel/custom.js +++ b/js/panels/properties/sections/custom.reel/custom.js @@ -59,6 +59,8 @@ exports.CustomSection = Montage.create(Component, { if(obj1.visible === false) tmpRow.colorVisible = obj1.visible; if(obj2.visible === false) tmpRow.color2Visible = obj2.visible; + // TODO - Hack for now to reference the color select object to unregister color chips + this.controls["colorSelect"] = tmpRow; } else { @@ -344,6 +346,9 @@ exports.CustomSection = Montage.create(Component, { this.controls[aField.id] = obj; + // TODO - Hack for now to reference the color select object to unregister color chips + this.controls["stageBackground"] = obj; + return obj; } } -- cgit v1.2.3 From 939cb7eccb8a5ec655fbde8b470894d293832307 Mon Sep 17 00:00:00 2001 From: Jon Reid Date: Thu, 1 Mar 2012 09:21:50 -0800 Subject: Timeline: Document switching and code restructuring. --- .../Timeline/TimelinePanel.reel/TimelinePanel.html | 5 +- .../Timeline/TimelinePanel.reel/TimelinePanel.js | 156 ++++++++++++--------- 2 files changed, 95 insertions(+), 66 deletions(-) (limited to 'js/panels') diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html index 1aa9a725..92adee05 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html @@ -32,8 +32,7 @@ "timetext" : {"#": "time_text"}, "timebar" : {"#": "time_bar"}, "container_tracks" : {"#" : "container-tracks"}, - "end_hottext" : {"@" : "endHottext"}, - "getme" : {"#" : "getme"} + "end_hottext" : {"@" : "endHottext"} } }, @@ -285,7 +284,7 @@
-
Master Layer
+
Master Layer
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index 67ff3c02..6d23453d 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js @@ -28,7 +28,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { }, set:function (newVal) { this._arrLayers = newVal; - this.updateLayers(); + this._cacheArrays(); } }, @@ -44,16 +44,20 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this._layerRepetition = newVal; } }, - updateLayers : { + _cacheArrays : { value: function() { - this.application.ninja.currentDocument.tlArrLayers = this.arrLayers; - // this.application.ninja.currentDocument.tlArrTracks = this.arrTracks; - console.log('inside of updateLayers '); - console.log(this.application.ninja.currentDocument.tlArrTracks); - + // Cache this.arrLayers and this.arrTracks. + console.log('cacheArrays ' + this._boolCacheArrays) + if (this._boolCacheArrays) { + console.log('caching arrays for ', this.application.ninja.currentDocument.name); + this.application.ninja.currentDocument.tlArrLayers = this.arrLayers; + this.application.ninja.currentDocument.tlArrTracks = this.arrTracks; + } } }, - boolUpdateLayers : { + + // Set to false to skip array caching array sets in current document + _boolCacheArrays : { value: true }, @@ -112,7 +116,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { }, set:function (newVal) { this._arrTracks = newVal; - this.updateLayers(); + this._cacheArrays(); } }, @@ -192,43 +196,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { } }, - handleOnOpenDocument:{ - value:function(){ - this.boolUpdateLayers = false; - this.clearTimelinePanel(); - this.boolUpdateLayers = true; - this.eventManager.addEventListener("deleteLayerClick", this, false); - this.eventManager.addEventListener("newLayer", this, false); - this.eventManager.addEventListener("deleteLayer", this, false); - this.eventManager.addEventListener("layerBinding", this, false); - this.eventManager.addEventListener("elementAdded", this, false); - this.eventManager.addEventListener("elementDeleted", this, false); - this.eventManager.addEventListener("deleteSelection", this, false); - this.eventManager.addEventListener("selectionChange", this, true); - this.hashInstance = this.createLayerHashTable(); - this.hashTrackInstance = this.createTrackHashTable(); - this.hashLayerNumber = this.createLayerNumberHash(); - this.hashElementMapToLayer = this.createElementMapToLayer(); - this.initTimelineView(); - - - } - }, - - handleCloseDocument: { - value: function(event) { - this.clearTimelinePanel(); - this.arrTracks = []; - this.arrLayers = []; - } - }, - - handleSwitchDocument : { - value: function(event) { - // Handle document change. - this.handleOnOpenDocument(); - } - }, willDraw:{ value:function () { @@ -241,6 +208,33 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { /* === END: Draw cycle === */ /* === BEGIN: Controllers === */ + + // Bind all document-specific events (pass in true to unbind) + _bindDocumentEvents : { + value: function(boolUnbind) { + var arrEvents = ["deleteLayerClick", + "newLayer", + "deleteLayer", + "layerBinding", + "elementAdded", + "elementDeleted", + "deleteSelection", + "selectionChange"], + i, + arrEventsLength = arrEvents.length; + + if (boolUnbind) { + for (i = 0; i < arrEventsLength; i++) { + this.eventManager.removeEventListener(arrEvents[i], this, false); + } + } else { + for (i = 0; i < arrEventsLength; i++) { + this.eventManager.addEventListener(arrEvents[i], this, false); + } + } + } + }, + initTimeline : { value: function() { // Set up basic Timeline functions: event listeners, etc. Things that only need to be run once. @@ -258,7 +252,8 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { } }, - initTimelineView:{ + + initTimelineForDocument:{ value:function () { var myIndex; this.drawTimeMarkers(); @@ -269,10 +264,14 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { // Check to see if we have saved timeline information in the currentDocument. if (typeof(this.application.ninja.currentDocument.isTimelineInitialized) === "undefined") { // No, we have no information stored. Create it. - console.log('newfile!') + console.log('newfile ' + this.application.ninja.currentDocument.name) this.application.ninja.currentDocument.isTimelineInitialized = true; this.application.ninja.currentDocument.tlArrLayers = []; this.application.ninja.currentDocument.tlArrTracks = []; + + + // Loop through the DOM of the document to find layers and animations. + // Fire off events as they are found. _firstLayerDraw = false; if(!this.application.ninja.documentController.creatingNewFile){ if(this.application.ninja.currentDocument.documentRoot.children[0]){ @@ -282,7 +281,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this._openDoc=true; NJevent('newLayer',{key:this._hashKey,ele:this.application.ninja.currentDocument.documentRoot.children[myIndex]}) myIndex++; - } + k } } else{ NJevent('newLayer', this._hashKey); @@ -294,14 +293,20 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { } _firstLayerDraw = true; + + // After recreating the tracks and layers, store the result in the currentDocument. this.application.ninja.currentDocument.tlArrTracks = this.arrTracks; + this.application.ninja.currentDocument.tlArrLayers = this.arrLayers; + } else { // we do have information stored. Use it. - console.log('oldfile!') - console.log("tlArrLayers: " , this.application.ninja.currentDocument.tlArrLayers); - console.log("tlArrTracks: " , this.application.ninja.currentDocument.tlArrTracks); + console.log('oldfile ' + this.application.ninja.currentDocument.name) + this._boolCacheArrays = false; + this.arrLayers = []; + this.arrTracks = []; this.arrLayers = this.application.ninja.currentDocument.tlArrLayers; this.arrTracks = this.application.ninja.currentDocument.tlArrTracks; + this._boolCacheArrays = true; } // Redraw all the things @@ -316,14 +321,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { clearTimelinePanel : { value: function() { // Remove events - this.eventManager.removeEventListener("deleteLayerClick", this, false); - this.eventManager.removeEventListener("newLayer", this, false); - this.eventManager.removeEventListener("deleteLayer", this, false); - this.eventManager.removeEventListener("layerBinding", this, false); - this.eventManager.removeEventListener("elementAdded", this, false); - this.eventManager.removeEventListener("elementDeleted", this, false); - this.eventManager.removeEventListener("deleteSelection", this, false); - this.eventManager.removeEventListener("selectionChange", this, true); + this._bindDocumentEvents(true); // Remove every event listener for every tween in TimelineTrack this.deselectTweens(); @@ -339,9 +337,8 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this.hashTrackInstance = null; this.hashLayerNumber = null; this.hashElementMapToLayer = null; - if (!this.boolUpdateLayers) { - - } + this.arrTracks = []; + this.arrLayers = []; this.currentLayerNumber = 0; this.currentLayerSelected = false; @@ -356,6 +353,38 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { } }, + + handleOnOpenDocument:{ + value:function(){ + + this._boolCacheArrays = false; + this.clearTimelinePanel(); + this._boolCacheArrays = true; + this._bindDocumentEvents(); + + this.hashInstance = this.createLayerHashTable(); + this.hashTrackInstance = this.createTrackHashTable(); + this.hashLayerNumber = this.createLayerNumberHash(); + this.hashElementMapToLayer = this.createElementMapToLayer(); + this.initTimelineForDocument(); + + + } + }, + + handleCloseDocument: { + value: function(event) { + this.clearTimelinePanel(); + } + }, + + handleSwitchDocument : { + value: function(event) { + // Handle document change. + this.handleOnOpenDocument(); + } + }, + updateTrackContainerWidth:{ value: function(){ this.container_tracks.style.width = (this.end_hottext.value * 80) + "px"; @@ -440,6 +469,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { handleDeleteLayerClick:{ value:function (event) { + console.log('handleDeleteLayerClick called') if (this.arrLayers.length === 1) { // do not delete last layer return; -- cgit v1.2.3 From a725643eba157b3c37d9acd13c6fdd48379bb0df Mon Sep 17 00:00:00 2001 From: Jon Reid Date: Thu, 1 Mar 2012 10:38:47 -0800 Subject: Timeline: Merge. Set collapser heights. --- js/panels/Timeline/Layer.reel/Layer.html | 2 + js/panels/Timeline/Layer.reel/Layer.js | 12 +++--- .../Timeline/TimelinePanel.reel/TimelinePanel.js | 47 ++++++++++++++++++---- .../Timeline/TimelineTrack.reel/TimelineTrack.js | 2 +- 4 files changed, 48 insertions(+), 15 deletions(-) (limited to 'js/panels') diff --git a/js/panels/Timeline/Layer.reel/Layer.html b/js/panels/Timeline/Layer.reel/Layer.html index 0bd448f7..cba963b6 100644 --- a/js/panels/Timeline/Layer.reel/Layer.html +++ b/js/panels/Timeline/Layer.reel/Layer.html @@ -226,6 +226,8 @@ } } } + + } diff --git a/js/panels/Timeline/Layer.reel/Layer.js b/js/panels/Timeline/Layer.reel/Layer.js index d50360e6..3e016c0c 100644 --- a/js/panels/Timeline/Layer.reel/Layer.js +++ b/js/panels/Timeline/Layer.reel/Layer.js @@ -418,7 +418,7 @@ var Layer = exports.Layer = Montage.create(Component, { defaultEventManager.dispatchEvent(newEvent); that.isMainCollapsed = that.mainCollapser.isCollapsed; } - this.mainCollapser.needsDraw = true; + //this.mainCollapser.needsDraw = true; this.positionCollapser.clicker = this.clickerPosition; this.positionCollapser.myContent = this.contentPosition; @@ -437,7 +437,7 @@ var Layer = exports.Layer = Montage.create(Component, { defaultEventManager.dispatchEvent(newEvent); that.isPositionCollapsed = that.positionCollapser.isCollapsed; } - this.positionCollapser.needsDraw = true; + //this.positionCollapser.needsDraw = true; this.transformCollapser.clicker = this.clickerTransform; this.transformCollapser.myContent = this.contentTransform; @@ -456,13 +456,13 @@ var Layer = exports.Layer = Montage.create(Component, { defaultEventManager.dispatchEvent(newEvent); that.isTransformCollapsed = that.transformCollapser.isCollapsed; } - this.transformCollapser.needsDraw = true; + //this.transformCollapser.needsDraw = true; this.styleCollapser.clicker = this.clickerStyle; this.styleCollapser.myContent = this.contentStyle; this.styleCollapser.element = this.element; this.styleCollapser.isCollapsed = this.isStyleCollapsed; - this.styleCollapser.contentHeight = 20; + this.styleCollapser.contentHeight = 0; this.styleCollapser.isAnimated = true; this.styleCollapser.labelClickEvent = function(boolBypass) { var newEvent = document.createEvent("CustomEvent"); @@ -474,7 +474,7 @@ var Layer = exports.Layer = Montage.create(Component, { defaultEventManager.dispatchEvent(newEvent); that.isStyleCollapsed = that.styleCollapser.isCollapsed; } - this.styleCollapser.needsDraw = true; + //this.styleCollapser.needsDraw = true; // Add event listeners to add and delete style buttons this.buttonAddStyle.identifier = "addStyle"; @@ -485,7 +485,7 @@ var Layer = exports.Layer = Montage.create(Component, { // Add mousedown listener to set isActive this.element.addEventListener("mousedown", this, false); - //this.element.addEventListener("click", this, false); + this.element.addEventListener("click", this, false); } }, diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index ec9555fe..59306705 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js @@ -47,9 +47,9 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { _cacheArrays : { value: function() { // Cache this.arrLayers and this.arrTracks. - console.log('cacheArrays ' + this._boolCacheArrays) + this.log('cacheArrays ' + this._boolCacheArrays) if (this._boolCacheArrays) { - console.log('caching arrays for ', this.application.ninja.currentDocument.name); + this.log('caching arrays for ', this.application.ninja.currentDocument.name); this.application.ninja.currentDocument.tlArrLayers = this.arrLayers; this.application.ninja.currentDocument.tlArrTracks = this.arrTracks; } @@ -264,7 +264,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { // Check to see if we have saved timeline information in the currentDocument. if (typeof(this.application.ninja.currentDocument.isTimelineInitialized) === "undefined") { // No, we have no information stored. Create it. - console.log('newfile ' + this.application.ninja.currentDocument.name) + this.log('newfile ' + this.application.ninja.currentDocument.name) this.application.ninja.currentDocument.isTimelineInitialized = true; this.application.ninja.currentDocument.tlArrLayers = []; this.application.ninja.currentDocument.tlArrTracks = []; @@ -281,7 +281,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { this._openDoc=true; NJevent('newLayer',{key:this._hashKey,ele:this.application.ninja.currentDocument.documentRoot.children[myIndex]}) myIndex++; - k } + } } else{ NJevent('newLayer', this._hashKey); @@ -300,7 +300,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { } else { // we do have information stored. Use it. - console.log('oldfile ' + this.application.ninja.currentDocument.name) + this.log('oldfile ' + this.application.ninja.currentDocument.name) this._boolCacheArrays = false; this.arrLayers = []; this.arrTracks = []; @@ -469,7 +469,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { handleDeleteLayerClick:{ value:function (event) { - console.log('handleDeleteLayerClick called') + this.log('handleDeleteLayerClick called') if (this.arrLayers.length === 1) { // do not delete last layer return; @@ -795,7 +795,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { if(this.currentLayerSelected.elementsList[0]!==undefined){ if(this.currentTrackSelected.isTrackAnimated){ this.application.ninja.stage.clearDrawingCanvas(); - console.log("cannot add elements to a layer with animated element"); + this.log("cannot add elements to a layer with animated element"); return; }else{ this.hashElementMapToLayer.setItem(event.detail.uuid, event.detail,this.currentLayerSelected); @@ -1167,7 +1167,38 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { }); return command; } - } + }, /* === END: Controllers === */ + + /* === BEGIN: Logging routines === */ + _boolDebug: { + enumerable: false, + value: false // set to true to enable debugging to console; false for turning off all debugging. + }, + boolDebug: { + get: function() { + return this._boolDebug; + }, + set: function(boolDebugSwitch) { + this._boolDebug = boolDebugSwitch; + } + }, + log: { + value: function(strMessage) { + if (this.boolDebug) { + console.log(this.getLineNumber() + ": " + strMessage); + } + } + }, + getLineNumber: { + value: function() { + try { + throw new Error('bazinga') + }catch(e){ + return e.stack.split("at")[3].split(":")[2]; + } + } + } + /* === END: Logging routines === */ }); diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index f8f4f6b8..90b685dc 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -626,7 +626,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { this._styleCollapser = Collapser.create(); this._styleCollapser.clicker = this.labelStyles; this._styleCollapser.myContent = this.contentStyles; - this._styleCollapser.contentHeight = 20; + this._styleCollapser.contentHeight = 0; this._styleCollapser.isLabelClickable = false; this._styleCollapser.element = this.element; this._styleCollapser.isCollapsed = this.isStyleCollapsed; -- cgit v1.2.3 From b66fb719d358383f9401ba8502061f792dee34dc Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Thu, 1 Mar 2012 10:51:01 -0800 Subject: Timeline: Track Duration Fix Signed-off-by: Kruti Shah Signed-off-by: Jonathan Duran --- js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | 13 ++++++------- 1 file changed, 6 insertions(+), 7 deletions(-) (limited to 'js/panels') diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index f8f4f6b8..8f867d35 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -460,7 +460,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { retrieveStoredTweens:{ value:function () { var percentValue, fraction, splitValue,offsetAttribute,topOffSetAttribute,leftOffsetAttribute - var animationTiming,trackTiming,currentMilliSec,currentMilliSecPerPixel,clickPosition,i = 0; + var currentMilliSec,currentMilliSecPerPixel,clickPosition,tempTiming,tempTimingInt,trackTiming,i = 0; var selectedIndex = this.application.ninja.timeline.getLayerIndexByID(this.trackID); this.application.ninja.timeline.arrLayers[selectedIndex].created=true; @@ -468,11 +468,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { if(this.animatedElement!==undefined){ this.animationName = this.application.ninja.stylesController.getElementStyle(this.animatedElement, "-webkit-animation-name"); if(this.animationName){ - animationTiming = this.application.ninja.stylesController.getElementStyle(this.animatedElement, "-webkit-animation-duration"); - trackTiming = animationTiming.split("s"); - currentMilliSec = trackTiming[0] * 1000; - currentMilliSecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80); - clickPosition = currentMilliSec / currentMilliSecPerPixel; + 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); @@ -500,10 +496,13 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { } else { + tempTiming = trackTiming.split("s"); + tempTimingInt = parseInt(tempTiming[0]); + this.trackDuration = tempTimingInt *1000; percentValue = this.currentKeyframeRule[i].keyText; splitValue = percentValue.split("%"); fraction = splitValue[0] / 100; - currentMilliSec = fraction * trackTiming[0] * 1000; + currentMilliSec = fraction * this.trackDuration; currentMilliSecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80); clickPosition = currentMilliSec / currentMilliSecPerPixel; newTween.spanWidth = clickPosition - this.tweens[this.tweens.length - 1].keyFramePosition; -- cgit v1.2.3 From 219f3a05e8a0fa994e301bb548d0d623c0208e81 Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Thu, 1 Mar 2012 11:00:18 -0800 Subject: Update master track on duration change instead of tween add. Adds support for updating the master track duration on file open as well as when adding tweens to already opened files. Signed-off-by: Jonathan Duran --- js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) (limited to 'js/panels') diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index 8f867d35..1edc04ba 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -229,6 +229,9 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { }, set:function (val) { this._trackDuration = val; + if(this._trackDuration > this.application.ninja.timeline.masterDuration){ + this.application.ninja.timeline.masterDuration = this._trackDuration; + } } }, @@ -413,9 +416,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { // need to check timeline master duration if greater than this track duration this.trackDuration = currentMillisec; - if(this.trackDuration > this.application.ninja.timeline.masterDuration){ - this.application.ninja.timeline.masterDuration = this.trackDuration; - } + var newTween = {}; -- cgit v1.2.3 From 51206a5b16e299f7ec8291d899277f7e4c95bb25 Mon Sep 17 00:00:00 2001 From: Jonathan Duran Date: Thu, 1 Mar 2012 11:46:36 -0800 Subject: Set doc dirty flag when adding tweens or modifying animations Signed-off-by: Jonathan Duran --- js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) (limited to 'js/panels') diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index 1edc04ba..88c78411 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js @@ -408,16 +408,12 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { insertTween:{ value:function (clickPos) { - // calculate new tween's keyframe milliseconds by clickPos var currentMillisecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80); var currentMillisec = currentMillisecPerPixel * clickPos; // need to check timeline master duration if greater than this track duration this.trackDuration = currentMillisec; - - - var newTween = {}; if (clickPos == 0) { @@ -445,9 +441,9 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { // update the animation duration var animationDuration = Math.round(this.trackDuration / 1000) + "s"; this.ninjaStylesContoller.setElementStyle(this.animatedElement, "-webkit-animation-duration", animationDuration); - this.nextKeyframe += 1; } + this.application.ninja.documentController.activeDocument.needsSave = true; } }, @@ -564,6 +560,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; } }, -- cgit v1.2.3 From 4a4b4e69ce101b22a85d16ece2dd8034c242654c Mon Sep 17 00:00:00 2001 From: Jon Reid Date: Thu, 1 Mar 2012 12:01:44 -0800 Subject: Timeline: efficiency improvements to collapser. Document switching. --- js/panels/Timeline/Collapser.js | 5 ++ js/panels/Timeline/Layer.reel/Layer.html | 12 ++-- js/panels/Timeline/Layer.reel/Layer.js | 10 +-- js/panels/Timeline/Layer.reel/css/Layer.css | 73 +++++++++++----------- js/panels/Timeline/Layer.reel/scss/Layer.scss | 2 +- .../Timeline/TimelineTrack.reel/TimelineTrack.js | 19 +++--- 6 files changed, 62 insertions(+), 59 deletions(-) (limited to 'js/panels') diff --git a/js/panels/Timeline/Collapser.js b/js/panels/Timeline/Collapser.js index 5de884a9..ad490c2e 100644 --- a/js/panels/Timeline/Collapser.js +++ b/js/panels/Timeline/Collapser.js @@ -184,6 +184,10 @@ var Montage = require("montage/core/core").Montage, // Get the original value of the overflow property: this._origOverflowValue = window.getComputedStyle(this.myContent, null).getPropertyValue("overflow"); + /* + * Removed because of expense. This disables the feature of having the + * component dynamically expand/collapse the content on init based on properties; + * Now default state of component must be set in CSS. // If the content area is supposed to start out collapsed: if (this.isCollapsed) { this.myContent.style.height = "0px"; @@ -198,6 +202,7 @@ var Montage = require("montage/core/core").Montage, this.myContent.classList.remove(this.collapsedClass); this.clicker.classList.remove(this.collapsedClass); } + */ } }, draw: { diff --git a/js/panels/Timeline/Layer.reel/Layer.html b/js/panels/Timeline/Layer.reel/Layer.html index cba963b6..14315f8d 100644 --- a/js/panels/Timeline/Layer.reel/Layer.html +++ b/js/panels/Timeline/Layer.reel/Layer.html @@ -243,9 +243,9 @@
Position - +
-
+
X
@@ -259,9 +259,9 @@
Transform - +
-
+
Scale X
@@ -288,11 +288,11 @@
Style - +
-
+
diff --git a/js/panels/Timeline/Layer.reel/Layer.js b/js/panels/Timeline/Layer.reel/Layer.js index 3e016c0c..94d1f7e9 100644 --- a/js/panels/Timeline/Layer.reel/Layer.js +++ b/js/panels/Timeline/Layer.reel/Layer.js @@ -403,7 +403,7 @@ var Layer = exports.Layer = Montage.create(Component, { this.mainCollapser.myContent = this.myContent; this.mainCollapser.contentHeight = 60; this.myContent.style.height = "0px"; - this.mainCollapser.element = this.element; + this.mainCollapser.element = this.myContent; //this.mainCollapser.isCollapsedAtStart = true; this.mainCollapser.isCollapsed = this.isMainCollapsed; this.mainCollapser.isAnimated = true; @@ -422,8 +422,8 @@ var Layer = exports.Layer = Montage.create(Component, { this.positionCollapser.clicker = this.clickerPosition; this.positionCollapser.myContent = this.contentPosition; - this.positionCollapser.element = this.element; - this.positionCollapser.contentHeight = 60; + this.positionCollapser.element = this.contentPosition; + this.positionCollapser.contentHeight = 40; // this.positionCollapser.isCollapsedAtStart = true; this.positionCollapser.isCollapsed = this.isPositionCollapsed; this.positionCollapser.isAnimated = true; @@ -441,7 +441,7 @@ var Layer = exports.Layer = Montage.create(Component, { this.transformCollapser.clicker = this.clickerTransform; this.transformCollapser.myContent = this.contentTransform; - this.transformCollapser.element = this.element; + this.transformCollapser.element = this.contentTransform; this.transformCollapser.contentHeight = 100; // this.transformCollapser.isCollapsedAtStart = true; this.transformCollapser.isCollapsed = this.isTransformCollapsed; @@ -460,7 +460,7 @@ var Layer = exports.Layer = Montage.create(Component, { this.styleCollapser.clicker = this.clickerStyle; this.styleCollapser.myContent = this.contentStyle; - this.styleCollapser.element = this.element; + this.styleCollapser.element = this.contentStyle; this.styleCollapser.isCollapsed = this.isStyleCollapsed; this.styleCollapser.contentHeight = 0; this.styleCollapser.isAnimated = true; diff --git a/js/panels/Timeline/Layer.reel/css/Layer.css b/js/panels/Timeline/Layer.reel/css/Layer.css index 18d0a5e3..8e36c2db 100644 --- a/js/panels/Timeline/Layer.reel/css/Layer.css +++ b/js/panels/Timeline/Layer.reel/css/Layer.css @@ -4,11 +4,10 @@ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. */ - /* Layer.scss * Main SCSS file for Layer component, compiled by SASS into the file css/Layer.css. */ -/* line 16, ../scss/Layer.scss */ +/* line 22, ../scss/Layer.scss */ .layerLabel { width: 100%; color: white; @@ -20,13 +19,13 @@ -webkit-box-orient: horizontal; } -/* line 26, ../scss/Layer.scss */ +/* line 32, ../scss/Layer.scss */ .layerLabel.layerSelected { background-color: #b2b2b2; color: #242424; } -/* line 30, ../scss/Layer.scss */ +/* line 36, ../scss/Layer.scss */ .layerLabel { width: 100%; height: 18px; @@ -35,7 +34,7 @@ -webkit-box-flex: 1; } -/* line 37, ../scss/Layer.scss */ +/* line 43, ../scss/Layer.scss */ .layerDisclosure { background-image: url("../images/panelDisclosureIcon.png