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.js61
-rw-r--r--js/panels/Timeline/TimelinePanel.reel/scss/TimelinePanel.scss2
-rw-r--r--js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js44
3 files changed, 59 insertions, 48 deletions
diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
index c048bcb2..6cc08cdf 100644
--- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
+++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
@@ -922,6 +922,8 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
922 this.application.ninja.currentDocument.tlCurrentSelectedContainer = this.currentDocument.model.domContainer; 922 this.application.ninja.currentDocument.tlCurrentSelectedContainer = this.currentDocument.model.domContainer;
923 this.application.ninja.currentDocument.tllayerNumber = this.currentLayerNumber; 923 this.application.ninja.currentDocument.tllayerNumber = this.currentLayerNumber;
924 this.application.ninja.currentDocument.tlCurrentLayersSelected = this.currentLayersSelected; 924 this.application.ninja.currentDocument.tlCurrentLayersSelected = this.currentLayersSelected;
925
926
925 for (i = 0; i < hashLength; i++ ) { 927 for (i = 0; i < hashLength; i++ ) {
926 if (this.application.ninja.currentDocument.tlBreadcrumbHash[i].containerUuid === this.currentDocument.model.domContainer.uuid) { 928 if (this.application.ninja.currentDocument.tlBreadcrumbHash[i].containerUuid === this.currentDocument.model.domContainer.uuid) {
927 this.application.ninja.currentDocument.tlBreadcrumbHash[i].arrLayers = this.arrLayers; 929 this.application.ninja.currentDocument.tlBreadcrumbHash[i].arrLayers = this.arrLayers;
@@ -961,7 +963,8 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
961 value: function(boolUnbind) { 963 value: function(boolUnbind) {
962 var arrEvents = ["elementAdded", 964 var arrEvents = ["elementAdded",
963 "elementsRemoved", 965 "elementsRemoved",
964 "selectionChange"], 966 "selectionChange",
967 "tlZoomSlider"],
965 i, 968 i,
966 arrEventsLength = arrEvents.length; 969 arrEventsLength = arrEvents.length;
967 970
@@ -1112,7 +1115,8 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
1112 this.currentLayersSelected = this.application.ninja.currentDocument.tlCurrentLayersSelected; 1115 this.currentLayersSelected = this.application.ninja.currentDocument.tlCurrentLayersSelected;
1113 this.currentElementsSelected = this.application.ninja.currentDocument.tlCurrentElementsSelected; 1116 this.currentElementsSelected = this.application.ninja.currentDocument.tlCurrentElementsSelected;
1114 this._currentDocumentUuid = this.application.ninja.currentDocument.uuid; 1117 this._currentDocumentUuid = this.application.ninja.currentDocument.uuid;
1115 1118
1119
1116 // Are we only showing animated layers? 1120 // Are we only showing animated layers?
1117 if (this.application.ninja.currentDocument.boolShowOnlyAnimated) { 1121 if (this.application.ninja.currentDocument.boolShowOnlyAnimated) {
1118 // Fake a click. 1122 // Fake a click.
@@ -1153,8 +1157,9 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
1153 this._captureSelection = false; 1157 this._captureSelection = false;
1154 this._openDoc = false; 1158 this._openDoc = false;
1155 this.end_hottext.value = 25; 1159 this.end_hottext.value = 25;
1160 this.millisecondsOffset = 1000;
1161
1156 this.handleTrackContainerWidthChange(); 1162 this.handleTrackContainerWidthChange();
1157
1158 // Clear the repetitions 1163 // Clear the repetitions
1159 if (this.arrLayers.length > 0) { 1164 if (this.arrLayers.length > 0) {
1160 this.arrLayers = []; 1165 this.arrLayers = [];
@@ -1711,6 +1716,8 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
1711 this.time_markers.removeChild(this.timeMarkerHolder); 1716 this.time_markers.removeChild(this.timeMarkerHolder);
1712 } 1717 }
1713 this.drawTimeMarkers(); 1718 this.drawTimeMarkers();
1719
1720
1714 } 1721 }
1715 }, 1722 },
1716 1723
@@ -2247,7 +2254,53 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
2247 } 2254 }
2248 return false; 2255 return false;
2249 } 2256 }
2250 } 2257 },
2258
2259 handleTlZoomSlider: {
2260 value: function(event) {
2261
2262 var currentMilliSecPerPixel , currentMilliSec , clickPos;
2263 var i = 0,j=0,tweensLength,
2264 trackLength = this.trackRepetition.childComponents.length;
2265
2266 for(j=0;j<trackLength;j++){
2267
2268 tweensLength = this.trackRepetition.childComponents[j].trackData.tweens.length;
2269
2270 for (i = 0; i < tweensLength; i++) {
2271
2272 if (i === 0) {
2273 // Exception: 0th item does not depend on anything
2274 // If 0th tween is draggable, this will need to be fixed.
2275 this.trackRepetition.childComponents[j].trackData.tweens[i].tweenData.spanWidth=0;
2276 this.trackRepetition.childComponents[j].trackData.tweens[i].tweenData.spanPosition=0;
2277 this.trackRepetition.childComponents[j].trackData.tweens[i].tweenData.keyFramePosition=0;
2278 this.trackRepetition.childComponents[j].trackData.tweens[i].tweenData.keyFrameMillisec=0;
2279
2280 } else {
2281 var prevKeyFramePosition = this.trackRepetition.childComponents[j].trackData.tweens[i - 1].tweenData.keyFramePosition,
2282 myObj = {},
2283 thing = {};
2284
2285 currentMilliSecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80);
2286 currentMilliSec = this.trackRepetition.childComponents[j].trackData.tweens[i].tweenData.keyFrameMillisec;
2287 clickPos = currentMilliSec / currentMilliSecPerPixel;
2288
2289 for (thing in this.trackRepetition.childComponents[j].trackData.tweens[i].tweenData) {
2290 myObj[thing] = this.trackRepetition.childComponents[j].trackData.tweens[i].tweenData[thing];
2291 }
2292 myObj.spanWidth = clickPos - prevKeyFramePosition;
2293 myObj.keyFramePosition = clickPos;
2294 myObj.spanPosition = clickPos - (clickPos - prevKeyFramePosition);
2295
2296 this.trackRepetition.childComponents[j].trackData.tweens[i].tweenData = myObj;
2297
2298 }
2299 }
2300 }
2301 this.application.ninja.timeline.zoomTrackContainerWidthChange();
2302 }
2303 }
2251 /* === END: Event Handlers === */ 2304 /* === END: Event Handlers === */
2252 2305
2253}); \ No newline at end of file 2306}); \ No newline at end of file
diff --git a/js/panels/Timeline/TimelinePanel.reel/scss/TimelinePanel.scss b/js/panels/Timeline/TimelinePanel.reel/scss/TimelinePanel.scss
index 91947ac6..d2d813bb 100644
--- a/js/panels/Timeline/TimelinePanel.reel/scss/TimelinePanel.scss
+++ b/js/panels/Timeline/TimelinePanel.reel/scss/TimelinePanel.scss
@@ -407,7 +407,7 @@ POSSIBILITY OF SUCH DAMAGE.
407} 407}
408 408
409.tl_slider .slider-track { 409.tl_slider .slider-track {
410 background: #29292; 410 background: #292929;
411 width: 127px; 411 width: 127px;
412 height: 4px; 412 height: 4px;
413 border: 1px solid #000; 413 border: 1px solid #000;
diff --git a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
index 2581df0f..5fff33d9 100644
--- a/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
+++ b/js/panels/Timeline/TimelineTrack.reel/TimelineTrack.js
@@ -506,7 +506,7 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
506 this.init(); 506 this.init();
507 this.ninjaStylesContoller = this.application.ninja.stylesController; 507 this.ninjaStylesContoller = this.application.ninja.stylesController;
508 this.element.addEventListener("click", this, false); 508 this.element.addEventListener("click", this, false);
509 this.eventManager.addEventListener("tlZoomSlider", this, false); 509
510 510
511 // Drag and Drop event handlers 511 // Drag and Drop event handlers
512 this.element.addEventListener("dragstart", this.handleKeyframeDragstart.bind(this), false); 512 this.element.addEventListener("dragstart", this.handleKeyframeDragstart.bind(this), false);
@@ -593,48 +593,6 @@ var TimelineTrack = exports.TimelineTrack = Montage.create(Component, {
593 // ==== End Draw cycle methods 593 // ==== End Draw cycle methods
594 594
595 // ==== Begin Event handlers 595 // ==== Begin Event handlers
596 handleTlZoomSlider: {
597 value: function(event) {
598
599 var currentMilliSecPerPixel , currentMilliSec , clickPos,thingToPush;
600 var i = 0,
601 tweensLength = this.tweens.length;
602
603 for (i = 0; i < tweensLength; i++) {
604
605 if (i === 0) {
606 // Exception: 0th item does not depend on anything
607 // If 0th tween is draggable, this will need to be fixed.
608 this.tweens[i].tweenData.spanWidth=0;
609 this.tweens[i].tweenData.spanPosition=0;
610 this.tweens[i].tweenData.keyFramePosition=0;
611 this.tweens[i].tweenData.keyFrameMillisec=0;
612
613 } else {
614 var prevKeyFramePosition = this.tweens[i - 1].tweenData.keyFramePosition,
615 myObj = {},
616 thing = {};
617
618 currentMilliSecPerPixel = Math.floor(this.application.ninja.timeline.millisecondsOffset / 80);
619 currentMilliSec = this.tweens[i].tweenData.keyFrameMillisec;
620 clickPos = currentMilliSec / currentMilliSecPerPixel;
621
622 for (thing in this.tweens[i].tweenData) {
623 myObj[thing] = this.tweens[i].tweenData[thing];
624 }
625 myObj.spanWidth = clickPos - prevKeyFramePosition;
626 myObj.keyFramePosition = clickPos;
627 myObj.spanPosition = clickPos - (clickPos - prevKeyFramePosition);
628
629 this.tweens[i].tweenData = myObj;
630
631
632 }
633 }
634 this.application.ninja.timeline.zoomTrackContainerWidthChange();
635
636 }
637 },
638 596
639