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.js72
-rw-r--r--js/panels/Timeline/Tween.reel/Tween.js24
2 files changed, 40 insertions, 56 deletions
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
index eabe1a7a..55c7162d 100644
--- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
+++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
@@ -355,9 +355,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
355 355
356 draw: { 356 draw: {
357 value: function() { 357 value: function() {
358
359
360
361 // Drag and Drop: 358 // Drag and Drop:
362 // Do we have a helper to append? 359 // Do we have a helper to append?
363 if (this._appendHelper === true) { 360 if (this._appendHelper === true) {
@@ -393,8 +390,7 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
393 this._dragAndDropHelper = null; 390 this._dragAndDropHelper = null;
394 this._deleteHelper = false; 391 this._deleteHelper = false;
395 } 392 }
396 } 393 }
397
398 } 394 }
399 } 395 }
400 }, 396 },
@@ -619,7 +615,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
619 this.selectedTweens = []; 615 this.selectedTweens = [];
620 this._captureSelection = false; 616 this._captureSelection = false;
621 this._openDoc = false; 617 this._openDoc = false;
622// this._firstTimeLoaded = true;
623 this.end_hottext.value = 25; 618 this.end_hottext.value = 25;
624 this.updateTrackContainerWidth(); 619 this.updateTrackContainerWidth();
625 this.masterDuration = 0; 620 this.masterDuration = 0;
@@ -645,7 +640,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
645 if (this.application.ninja.documentController._documents.length > 0) { 640 if (this.application.ninja.documentController._documents.length > 0) {
646 this.enablePanel(true); 641 this.enablePanel(true);
647 this.initTimelineForDocument(); 642 this.initTimelineForDocument();
648
649 } else { 643 } else {
650 this.enablePanel(false); 644 this.enablePanel(false);
651 } 645 }
@@ -689,9 +683,6 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
689 var clickedPosition = event.target.offsetLeft + event.offsetX; 683 var clickedPosition = event.target.offsetLeft + event.offsetX;
690 this.playhead.style.left = (clickedPosition - 2) + "px"; 684 this.playhead.style.left = (clickedPosition - 2) + "px";
691 this.playheadmarker.style.left = clickedPosition + "px"; 685 this.playheadmarker.style.left = clickedPosition + "px";
692
693
694
695 var currentMillisecPerPixel = Math.floor(this.millisecondsOffset / 80); 686 var currentMillisecPerPixel = Math.floor(this.millisecondsOffset / 80);
696 var currentMillisec = currentMillisecPerPixel * clickedPosition; 687 var currentMillisec = currentMillisecPerPixel * clickedPosition;
697 this.updateTimeText(currentMillisec); 688 this.updateTimeText(currentMillisec);
@@ -793,50 +784,45 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
793 thingToPush.layerData.layerPosition = myIndex; 784 thingToPush.layerData.layerPosition = myIndex;
794 thingToPush.layerData.trackPosition = myIndex; 785 thingToPush.layerData.trackPosition = myIndex;
795 this.arrLayers.splice(myIndex, 0, thingToPush); 786 this.arrLayers.splice(myIndex, 0, thingToPush);
796
797 } else { 787 } else {
798 thingToPush.layerData.layerPosition = myIndex; 788 thingToPush.layerData.layerPosition = myIndex;
799 this.arrLayers.splice(myIndex, 0, thingToPush); 789 this.arrLayers.splice(myIndex, 0, thingToPush);
800 790
801 } 791 }
802
803 this.selectLayer(myIndex); 792 this.selectLayer(myIndex);
804
805 } 793 }
806 }, 794 },
807 795
808 restoreLayer:{ 796 restoreLayer:{
809 value:function (ele) { 797 value:function (ele) {
810 798
811 var newLayerName, thingToPush = this.createLayerTemplate(); 799 var newLayerName, thingToPush = this.createLayerTemplate();
812 800
813 this.currentLayerNumber = this.currentLayerNumber + 1; 801 this.currentLayerNumber = this.currentLayerNumber + 1;
814 newLayerName = "Layer " + this.currentLayerNumber; 802 newLayerName = "Layer " + this.currentLayerNumber;
815 803
816 if(ele.dataset.storedLayerName){ 804 if (ele.dataset.storedLayerName) {
817 newLayerName = ele.dataset.storedLayerName; 805 newLayerName = ele.dataset.storedLayerName;
818 } 806 }
819 thingToPush.layerData.layerName = newLayerName; 807 thingToPush.layerData.layerName = newLayerName;
820 thingToPush.layerData.layerID = this.currentLayerNumber; 808 thingToPush.layerData.layerID = this.currentLayerNumber;
821 thingToPush.layerData.layerTag = "<" + ele.nodeName.toLowerCase() + ">"; 809 thingToPush.layerData.layerTag = "<" + ele.nodeName.toLowerCase() + ">";
822 thingToPush.parentElementUUID = this.hashKey; 810 thingToPush.parentElementUUID = this.hashKey;
823 thingToPush.parentElement = this.application.ninja.currentSelectedContainer; 811 thingToPush.parentElement = this.application.ninja.currentSelectedContainer;
824
825 // Are there styles to add?
826 thingToPush.layerData.arrLayerStyles = this.createLayerStyles();
827 thingToPush.layerData.arrStyleTracks = this.createStyleTracks();
828 812
829 if (this._openDoc) { 813 // Are there styles to add?
830 thingToPush.layerData.elementsList.push(ele); 814 thingToPush.layerData.arrLayerStyles = this.createLayerStyles();
831 } 815 thingToPush.layerData.arrStyleTracks = this.createStyleTracks();
832 816
833 this.temparrLayers.splice(0, 0, thingToPush); 817 if (this._openDoc) {
834 thingToPush.layerData.trackPosition = this.temparrLayers.length - 1; 818 thingToPush.layerData.elementsList.push(ele);
835 thingToPush.layerData.layerPosition = this.temparrLayers.length - 1; 819 }
836 820
837 this._openDoc = false; 821 this.temparrLayers.splice(0, 0, thingToPush);
822 thingToPush.layerData.trackPosition = this.temparrLayers.length - 1;
823 thingToPush.layerData.layerPosition = this.temparrLayers.length - 1;
838 824
839// } 825 this._openDoc = false;
840 } 826 }
841 }, 827 },
842 828
@@ -862,22 +848,22 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
862 }, 848 },
863 849
864 searchHighestTrackDuration:{ 850 searchHighestTrackDuration:{
865 value:function(){ 851 value:function () {
866 852
867 var trackDuration; 853 var trackDuration;
868 var length = this.arrLayers.length; 854 var length = this.arrLayers.length;
869 if(length > 0){ 855 if (length > 0) {
870 trackDuration = this.arrLayers[length-1].layerData.trackDuration; 856 trackDuration = this.arrLayers[length - 1].layerData.trackDuration;
871 length--; 857 length--;
872 while(length >=0){ 858 while (length >= 0) {
873 if(this.arrLayers[length].layerData.trackDuration > trackDuration){ 859 if (this.arrLayers[length].layerData.trackDuration > trackDuration) {
874 trackDuration = this.arrLayers[length].layerData.trackDuration; 860 trackDuration = this.arrLayers[length].layerData.trackDuration;
875 } 861 }
876 length--; 862 length--;
877 } 863 }
878 this.masterDuration = trackDuration; 864 this.masterDuration = trackDuration;
879 }else{ 865 } else {
880 this.masterDuration = 0 ; 866 this.masterDuration = 0;
881 } 867 }
882 } 868 }
883 }, 869 },
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();