aboutsummaryrefslogtreecommitdiff
path: root/js/panels/Timeline
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/Timeline')
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/TimelinePanel.html2
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js20
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/scss/TimelinePanel.scss2
-rw-r--r--js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js26
-rw-r--r--js/panels/Timeline/Tween.reel/Tween.js10
5 files changed, 51 insertions, 9 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>
3Copyright (c) 2012, Motorola Mobility LLC. 3Copyright (c) 2012, Motorola Mobility LLC.
4All Rights Reserved. 4All Rights Reserved.
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
index 521c315d..e037cccb 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,7 +1130,8 @@ 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 this.millisecondsOffset = this.application.ninja.currentDocument.tlZoomSliderValue ;
1134 this.zoom_slider.value = this.application.ninja.currentDocument.tlZoomSliderValue;
1134 1135
1135 // Are we only showing animated layers? 1136 // Are we only showing animated layers?
1136 if (this.application.ninja.currentDocument.boolShowOnlyAnimated) { 1137 if (this.application.ninja.currentDocument.boolShowOnlyAnimated) {
@@ -1706,12 +1707,17 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
1706 zoomTrackContainerWidthChange:{ 1707 zoomTrackContainerWidthChange:{
1707 value:function () { 1708 value:function () {
1708 1709
1709 this.tempValue = this.tempValue/1000; 1710 if(this.application.ninja.currentDocument){
1710 this.tempValue *= 30; 1711 this.application.ninja.currentDocument.tlZoomSliderValue = this.zoomValue;
1712
1713 }
1714
1715 this.zoomValue = this.zoomValue/1000;
1716 this.zoomValue *= 30;
1711 1717
1712 this.container_tracks.style.width = (this.tempValue * 80) + "px"; 1718 this.container_tracks.style.width = (this.zoomValue * 80) + "px";
1713 this.master_track.style.width = (this.tempValue * 80) + "px"; 1719 this.master_track.style.width = (this.zoomValue * 80) + "px";
1714 this.time_markers.style.width = (this.tempValue * 80) + "px"; 1720 this.time_markers.style.width = (this.zoomValue * 80) + "px";
1715 if (this.timeMarkerHolder) { 1721 if (this.timeMarkerHolder) {
1716 this.time_markers.removeChild(this.timeMarkerHolder); 1722 this.time_markers.removeChild(this.timeMarkerHolder);
1717 } 1723 }
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 },