# HG changeset patch
# User Drew Perttula <drewp@bigasterisk.com>
# Date 2016-06-04 23:56:05
# Node ID 0e9d8a1328d1c7c42cabc88badee4ad452962227
# Parent  f24d4b331f156dabd534723b71357909b4587bc2

tried d3.zoom in this version, but I can't figure it out
Ignore-this: 18b25f2708737d36e9cdf66ca43f7063

diff --git a/light9/web/timeline-elements.html b/light9/web/timeline-elements.html
--- a/light9/web/timeline-elements.html
+++ b/light9/web/timeline-elements.html
@@ -30,6 +30,9 @@
          position: absolute;
          left: 0; top: 0; right: 0; bottom: 0;
      }
+     light9-timeline-adjusters {
+         pointer-events: none; /* temporary */
+         }
     </style>
     <div>
       <rdfdb-synced-graph graph="{{graph}}"></rdfdb-synced-graph>
diff --git a/light9/web/timeline.coffee b/light9/web/timeline.coffee
--- a/light9/web/timeline.coffee
+++ b/light9/web/timeline.coffee
@@ -56,6 +56,7 @@ Polymer
     @adjs = @makeZoomAdjs().concat(@persistDemo())
     @trackMouse()
     @bindKeys()
+    @bindWheelZoom()
 
   trackMouse: ->
     # not just for show- we use the mouse pos sometimes
@@ -72,6 +73,21 @@ Polymer
 
         @$.dia.setMouse(@viewState.mouse.pos())
 
+  bindWheelZoom: ->
+    # tried d3.zoom but couldn't figure it out
+    zoom = d3.zoom()
+    zoom.filter ->
+      # LMB drag is for selection, but MMB can scroll
+      return !(event.type == 'mousedown' && event.button != 1)
+    zoom.extent([[0, 0], [196, 1]])
+    zoom.translateExtent([[0, 0], [196, 1]])
+    zoom.on 'zoom', (a,b,c) =>
+      xf = d3.event.transform
+      log('zoom', xf)
+      @viewState.zoomSpec.t1(xf.invertX(0))
+      @viewState.zoomSpec.t2(xf.invertX(@viewState.zoomSpec.duration()))
+    d3.select(@$.zoomed).call(zoom)
+
   animatedZoom: (newT1, newT2, secs) ->
     fps = 30
     oldT1 = @viewState.zoomSpec.t1()
@@ -90,11 +106,9 @@ Polymer
     setTimeout(=>
         @viewState.zoomSpec.t1(newT1)
         @viewState.zoomSpec.t2(newT2)
-      , lastTime + 10)
-      
+      , lastTime + 10)  
     
   bindKeys: ->
-    
     shortcut.add "Ctrl+P", (ev) =>
       @$.music.seekPlayOrPause(@zoomInX.invert(@viewState.mouse.pos().e(1)))