diff options
Diffstat (limited to 'js/panels/Timeline')
-rw-r--r-- | js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | 28 | ||||
-rw-r--r-- | js/panels/Timeline/Tween.reel/Tween.js | 24 |
2 files changed, 19 insertions, 33 deletions
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js index 191b87d5..ab0f9d06 100644 --- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js +++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js | |||
@@ -357,9 +357,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
357 | 357 | ||
358 | draw: { | 358 | draw: { |
359 | value: function() { | 359 | value: function() { |
360 | |||
361 | |||
362 | |||
363 | // Drag and Drop: | 360 | // Drag and Drop: |
364 | // Do we have a helper to append? | 361 | // Do we have a helper to append? |
365 | if (this._appendHelper === true) { | 362 | if (this._appendHelper === true) { |
@@ -395,8 +392,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
395 | this._dragAndDropHelper = null; | 392 | this._dragAndDropHelper = null; |
396 | this._deleteHelper = false; | 393 | this._deleteHelper = false; |
397 | } | 394 | } |
398 | } | 395 | } |
399 | |||
400 | } | 396 | } |
401 | } | 397 | } |
402 | }, | 398 | }, |
@@ -621,7 +617,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
621 | this.selectedTweens = []; | 617 | this.selectedTweens = []; |
622 | this._captureSelection = false; | 618 | this._captureSelection = false; |
623 | this._openDoc = false; | 619 | this._openDoc = false; |
624 | // this._firstTimeLoaded = true; | ||
625 | this.end_hottext.value = 25; | 620 | this.end_hottext.value = 25; |
626 | this.updateTrackContainerWidth(); | 621 | this.updateTrackContainerWidth(); |
627 | this.masterDuration = 0; | 622 | this.masterDuration = 0; |
@@ -647,7 +642,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
647 | if (this.application.ninja.documentController._documents.length > 0) { | 642 | if (this.application.ninja.documentController._documents.length > 0) { |
648 | this.enablePanel(true); | 643 | this.enablePanel(true); |
649 | this.initTimelineForDocument(); | 644 | this.initTimelineForDocument(); |
650 | |||
651 | } else { | 645 | } else { |
652 | this.enablePanel(false); | 646 | this.enablePanel(false); |
653 | } | 647 | } |
@@ -691,9 +685,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
691 | var clickedPosition = event.target.offsetLeft + event.offsetX; | 685 | var clickedPosition = event.target.offsetLeft + event.offsetX; |
692 | this.playhead.style.left = (clickedPosition - 2) + "px"; | 686 | this.playhead.style.left = (clickedPosition - 2) + "px"; |
693 | this.playheadmarker.style.left = clickedPosition + "px"; | 687 | this.playheadmarker.style.left = clickedPosition + "px"; |
694 | |||
695 | |||
696 | |||
697 | var currentMillisecPerPixel = Math.floor(this.millisecondsOffset / 80); | 688 | var currentMillisecPerPixel = Math.floor(this.millisecondsOffset / 80); |
698 | var currentMillisec = currentMillisecPerPixel * clickedPosition; | 689 | var currentMillisec = currentMillisecPerPixel * clickedPosition; |
699 | this.updateTimeText(currentMillisec); | 690 | this.updateTimeText(currentMillisec); |
@@ -799,15 +790,12 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
799 | thingToPush.layerData.layerPosition = myIndex; | 790 | thingToPush.layerData.layerPosition = myIndex; |
800 | thingToPush.layerData.trackPosition = myIndex; | 791 | thingToPush.layerData.trackPosition = myIndex; |
801 | this.arrLayers.splice(myIndex, 0, thingToPush); | 792 | this.arrLayers.splice(myIndex, 0, thingToPush); |
802 | |||
803 | } else { | 793 | } else { |
804 | thingToPush.layerData.layerPosition = myIndex; | 794 | thingToPush.layerData.layerPosition = myIndex; |
805 | this.arrLayers.splice(myIndex, 0, thingToPush); | 795 | this.arrLayers.splice(myIndex, 0, thingToPush); |
806 | 796 | ||
807 | } | 797 | } |
808 | |||
809 | this.selectLayer(myIndex); | 798 | this.selectLayer(myIndex); |
810 | |||
811 | } | 799 | } |
812 | }, | 800 | }, |
813 | 801 | ||
@@ -870,22 +858,22 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, { | |||
870 | }, | 858 | }, |
871 | 859 | ||
872 | searchHighestTrackDuration:{ | 860 | searchHighestTrackDuration:{ |
873 | value:function(){ | 861 | value:function () { |
874 | 862 | ||
875 | var trackDuration; | 863 | var trackDuration; |
876 | var length = this.arrLayers.length; | 864 | var length = this.arrLayers.length; |
877 | if(length > 0){ | 865 | if (length > 0) { |
878 | trackDuration = this.arrLayers[length-1].layerData.trackDuration; | 866 | trackDuration = this.arrLayers[length - 1].layerData.trackDuration; |
879 | length--; | 867 | length--; |
880 | while(length >=0){ | 868 | while (length >= 0) { |
881 | if(this.arrLayers[length].layerData.trackDuration > trackDuration){ | 869 | if (this.arrLayers[length].layerData.trackDuration > trackDuration) { |
882 | trackDuration = this.arrLayers[length].layerData.trackDuration; | 870 | trackDuration = this.arrLayers[length].layerData.trackDuration; |
883 | } | 871 | } |
884 | length--; | 872 | length--; |
885 | } | 873 | } |
886 | this.masterDuration = trackDuration; | 874 | this.masterDuration = trackDuration; |
887 | }else{ | 875 | } else { |
888 | this.masterDuration = 0 ; | 876 | this.masterDuration = 0; |
889 | } | 877 | } |
890 | } | 878 | } |
891 | }, | 879 | }, |
diff --git a/js/panels/Timeline/Tween.reel/Tween.js b/js/panels/Timeline/Tween.reel/Tween.js index 0a67df43..e4fb42b3 100644 --- a/js/panels/Timeline/Tween.reel/Tween.js +++ b/js/panels/Timeline/Tween.reel/Tween.js | |||
@@ -166,29 +166,27 @@ var Tween = exports.Tween = Montage.create(Component, { | |||
166 | 166 | ||
167 | handleElementChange:{ | 167 | handleElementChange:{ |
168 | value:function (event) { | 168 | value:function (event) { |
169 | 169 | // temp - testing var | |
170 | var useAbsolute = true; | ||
171 | |||
170 | if (event.detail.source && event.detail.source !== "tween") { | 172 | if (event.detail.source && event.detail.source !== "tween") { |
171 | // check for correct element selection | 173 | // check for correct element selection |
172 | if (this.application.ninja.selectedElements[0]!= this.parentComponent.parentComponent.animatedElement) { | 174 | if (this.application.ninja.selectedElements[0] != this.parentComponent.parentComponent.animatedElement) { |
173 | console.log("Wrong element selected for this keyframe track"); | 175 | console.log("Wrong element selected for this keyframe track"); |
174 | } else { | 176 | } else { |
175 | // update tweenedProperties and tell containing track to update CSS rule | 177 | if(useAbsolute){ |
176 | // temp read only top and left. need to change to loop over event details for prop changes generically | 178 | this.setAbsoluteTweenProperties(event.detail); |
177 | if (this.parentComponent.parentComponent.animatedElement.offsetTop != this.tweenedProperties["top"] && this.parentComponent.parentComponent.animatedElement.offsetLeft != this.tweenedProperties["left"]) { | 179 | } else { |
178 | this.tweenedProperties["top"] = this.parentComponent.parentComponent.animatedElement.offsetTop; | 180 | this.setRelativeTweenProperties(event.detail); |
179 | this.tweenedProperties["left"] = this.parentComponent.parentComponent.animatedElement.offsetLeft; | ||
180 | this.parentComponent.parentComponent.updateKeyframeRule(); | ||
181 | } | 181 | } |
182 | // highlight the tween's span | ||
183 | this.tweenspan.highlightSpan(); | ||
184 | this.isTweenAnimated = true; | ||
185 | } | 182 | } |
186 | } | 183 | } |
187 | } | 184 | } |
188 | }, | 185 | }, |
189 | 186 | ||
190 | setAbsoluteTweenProperties:{ | 187 | setAbsoluteTweenProperties:{ |
191 | value:function () { | 188 | value:function (eventDetail) { |
189 | console.log(eventDetail); | ||
192 | if (this.parentComponent.parentComponent.animatedElement.offsetTop != this.tweenedProperties["top"] && this.parentComponent.parentComponent.animatedElement.offsetLeft != this.tweenedProperties["left"]) { | 190 | if (this.parentComponent.parentComponent.animatedElement.offsetTop != this.tweenedProperties["top"] && this.parentComponent.parentComponent.animatedElement.offsetLeft != this.tweenedProperties["left"]) { |
193 | this.tweenedProperties["top"] = this.parentComponent.parentComponent.animatedElement.offsetTop; | 191 | this.tweenedProperties["top"] = this.parentComponent.parentComponent.animatedElement.offsetTop; |
194 | this.tweenedProperties["left"] = this.parentComponent.parentComponent.animatedElement.offsetLeft; | 192 | this.tweenedProperties["left"] = this.parentComponent.parentComponent.animatedElement.offsetLeft; |
@@ -201,7 +199,7 @@ var Tween = exports.Tween = Montage.create(Component, { | |||
201 | }, | 199 | }, |
202 | 200 | ||
203 | setRelativeTweenProperties:{ | 201 | setRelativeTweenProperties:{ |
204 | value:function(){ | 202 | value:function(eventDetail){ |
205 | 203 | ||
206 | } | 204 | } |
207 | }, | 205 | }, |