diff options
author | Jose Antonio Marquez | 2012-07-23 14:57:34 -0700 |
---|---|---|
committer | Jose Antonio Marquez | 2012-07-23 14:57:34 -0700 |
commit | b3869f66ac77b31cbc0bd36ef360c3fa79c8d365 (patch) | |
tree | b41d8608bf8c38e7d5b027f99be649af9adf9011 /js/panels/Timeline | |
parent | 02c0ed30e3948c80189d862802fb3db637a658cc (diff) | |
parent | e7268388a99722dd7bb64506893538fd0ee96a71 (diff) | |
download | ninja-b3869f66ac77b31cbc0bd36ef360c3fa79c8d365.tar.gz |
Merge branch 'refs/heads/Ninja-Master' into Document
Diffstat (limited to 'js/panels/Timeline')
5 files changed, 62 insertions, 11 deletions
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html index 0d769c23..8a4073c9 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html | |||
@@ -1,4 +1,4 @@ | |||
1 | <!DOCTYPE html> | 1 | <!DOCTYPE html> |
2 | <!-- <copyright> | 2 | <!-- <copyright> |
3 | Copyright (c) 2012, Motorola Mobility LLC. | 3 | Copyright (c) 2012, Motorola Mobility LLC. |
4 | All Rights Reserved. | 4 | All Rights Reserved. |
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index 521c315d..7581d15a 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | |||
@@ -527,7 +527,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
527 | set:function (newVal) { | 527 | set:function (newVal) { |
528 | if (newVal !== this._millisecondsOffset) { | 528 | if (newVal !== this._millisecondsOffset) { |
529 | 529 | ||
530 | this.tempValue = newVal; | 530 | this.zoomValue = newVal; |
531 | var tempValue = (1/newVal) * 1000000; | 531 | var tempValue = (1/newVal) * 1000000; |
532 | newVal = tempValue; | 532 | newVal = tempValue; |
533 | 533 | ||
@@ -1130,8 +1130,13 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
1130 | this.currentLayersSelected = this.application.ninja.currentDocument.tlCurrentLayersSelected; | 1130 | this.currentLayersSelected = this.application.ninja.currentDocument.tlCurrentLayersSelected; |
1131 | this.currentElementsSelected = this.application.ninja.currentDocument.tlCurrentElementsSelected; | 1131 | this.currentElementsSelected = this.application.ninja.currentDocument.tlCurrentElementsSelected; |
1132 | this._currentDocumentUuid = this.application.ninja.currentDocument.uuid; | 1132 | this._currentDocumentUuid = this.application.ninja.currentDocument.uuid; |
1133 | 1133 | // if(this.application.ninja.currentDocument.tlZoomSliderValue){ | |
1134 | 1134 | // this.millisecondsOffset = this.application.ninja.currentDocument.tlZoomSliderValue ; | |
1135 | // if(this.zoom_slider){ | ||
1136 | // this.zoom_slider.value = this.application.ninja.currentDocument.tlZoomSliderValue; | ||
1137 | // } | ||
1138 | // | ||
1139 | // } | ||
1135 | // Are we only showing animated layers? | 1140 | // Are we only showing animated layers? |
1136 | if (this.application.ninja.currentDocument.boolShowOnlyAnimated) { | 1141 | if (this.application.ninja.currentDocument.boolShowOnlyAnimated) { |
1137 | // Fake a click. | 1142 | // Fake a click. |
@@ -1706,12 +1711,17 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
1706 | zoomTrackContainerWidthChange:{ | 1711 | zoomTrackContainerWidthChange:{ |
1707 | value:function () { | 1712 | value:function () { |
1708 | 1713 | ||
1709 | this.tempValue = this.tempValue/1000; | 1714 | if(this.application.ninja.currentDocument && this.zoomValue){ |
1710 | this.tempValue *= 30; | 1715 | this.application.ninja.currentDocument.tlZoomSliderValue = this.zoomValue; |
1716 | |||
1717 | } | ||
1711 | 1718 | ||
1712 | this.container_tracks.style.width = (this.tempValue * 80) + "px"; | 1719 | this.zoomValue = this.zoomValue/1000; |
1713 | this.master_track.style.width = (this.tempValue * 80) + "px"; | 1720 | this.zoomValue *= 30; |
1714 | this.time_markers.style.width = (this.tempValue * 80) + "px"; | 1721 | |
1722 | this.container_tracks.style.width = (this.zoomValue * 80) + "px"; | ||
1723 | this.master_track.style.width = (this.zoomValue * 80) + "px"; | ||
1724 | this.time_markers.style.width = (this.zoomValue * 80) + "px"; | ||
1715 | if (this.timeMarkerHolder) { | 1725 | if (this.timeMarkerHolder) { |
1716 | this.time_markers.removeChild(this.timeMarkerHolder); | 1726 | this.time_markers.removeChild(this.timeMarkerHolder); |
1717 | } | 1727 | } |
@@ -1917,7 +1927,12 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
1917 | 1927 | ||
1918 | handleElementsRemoved:{ | 1928 | handleElementsRemoved:{ |
1919 | value:function (event) { | 1929 | value:function (event) { |
1920 | this.deleteLayers(event.detail); | 1930 | |
1931 | if(typeof(event.detail.length) === "undefined"){ | ||
1932 | this.deleteLayers([event.detail]); | ||
1933 | }else{ | ||
1934 | this.deleteLayers(event.detail); | ||
1935 | } | ||
1921 | } | 1936 | } |
1922 | }, | 1937 | }, |
1923 | 1938 | ||
diff --git a/js/panels/Timeline/TimelinePanel.reel/scss/TimelinePanel.scss b/js/panels/Timeline/TimelinePanel.reel/scss/TimelinePanel.scss index cf6df347..cce01c90 100644 --- a/js/panels/Timeline/TimelinePanel.reel/scss/TimelinePanel.scss +++ b/js/panels/Timeline/TimelinePanel.reel/scss/TimelinePanel.scss | |||
@@ -305,7 +305,7 @@ POSSIBILITY OF SUCH DAMAGE. | |||
305 | top: 0; | 305 | top: 0; |
306 | left: 0; | 306 | left: 0; |
307 | position: absolute; | 307 | position: absolute; |
308 | z-index: 91; | 308 | z-index: 1; |
309 | opacity: 0.7; | 309 | opacity: 0.7; |
310 | } | 310 | } |
311 | .timebar{ | 311 | .timebar{ |
diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index f3ab0d84..56e5d2f1 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | |||
@@ -354,6 +354,20 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { | |||
354 | } | 354 | } |
355 | }, | 355 | }, |
356 | 356 | ||
357 | _enabled3D:{ | ||
358 | value:false | ||
359 | }, | ||
360 | enabled3D:{ | ||
361 | serializable:true, | ||
362 | get:function () { | ||
363 | return this._enabled3D; | ||
364 | }, | ||
365 | set:function (val) { | ||
366 | this._enabled3D = val; | ||
367 | this.trackData.enabled3D = val; | ||
368 | } | ||
369 | }, | ||
370 | |||
357 | _ruleList:{ | 371 | _ruleList:{ |
358 | value:[] | 372 | value:[] |
359 | }, | 373 | }, |
@@ -495,6 +509,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { | |||
495 | this.trackPosition = this.trackData.trackPosition; | 509 | this.trackPosition = this.trackData.trackPosition; |
496 | this.isVisible = this.trackData.isVisible; | 510 | this.isVisible = this.trackData.isVisible; |
497 | this.stageElement = this.trackData.stageElement; | 511 | this.stageElement = this.trackData.stageElement; |
512 | this.enabled3D = this.trackData.enabled3D; | ||
498 | this.trackEditorProperty = "master"; | 513 | this.trackEditorProperty = "master"; |
499 | this.needsDraw = true; | 514 | this.needsDraw = true; |
500 | } | 515 | } |
@@ -1087,6 +1102,17 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { | |||
1087 | } | 1102 | } |
1088 | }, | 1103 | }, |
1089 | 1104 | ||
1105 | initial3DforAllTweens:{ | ||
1106 | value:function(){ | ||
1107 | var j; | ||
1108 | var tweensLength = this.tweens.length; | ||
1109 | for (j = 0; j < tweensLength; j++) { | ||
1110 | this.tweens[j].tweenData.tweenedProperties["-webkit-transform"] = "perspective(1400) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)"; | ||
1111 | } | ||
1112 | this.enabled3D = true; | ||
1113 | } | ||
1114 | }, | ||
1115 | |||
1090 | addAnimationRuleToElement:{ | 1116 | addAnimationRuleToElement:{ |
1091 | value:function (tweenEvent) { | 1117 | value:function (tweenEvent) { |
1092 | this.tweens[0].tweenData.tweenedProperties["top"] = this.animatedElement.offsetTop + "px"; | 1118 | this.tweens[0].tweenData.tweenedProperties["top"] = this.animatedElement.offsetTop + "px"; |
diff --git a/js/panels/Timeline/Tween.reel/Tween.js b/js/panels/Timeline/Tween.reel/Tween.js index 0f567fbd..c9b59253 100644 --- a/js/panels/Timeline/Tween.reel/Tween.js +++ b/js/panels/Timeline/Tween.reel/Tween.js | |||
@@ -299,6 +299,10 @@ var Tween = exports.Tween = Montage.create(Component, { | |||
299 | this.parentComponent.parentComponent.updateKeyframeRule(); | 299 | this.parentComponent.parentComponent.updateKeyframeRule(); |
300 | this.isTweenAnimated = true; | 300 | this.isTweenAnimated = true; |
301 | } | 301 | } |
302 | |||
303 | if(!this.parentComponent.parentComponent.enabled3D){ | ||
304 | this.parentComponent.parentComponent.initial3DforAllTweens(); | ||
305 | } | ||
302 | 306 | ||
303 | if (eventDetail.source === "translateTool" || eventDetail.source === "rotateTool") { | 307 | if (eventDetail.source === "translateTool" || eventDetail.source === "rotateTool") { |
304 | var arrMat = eventDetail.data.value[0].properties.mat, | 308 | var arrMat = eventDetail.data.value[0].properties.mat, |
@@ -373,6 +377,12 @@ var Tween = exports.Tween = Montage.create(Component, { | |||
373 | this.application.ninja.elementMediator.setProperty([this.parentComponent.parentComponent.animatedElement], "left", [currentLeft], "Change", "tween"); | 377 | this.application.ninja.elementMediator.setProperty([this.parentComponent.parentComponent.animatedElement], "left", [currentLeft], "Change", "tween"); |
374 | this.application.ninja.elementMediator.setProperty([this.parentComponent.parentComponent.animatedElement], "width", [currentWidth], "Change", "tween"); | 378 | this.application.ninja.elementMediator.setProperty([this.parentComponent.parentComponent.animatedElement], "width", [currentWidth], "Change", "tween"); |
375 | this.application.ninja.elementMediator.setProperty([this.parentComponent.parentComponent.animatedElement], "height", [currentHeight], "Change", "tween"); | 379 | this.application.ninja.elementMediator.setProperty([this.parentComponent.parentComponent.animatedElement], "height", [currentHeight], "Change", "tween"); |
380 | |||
381 | if(this.parentComponent.parentComponent.enabled3D){ | ||
382 | var current3DMatrix = this.tweenedProperties["-webkit-transform"]; | ||
383 | this.application.ninja.elementMediator.setProperty([this.parentComponent.parentComponent.animatedElement], "-webkit-transform", [current3DMatrix], "Change", "tween"); | ||
384 | } | ||
385 | |||
376 | } | 386 | } |
377 | } | 387 | } |
378 | }, | 388 | }, |