aboutsummaryrefslogtreecommitdiff
path: root/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js')
-rw-r--r--js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js119
1 files changed, 68 insertions, 51 deletions
diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
index 0c5121cd..55c84dce 100644
--- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
+++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
@@ -331,10 +331,6 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
331 _styleCollapser:{ 331 _styleCollapser:{
332 value:null 332 value:null
333 }, 333 },
334 _openDocRedrawCheck:{
335 value:true,
336 writable:true
337 },
338 prepareForDraw:{ 334 prepareForDraw:{
339 value:function () { 335 value:function () {
340 this.init(); 336 this.init();
@@ -364,10 +360,12 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
364 360
365 didDraw:{ 361 didDraw:{
366 value:function () { 362 value:function () {
367 if(this.application.ninja.currentDocument.documentRoot.children[0]){ 363 if(!this.application.ninja.documentController.creatingNewFile){
368 if (this._openDocRedrawCheck) { 364 if(this.application.ninja.currentDocument.documentRoot.children[0]){
369 this.retrieveStoredTweens(); 365 var selectedIndex = this.application.ninja.timeline.getLayerIndexByID(this.trackID);
370 this._openDocRedrawCheck = false; 366 if(!this.application.ninja.timeline.arrLayers[selectedIndex].created){
367 this.retrieveStoredTweens();
368 }
371 } 369 }
372 } 370 }
373 } 371 }
@@ -462,49 +460,66 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
462 460
463 retrieveStoredTweens:{ 461 retrieveStoredTweens:{
464 value:function () { 462 value:function () {
465 var percentValue, fraction, splitValue, i = 0; 463 var percentValue, fraction, splitValue,offsetAttribute,topOffSetAttribute,leftOffsetAttribute, i = 0;
466
467 this.animatedElement = this.application.ninja.timeline.arrLayers[this.trackID - 1].elementsList[0];
468 this.animationName = this.application.ninja.stylesController.getElementStyle(this.animatedElement, "-webkit-animation-name");
469 this.animationDuration = this.application.ninja.stylesController.getElementStyle(this.animatedElement, "-webkit-animation-duration");
470 if(this.animationDuration){
471 this.trackDuration = this.animationDuration.split("s");
472 this.currentMilliSec = this.trackDuration[0] * 1000;
473 this.currentMillisecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80);
474 this.clickPos = this.currentMilliSec / this.currentMillisecPerPixel;
475 this.nextKeyframe = 0;
476
477 this.currentKeyframeRule = this.application.ninja.stylesController.getAnimationRuleWithName(this.animationName, this.application.ninja.currentDocument._document);
478 while (this.currentKeyframeRule[i]) {
479 var newTween = {};
480
481 if (this.currentKeyframeRule[i].keyText === "0%") {
482 newTween.spanWidth = 0;
483 newTween.keyFramePosition = 0;
484 newTween.keyFrameMillisec = 0;
485 newTween.tweenID = 0;
486 newTween.spanPosition = 0;
487 this.tweens.push(newTween);
488
489 }
490 else {
491 percentValue = this.currentKeyframeRule[i].keyText;
492 splitValue = percentValue.split("%");
493 fraction = splitValue[0] / 100;
494 this.currentMilliSec = fraction * this.trackDuration[0] * 1000;
495 this.currentMillisecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80);
496 this.clickPos = this.currentMilliSec / this.currentMillisecPerPixel;
497 newTween.spanWidth = this.clickPos - this.tweens[this.tweens.length - 1].keyFramePosition;
498 newTween.keyFramePosition = this.clickPos;
499 newTween.keyFrameMillisec = this.currentMilliSec;
500 newTween.tweenID = this.nextKeyframe;
501 newTween.spanPosition = this.clickPos - newTween.spanWidth;
502 this.tweens.push(newTween);
503
504 464
465 var selectedIndex = this.application.ninja.timeline.getLayerIndexByID(this.trackID);
466 this.application.ninja.timeline.arrLayers[selectedIndex].created=true;
467 this.animatedElement = this.application.ninja.timeline.arrLayers[selectedIndex].elementsList[0];
468 if(this.animatedElement!==undefined){
469 this.animationName = this.application.ninja.stylesController.getElementStyle(this.animatedElement, "-webkit-animation-name");
470 if(this.animationName){
471 this.animationDuration = this.application.ninja.stylesController.getElementStyle(this.animatedElement, "-webkit-animation-duration");
472 this.trackDuration = this.animationDuration.split("s");
473 this.currentMilliSec = this.trackDuration[0] * 1000;
474 this.currentMillisecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80);
475 this.clickPos = this.currentMilliSec / this.currentMillisecPerPixel;
476 this.nextKeyframe = 0;
477
478 this.currentKeyframeRule = this.application.ninja.stylesController.getAnimationRuleWithName(this.animationName, this.application.ninja.currentDocument._document);
479 while (this.currentKeyframeRule[i]) {
480 var newTween = {};
481
482 offsetAttribute = this.currentKeyframeRule[i].cssText.split(" ");
483 topOffSetAttribute = offsetAttribute[3].split("px");
484 leftOffsetAttribute = offsetAttribute[5].split("px");
485
486 parseInt(topOffSetAttribute[0]);
487 parseInt(leftOffsetAttribute[0]);
488
489 if (this.currentKeyframeRule[i].keyText === "0%") {
490 newTween.spanWidth = 0;
491 newTween.keyFramePosition = 0;
492 newTween.keyFrameMillisec = 0;
493 newTween.tweenID = 0;
494 newTween.spanPosition = 0;
495 newTween.tweenedProperties = [];
496 newTween.tweenedProperties["top"] = topOffSetAttribute[0];
497 newTween.tweenedProperties["left"] = leftOffsetAttribute[0];
498 this.tweens.push(newTween);
499
500 }
501 else {
502 percentValue = this.currentKeyframeRule[i].keyText;
503 splitValue = percentValue.split("%");
504 fraction = splitValue[0] / 100;
505 this.currentMilliSec = fraction * this.trackDuration[0] * 1000;
506 this.currentMillisecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80);
507 this.clickPos = this.currentMilliSec / this.currentMillisecPerPixel;
508 newTween.spanWidth = this.clickPos - this.tweens[this.tweens.length - 1].keyFramePosition;
509 newTween.keyFramePosition = this.clickPos;
510 newTween.keyFrameMillisec = this.currentMilliSec;
511 newTween.tweenID = this.nextKeyframe;
512 newTween.spanPosition = this.clickPos - newTween.spanWidth;
513 newTween.tweenedProperties=[];
514 newTween.tweenedProperties["top"] = topOffSetAttribute[0];
515 newTween.tweenedProperties["left"] = leftOffsetAttribute[0];
516 this.tweens.push(newTween);
517
518
519 }
520 i++;
521 this.nextKeyframe += 1;
505 } 522 }
506 i++;
507 this.nextKeyframe += 1;
508 } 523 }
509 } 524 }
510 else{ 525 else{
@@ -556,7 +571,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
556 value:function () { 571 value:function () {
557 var that = this; 572 var that = this;
558 573
559 this.arrPositionTracks = [0, 1, 2]; 574 this.arrPositionTracks = [0, 1];
560 this.arrTransformTracks = [0, 1, 2, 3, 4]; 575 this.arrTransformTracks = [0, 1, 2, 3, 4];
561 576
562 this.label = this.element.querySelector(".label-main"); 577 this.label = this.element.querySelector(".label-main");
@@ -652,7 +667,9 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
652 this._styleCollapser.bypassAnimation = layerEvent.bypassAnimation; 667 this._styleCollapser.bypassAnimation = layerEvent.bypassAnimation;
653 this._styleCollapser.handleCollapserLabelClick(); 668 this._styleCollapser.handleCollapserLabelClick();
654 } 669 }
670 } else if (layerEvent.layerEventType === "deleteStyle") {
671 this.arrStyleTracks.pop();
655 } 672 }
656 } 673 }
657 } 674 }
658}); \ No newline at end of file 675});