diff options
Diffstat (limited to 'js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js')
-rw-r--r-- | js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | 99 |
1 files changed, 11 insertions, 88 deletions
diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js index 836bb60f..76d52036 100644 --- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js +++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js | |||
@@ -355,6 +355,14 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { | |||
355 | _dragAndDropHelperCoords: { | 355 | _dragAndDropHelperCoords: { |
356 | value: false | 356 | value: false |
357 | }, | 357 | }, |
358 | dragAndDropHelperCoords: { | ||
359 | get: function() { | ||
360 | return this._dragAndDropHelperCoords; | ||
361 | }, | ||
362 | set: function(newVal) { | ||
363 | this._dragAndDropHelperCoords = newVal; | ||
364 | } | ||
365 | }, | ||
358 | _dragAndDropHelperOffset : { | 366 | _dragAndDropHelperOffset : { |
359 | value: false | 367 | value: false |
360 | }, | 368 | }, |
@@ -443,10 +451,10 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { | |||
443 | this.eventManager.addEventListener("tlZoomSlider", this, false); | 451 | this.eventManager.addEventListener("tlZoomSlider", this, false); |
444 | 452 | ||
445 | // Drag and Drop event handlers | 453 | // Drag and Drop event handlers |
446 | this.element.addEventListener("dragover", this.handleKeyframeDragover.bind(this), false); | 454 | //this.element.addEventListener("dragover", this.handleKeyframeDragover.bind(this), false); |
447 | this.element.addEventListener("dragstart", this.handleKeyframeDragstart.bind(this), false); | 455 | this.element.addEventListener("dragstart", this.handleKeyframeDragstart.bind(this), false); |
448 | this.element.addEventListener("dragend", this.handleKeyframeDragend.bind(this), false); | 456 | this.element.addEventListener("dragend", this.handleKeyframeDragend.bind(this), false); |
449 | this.element.addEventListener("drop", this.handleKeyframeDrop.bind(this), false); | 457 | //this.element.addEventListener("drop", this.handleKeyframeDrop.bind(this), false); |
450 | } | 458 | } |
451 | }, | 459 | }, |
452 | 460 | ||
@@ -881,45 +889,9 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { | |||
881 | this._keyframeMaxPosition = maxPosition-9; | 889 | this._keyframeMaxPosition = maxPosition-9; |
882 | this._appendHelper = true; | 890 | this._appendHelper = true; |
883 | this._deleteHelper = false; | 891 | this._deleteHelper = false; |
892 | this.parentComponent.parentComponent.draggingTrackId = this.trackID; | ||
884 | } | 893 | } |
885 | }, | 894 | }, |
886 | handleKeyframeDragover: { | ||
887 | value: function(event) { | ||
888 | event.preventDefault(); | ||
889 | var currPos = 0; | ||
890 | /* | ||
891 | myScrollTest = ((event.y - (this._dragAndDropHelperOffset - this.user_layers.scrollTop)) + 28) - this.user_layers.scrollTop; | ||
892 | if ((myScrollTest < 60) && (this.user_layers.scrollTop >0)) { | ||
893 | this._scrollTracks = (this.user_layers.scrollTop - 10) | ||
894 | } | ||
895 | if ((myScrollTest < 50) && (this.user_layers.scrollTop >0)) { | ||
896 | this._scrollTracks = (this.user_layers.scrollTop - 20) | ||
897 | } | ||
898 | if ((myScrollTest > (this.user_layers.clientHeight + 10))) { | ||
899 | this._scrollTracks = (this.user_layers.scrollTop + 10) | ||
900 | } | ||
901 | if ((myScrollTest > (this.user_layers.clientHeight + 20))) { | ||
902 | this._scrollTracks = (this.user_layers.scrollTop + 20) | ||
903 | |||
904 | } | ||
905 | */ | ||
906 | //currPos = event.y - (this._dragAndDropHelperOffset - this.user_layers.scrollTop)- 28; | ||
907 | currPos = event.x - 277; | ||
908 | |||
909 | // too much or too little? | ||
910 | if (currPos < this._keyframeMinPosition) { | ||
911 | currPos = this._keyframeMinPosition; | ||
912 | } | ||
913 | if (currPos > this._keyframeMaxPosition) { | ||
914 | currPos = this._keyframeMaxPosition; | ||
915 | } | ||
916 | |||
917 | this._dragAndDropHelperCoords = currPos + "px"; | ||
918 | this.needsDraw = true; | ||
919 | return false; | ||
920 | } | ||
921 | }, | ||
922 | |||
923 | handleKeyframeDragend : { | 895 | handleKeyframeDragend : { |
924 | value: function(event) { | 896 | value: function(event) { |
925 | this._deleteHelper = true; | 897 | this._deleteHelper = true; |
@@ -928,55 +900,6 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, { | |||
928 | } | 900 | } |
929 | }, | 901 | }, |
930 | 902 | ||
931 | handleKeyframeDrop : { | ||
932 | value: function(event) { | ||
933 | event.stopPropagation(); | ||
934 | //this.element.classList.remove("dragOver"); | ||
935 | //if (this.parentComponent.parentComponent.dragLayerID !== this.layerID) { | ||
936 | //this.parentComponent.parentComponent.dropLayerID = this.layerID; | ||
937 | //} | ||
938 | |||
939 | /* | ||
940 | * First, what keyframe is it (get the index); | ||
941 | * Limit keyframe position to between index-1 and index+1 keyFramePosition | ||
942 | * On update, be sure to update index+1's information too | ||
943 | * | ||
944 | */ | ||
945 | |||
946 | var currPos = event.x - 274, | ||
947 | currentMillisecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80), | ||
948 | currentMillisec = 0, | ||
949 | i = 0, | ||
950 | tweenIndex = this.draggingIndex; | ||
951 | |||
952 | // too much or too little? | ||
953 | if (currPos < this._keyframeMinPosition) { | ||
954 | currPos = this._keyframeMinPosition + 3; | ||
955 | } | ||
956 | if (currPos > this._keyframeMaxPosition) { | ||
957 | currPos = this._keyframeMaxPosition + 3; | ||
958 | } | ||
959 | |||
960 | currentMillisec = currentMillisecPerPixel * currPos; | ||
961 | |||
962 | this.tweens[tweenIndex].tweenData.spanWidth = currPos - this.tweens[tweenIndex - 1].tweenData.keyFramePosition; | ||
963 | this.tweens[tweenIndex].tweenData.keyFramePosition = currPos; | ||
964 | this.tweens[tweenIndex].tweenData.keyFrameMillisec = currentMillisec; | ||
965 | this.tweens[tweenIndex].tweenData.spanPosition = currPos - this.tweens[tweenIndex].tweenData.spanWidth; | ||
966 | this.tweenRepetition.childComponents[tweenIndex].setData(); | ||
967 | if (tweenIndex < this.tweens.length -1) { | ||
968 | var spanWidth = this.tweens[tweenIndex +1].tweenData.keyFramePosition - currPos; | ||
969 | var spanPosition = currPos; | ||
970 | this.tweens[tweenIndex +1].tweenData.spanWidth = spanWidth; | ||
971 | this.tweens[tweenIndex +1].tweenData.spanPosition = currPos; | ||
972 | this.tweenRepetition.childComponents[tweenIndex+1].setData(); | ||
973 | } | ||
974 | this.tweenRepetition.childComponents[tweenIndex].selectTween(); | ||
975 | this.updateKeyframeRule(); | ||
976 | return false; | ||
977 | } | ||
978 | }, | ||
979 | |||
980 | 903 | ||
981 | /* Begin: Logging routines */ | 904 | /* Begin: Logging routines */ |
982 | _boolDebug: { | 905 | _boolDebug: { |