diff options
Diffstat (limited to 'js/panels/Timeline')
-rw-r--r-- | js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | 19 | ||||
-rw-r--r-- | js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | 121 |
2 files changed, 71 insertions, 69 deletions
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index 797a7cbf..92bb3405 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | |||
@@ -224,13 +224,15 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
224 | 224 | ||
225 | this._hashKey = "123"; | 225 | this._hashKey = "123"; |
226 | _firstLayerDraw = false; | 226 | _firstLayerDraw = false; |
227 | if(this.application.ninja.currentDocument.documentRoot.children[0]){ | 227 | if(!this.application.ninja.documentController.creatingNewFile){ |
228 | myIndex=0; | 228 | if(this.application.ninja.currentDocument.documentRoot.children[0]){ |
229 | while(this.application.ninja.currentDocument.documentRoot.children[myIndex]) | 229 | myIndex=0; |
230 | { | 230 | while(this.application.ninja.currentDocument.documentRoot.children[myIndex]) |
231 | this._openDoc=true; | 231 | { |
232 | NJevent('newLayer',{key:this._hashKey,ele:this.application.ninja.currentDocument.documentRoot.children[myIndex]}) | 232 | this._openDoc=true; |
233 | myIndex++; | 233 | NJevent('newLayer',{key:this._hashKey,ele:this.application.ninja.currentDocument.documentRoot.children[myIndex]}) |
234 | myIndex++; | ||
235 | } | ||
234 | } | 236 | } |
235 | }else{ | 237 | }else{ |
236 | NJevent('newLayer', this._hashKey); | 238 | NJevent('newLayer', this._hashKey); |
@@ -476,6 +478,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
476 | thingToPush.elementsList = []; | 478 | thingToPush.elementsList = []; |
477 | thingToPush.deleted = false; | 479 | thingToPush.deleted = false; |
478 | thingToPush.isSelected = false; | 480 | thingToPush.isSelected = false; |
481 | thingToPush.created=false; | ||
479 | if (_firstLayerDraw) { | 482 | if (_firstLayerDraw) { |
480 | 483 | ||
481 | this.application.ninja.currentSelectedContainer.uuid=this._hashKey; | 484 | this.application.ninja.currentSelectedContainer.uuid=this._hashKey; |
@@ -735,7 +738,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
735 | } | 738 | } |
736 | } | 739 | } |
737 | hashLayerObject[key][index] = value; | 740 | hashLayerObject[key][index] = value; |
738 | console.log(hashLayerObject) | ||
739 | this.counter = 0; | 741 | this.counter = 0; |
740 | } | 742 | } |
741 | }, | 743 | }, |
@@ -830,7 +832,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
830 | } | 832 | } |
831 | this.mappingArray[key]["ele"] = value; | 833 | this.mappingArray[key]["ele"] = value; |
832 | this.mappingArray[key].layerID = layer.layerID; | 834 | this.mappingArray[key].layerID = layer.layerID; |
833 | console.log(this.mappingArray) | ||
834 | 835 | ||
835 | } | 836 | } |
836 | }, | 837 | }, |
diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index a36e666b..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 | } |
@@ -465,60 +463,63 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { | |||
465 | var percentValue, fraction, splitValue,offsetAttribute,topOffSetAttribute,leftOffsetAttribute, i = 0; | 463 | var percentValue, fraction, splitValue,offsetAttribute,topOffSetAttribute,leftOffsetAttribute, i = 0; |
466 | 464 | ||
467 | var selectedIndex = this.application.ninja.timeline.getLayerIndexByID(this.trackID); | 465 | var selectedIndex = this.application.ninja.timeline.getLayerIndexByID(this.trackID); |
466 | this.application.ninja.timeline.arrLayers[selectedIndex].created=true; | ||
468 | this.animatedElement = this.application.ninja.timeline.arrLayers[selectedIndex].elementsList[0]; | 467 | this.animatedElement = this.application.ninja.timeline.arrLayers[selectedIndex].elementsList[0]; |
469 | this.animationName = this.application.ninja.stylesController.getElementStyle(this.animatedElement, "-webkit-animation-name"); | 468 | if(this.animatedElement!==undefined){ |
470 | this.animationDuration = this.application.ninja.stylesController.getElementStyle(this.animatedElement, "-webkit-animation-duration"); | 469 | this.animationName = this.application.ninja.stylesController.getElementStyle(this.animatedElement, "-webkit-animation-name"); |
471 | if(this.animationDuration){ | 470 | if(this.animationName){ |
472 | this.trackDuration = this.animationDuration.split("s"); | 471 | this.animationDuration = this.application.ninja.stylesController.getElementStyle(this.animatedElement, "-webkit-animation-duration"); |
473 | this.currentMilliSec = this.trackDuration[0] * 1000; | 472 | this.trackDuration = this.animationDuration.split("s"); |
474 | this.currentMillisecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80); | 473 | this.currentMilliSec = this.trackDuration[0] * 1000; |
475 | this.clickPos = this.currentMilliSec / this.currentMillisecPerPixel; | 474 | this.currentMillisecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80); |
476 | this.nextKeyframe = 0; | 475 | this.clickPos = this.currentMilliSec / this.currentMillisecPerPixel; |
477 | 476 | this.nextKeyframe = 0; | |
478 | this.currentKeyframeRule = this.application.ninja.stylesController.getAnimationRuleWithName(this.animationName, this.application.ninja.currentDocument._document); | 477 | |
479 | while (this.currentKeyframeRule[i]) { | 478 | this.currentKeyframeRule = this.application.ninja.stylesController.getAnimationRuleWithName(this.animationName, this.application.ninja.currentDocument._document); |
480 | var newTween = {}; | 479 | while (this.currentKeyframeRule[i]) { |
481 | 480 | var newTween = {}; | |
482 | offsetAttribute = this.currentKeyframeRule[i].cssText.split(" "); | 481 | |
483 | topOffSetAttribute = offsetAttribute[3].split("px"); | 482 | offsetAttribute = this.currentKeyframeRule[i].cssText.split(" "); |
484 | leftOffsetAttribute = offsetAttribute[5].split("px"); | 483 | topOffSetAttribute = offsetAttribute[3].split("px"); |
485 | 484 | leftOffsetAttribute = offsetAttribute[5].split("px"); | |
486 | parseInt(topOffSetAttribute[0]); | 485 | |
487 | parseInt(leftOffsetAttribute[0]); | 486 | parseInt(topOffSetAttribute[0]); |
488 | 487 | parseInt(leftOffsetAttribute[0]); | |
489 | if (this.currentKeyframeRule[i].keyText === "0%") { | 488 | |
490 | newTween.spanWidth = 0; | 489 | if (this.currentKeyframeRule[i].keyText === "0%") { |
491 | newTween.keyFramePosition = 0; | 490 | newTween.spanWidth = 0; |
492 | newTween.keyFrameMillisec = 0; | 491 | newTween.keyFramePosition = 0; |
493 | newTween.tweenID = 0; | 492 | newTween.keyFrameMillisec = 0; |
494 | newTween.spanPosition = 0; | 493 | newTween.tweenID = 0; |
495 | newTween.tweenedProperties = []; | 494 | newTween.spanPosition = 0; |
496 | newTween.tweenedProperties["top"] = topOffSetAttribute[0]; | 495 | newTween.tweenedProperties = []; |
497 | newTween.tweenedProperties["left"] = leftOffsetAttribute[0]; | 496 | newTween.tweenedProperties["top"] = topOffSetAttribute[0]; |
498 | this.tweens.push(newTween); | 497 | newTween.tweenedProperties["left"] = leftOffsetAttribute[0]; |
499 | 498 | this.tweens.push(newTween); | |
500 | } | 499 | |
501 | else { | 500 | } |
502 | percentValue = this.currentKeyframeRule[i].keyText; | 501 | else { |
503 | splitValue = percentValue.split("%"); | 502 | percentValue = this.currentKeyframeRule[i].keyText; |
504 | fraction = splitValue[0] / 100; | 503 | splitValue = percentValue.split("%"); |
505 | this.currentMilliSec = fraction * this.trackDuration[0] * 1000; | 504 | fraction = splitValue[0] / 100; |
506 | this.currentMillisecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80); | 505 | this.currentMilliSec = fraction * this.trackDuration[0] * 1000; |
507 | this.clickPos = this.currentMilliSec / this.currentMillisecPerPixel; | 506 | this.currentMillisecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80); |
508 | newTween.spanWidth = this.clickPos - this.tweens[this.tweens.length - 1].keyFramePosition; | 507 | this.clickPos = this.currentMilliSec / this.currentMillisecPerPixel; |
509 | newTween.keyFramePosition = this.clickPos; | 508 | newTween.spanWidth = this.clickPos - this.tweens[this.tweens.length - 1].keyFramePosition; |
510 | newTween.keyFrameMillisec = this.currentMilliSec; | 509 | newTween.keyFramePosition = this.clickPos; |
511 | newTween.tweenID = this.nextKeyframe; | 510 | newTween.keyFrameMillisec = this.currentMilliSec; |
512 | newTween.spanPosition = this.clickPos - newTween.spanWidth; | 511 | newTween.tweenID = this.nextKeyframe; |
513 | newTween.tweenedProperties=[]; | 512 | newTween.spanPosition = this.clickPos - newTween.spanWidth; |
514 | newTween.tweenedProperties["top"] = topOffSetAttribute[0]; | 513 | newTween.tweenedProperties=[]; |
515 | newTween.tweenedProperties["left"] = leftOffsetAttribute[0]; | 514 | newTween.tweenedProperties["top"] = topOffSetAttribute[0]; |
516 | this.tweens.push(newTween); | 515 | newTween.tweenedProperties["left"] = leftOffsetAttribute[0]; |
517 | 516 | this.tweens.push(newTween); | |
518 | 517 | ||
518 | |||
519 | } | ||
520 | i++; | ||
521 | this.nextKeyframe += 1; | ||
519 | } | 522 | } |
520 | i++; | ||
521 | this.nextKeyframe += 1; | ||
522 | } | 523 | } |
523 | } | 524 | } |
524 | else{ | 525 | else{ |