Merge remote-tracking branch 'ninja-jduran/SerialKiller' into Timeline-local

1 files changed, 26 insertions, 0 deletions

diff --git a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
index dfc40c0a..cd7622b1 100644
--- a/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
+++ b/js/panels/Timeline/TimelinePanel.reel/TimelinePanel.js
@@ -277,6 +277,9 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
             this.layout_tracks.addEventListener("scroll", this.updateLayerScroll.bind(this), false);
             this.user_layers.addEventListener("scroll", this.updateLayerScroll.bind(this), false);
             this.end_hottext.addEventListener("changing", this.updateTrackContainerWidth.bind(this), false);
+            this.playhead.addEventListener("mousedown", this.startPlayheadTracking.bind(this), false);
+            this.playhead.addEventListener("mouseup", this.stopPlayheadTracking.bind(this), false);
+            this.time_markers.addEventListener("click", this.updatePlayhead.bind(this), false);
                 }
         },
         
@@ -398,6 +401,29 @@ var TimelinePanel = exports.TimelinePanel = Montage.create(Component, {
         }
     },
 
+    startPlayheadTracking:{
+        value:function(){
+            this.time_markers.onmousemove = this.updatePlayhead.bind(this);
+        }
+    },
+
+    stopPlayheadTracking:{
+        value:function () {
+            this.time_markers.onmousemove = null;
+        }
+    },
+
+    updatePlayhead:{
+        value:function (event) {
+            var clickedPosition = event.target.offsetLeft + event.offsetX;
+            this.playhead.style.left = (clickedPosition - 2) + "px";
+            this.playheadmarker.style.left = clickedPosition + "px";
+            var currentMillisecPerPixel = Math.floor(this.millisecondsOffset / 80);
+            var currentMillisec = currentMillisecPerPixel * clickedPosition;
+            this.updateTimeText(currentMillisec);
+        }
+    },
+
     handleSelectionChange:{
         value:function(){
             var key , switchSelectedLayer,layerIndex;