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.js28
-rw-r--r--js/panels/Timeline/Tween.reel/Tween.js24
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 },