diff options
Diffstat (limited to 'js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js')
-rw-r--r-- | js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | 103 |
1 files changed, 72 insertions, 31 deletions
diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index 457a85c0..6d557845 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | |||
@@ -11,10 +11,6 @@ var defaultEventManager = require("montage/core/event/event-manager").defaultEve | |||
11 | 11 | ||
12 | var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { | 12 | var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { |
13 | 13 | ||
14 | hasTemplate:{ | ||
15 | value:true | ||
16 | }, | ||
17 | |||
18 | _trackID:{ | 14 | _trackID:{ |
19 | value:null | 15 | value:null |
20 | }, | 16 | }, |
@@ -31,11 +27,21 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { | |||
31 | } | 27 | } |
32 | } | 28 | } |
33 | }, | 29 | }, |
34 | 30 | ||
35 | _isFirstDraw: { | 31 | _tween:{ |
36 | value: true | 32 | value:[] |
37 | }, | 33 | }, |
38 | 34 | ||
35 | tween:{ | ||
36 | serializable:true, | ||
37 | get:function () { | ||
38 | return this._tween; | ||
39 | }, | ||
40 | set:function (newVal) { | ||
41 | this._tween = newVal; | ||
42 | } | ||
43 | }, | ||
44 | |||
39 | _isVisible:{ | 45 | _isVisible:{ |
40 | value: true | 46 | value: true |
41 | }, | 47 | }, |
@@ -345,15 +351,51 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { | |||
345 | _positionCollapser:{ | 351 | _positionCollapser:{ |
346 | value:null | 352 | value:null |
347 | }, | 353 | }, |
354 | positionCollapser:{ | ||
355 | serializable:true, | ||
356 | get:function(){ | ||
357 | return this._positionCollapser; | ||
358 | }, | ||
359 | set:function(val){ | ||
360 | this._positionCollapser = val; | ||
361 | } | ||
362 | }, | ||
348 | _mainCollapser:{ | 363 | _mainCollapser:{ |
349 | value:null | 364 | value:null |
350 | }, | 365 | }, |
366 | mainCollapser:{ | ||
367 | serializable:true, | ||
368 | get:function () { | ||
369 | return this._mainCollapser; | ||
370 | }, | ||
371 | set:function (val) { | ||
372 | this._mainCollapser = val; | ||
373 | } | ||
374 | }, | ||
351 | _transformCollapser:{ | 375 | _transformCollapser:{ |
352 | value:null | 376 | value:null |
353 | }, | 377 | }, |
378 | transformCollapser:{ | ||
379 | serializable:true, | ||
380 | get:function () { | ||
381 | return this._transformCollapser; | ||
382 | }, | ||
383 | set:function (val) { | ||
384 | this._transformCollapser = val; | ||
385 | } | ||
386 | }, | ||
354 | _styleCollapser:{ | 387 | _styleCollapser:{ |
355 | value:null | 388 | value:null |
356 | }, | 389 | }, |
390 | styleCollapser:{ | ||
391 | serializable:true, | ||
392 | get:function () { | ||
393 | return this._styleCollapser; | ||
394 | }, | ||
395 | set:function (val) { | ||
396 | this._styleCollapser = val; | ||
397 | } | ||
398 | }, | ||
357 | 399 | ||
358 | // Drag and Drop properties | 400 | // Drag and Drop properties |
359 | _dragAndDropHelper : { | 401 | _dragAndDropHelper : { |
@@ -685,7 +727,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { | |||
685 | this.nextKeyframe += 1; | 727 | this.nextKeyframe += 1; |
686 | } | 728 | } |
687 | 729 | ||
688 | this.application.ninja.documentController.activeDocument.model.needsSave = true; | 730 | this.application.ninja.currentDocument.model.needsSave = true; |
689 | } | 731 | } |
690 | }, | 732 | }, |
691 | 733 | ||
@@ -726,7 +768,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { | |||
726 | break; | 768 | break; |
727 | } | 769 | } |
728 | } | 770 | } |
729 | this.application.ninja.documentController.activeDocument.needsSave = true; | 771 | this.application.ninja.currentDocument.model.needsSave = true; |
730 | } | 772 | } |
731 | }, | 773 | }, |
732 | 774 | ||
@@ -740,19 +782,18 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { | |||
740 | this.animatedElement = this.application.ninja.timeline.arrLayers[selectedIndex].layerData.stageElement; | 782 | this.animatedElement = this.application.ninja.timeline.arrLayers[selectedIndex].layerData.stageElement; |
741 | if(this.animatedElement!==undefined){ | 783 | if(this.animatedElement!==undefined){ |
742 | this.animationName = this.application.ninja.stylesController.getElementStyle(this.animatedElement, "-webkit-animation-name"); | 784 | this.animationName = this.application.ninja.stylesController.getElementStyle(this.animatedElement, "-webkit-animation-name"); |
743 | |||
744 | // check for multiple animation names | ||
745 | var animationNameList = this.animationName.split(","); | ||
746 | if(animationNameList.length > 1){ | ||
747 | this.animationNamesString = this.animationName; | ||
748 | this.animationName = animationNameList[0]; | ||
749 | this.getAllAnimationRules(animationNameList); | ||
750 | } else { | ||
751 | this.animationNamesString = this.animationName; | ||
752 | } | ||
753 | |||
754 | // build tweens for this tracks's keyframe rule | 785 | // build tweens for this tracks's keyframe rule |
755 | if(this.animationName){ | 786 | if(this.animationName){ |
787 | // check for multiple animation names | ||
788 | var animationNameList = this.animationName.split(","); | ||
789 | if (animationNameList.length > 1) { | ||
790 | this.animationNamesString = this.animationName; | ||
791 | this.animationName = animationNameList[0]; | ||
792 | this.getAllAnimationRules(animationNameList); | ||
793 | } else { | ||
794 | this.animationNamesString = this.animationName; | ||
795 | } | ||
796 | |||
756 | trackTiming = this.application.ninja.stylesController.getElementStyle(this.animatedElement, "-webkit-animation-duration"); | 797 | trackTiming = this.application.ninja.stylesController.getElementStyle(this.animatedElement, "-webkit-animation-duration"); |
757 | this.nextKeyframe = 0; | 798 | this.nextKeyframe = 0; |
758 | 799 | ||
@@ -831,14 +872,12 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { | |||
831 | 872 | ||
832 | recreatePropertyTracks:{ | 873 | recreatePropertyTracks:{ |
833 | value:function(ruleSet){ | 874 | value:function(ruleSet){ |
834 | |||
835 | |||
836 | for(var i in ruleSet){ | 875 | for(var i in ruleSet){ |
837 | var styleProp = ruleSet[i][0].style[0]; | 876 | var styleProp = ruleSet[i][0].style[0]; |
838 | console.log(styleProp); | 877 | //console.log(styleProp); |
839 | this.application.ninja.timeline.layerRepetition.childComponents[0].addStyle(styleProp); | 878 | //console.log(ruleSet[i]); |
879 | this.application.ninja.timeline.layerRepetition.childComponents[0].addStyle(styleProp, ruleSet[i]); | ||
840 | } | 880 | } |
841 | |||
842 | } | 881 | } |
843 | }, | 882 | }, |
844 | 883 | ||
@@ -883,9 +922,11 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { | |||
883 | keyframeString += keyframePropertyString; | 922 | keyframeString += keyframePropertyString; |
884 | } | 923 | } |
885 | keyframeString += " }"; | 924 | keyframeString += " }"; |
925 | //console.log(keyframeString); | ||
886 | // set the keyframe string as the new rule | 926 | // set the keyframe string as the new rule |
887 | this.currentKeyframeRule = this.ninjaStylesContoller.addRule(keyframeString); | 927 | this.currentKeyframeRule = this.ninjaStylesContoller.addRule(keyframeString); |
888 | this.application.ninja.documentController.activeDocument.model.needsSave = true; | 928 | //console.log(this.currentKeyframeRule); |
929 | this.application.ninja.currentDocument.model.needsSave = true; | ||
889 | } | 930 | } |
890 | }, | 931 | }, |
891 | 932 | ||
@@ -946,8 +987,6 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { | |||
946 | return; | 987 | return; |
947 | } | 988 | } |
948 | if (layerEvent.layerEventType === "newStyle") { | 989 | if (layerEvent.layerEventType === "newStyle") { |
949 | // TODO: Add a real track of tweens. Probably need a method for that. | ||
950 | |||
951 | var newStyleTrack = {}; | 990 | var newStyleTrack = {}; |
952 | newStyleTrack.propTrackData = {}; | 991 | newStyleTrack.propTrackData = {}; |
953 | newStyleTrack.propTrackData.styleSelection = layerEvent.styleSelection; | 992 | newStyleTrack.propTrackData.styleSelection = layerEvent.styleSelection; |
@@ -955,6 +994,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { | |||
955 | newStyleTrack.propTrackData.trackType = "style"; | 994 | newStyleTrack.propTrackData.trackType = "style"; |
956 | newStyleTrack.propTrackData.trackEditorProperty = ""; | 995 | newStyleTrack.propTrackData.trackEditorProperty = ""; |
957 | newStyleTrack.propTrackData.styleIndex = layerEvent.styleIndex; | 996 | newStyleTrack.propTrackData.styleIndex = layerEvent.styleIndex; |
997 | newStyleTrack.propTrackData.existingRule = ""; | ||
958 |