changeset 1766:5f9d22f9c85b

fix adjuster-drag coordinate bug. highlight nearby adj. Ignore-this: 169a65c9b2932d453a630ee8d68fc1cf
author drewp@bigasterisk.com
date Fri, 01 Jun 2018 01:39:40 +0000
parents 02222c96d5ff
children 1df3b2c7f283
files light9/web/timeline/adjusters.coffee light9/web/timeline/viewstate.coffee
diffstat 2 files changed, 18 insertions(+), 9 deletions(-) [+]
line wrap: on
line diff
--- a/light9/web/timeline/adjusters.coffee	Thu May 31 22:59:43 2018 +0000
+++ b/light9/web/timeline/adjusters.coffee	Fri Jun 01 01:39:40 2018 +0000
@@ -14,6 +14,7 @@
     super()
     @redraw = _.throttle(@_throttledRedraw.bind(@), 30, {leading: false})
     @adjs = {}
+    @hoveringNear = null
     
   ready: ->
     super.ready()
@@ -27,10 +28,13 @@
     @addEventListener('mousedown', @onDown.bind(@))
     @addEventListener('mousemove', @onMove.bind(@))
     @addEventListener('mouseup', @onUp.bind(@))
-   
+
+  _mousePos: (ev) ->
+    $V([ev.clientX, ev.clientY - @offsetParent.offsetTop])
+  
   onDown: (ev) ->
     if ev.buttons == 1
-      start = $V([ev.x, ev.y])
+      start = @_mousePos(ev)
       adj = @_adjAtPoint(start)
       if adj
         ev.stopPropagation()
@@ -38,11 +42,17 @@
         adj.startDrag()
 
   onMove: (ev) ->
-    pos = $V([ev.x, ev.y])
+    pos = @_mousePos(ev)
     if @currentDrag
+      @hoveringNear = null
       @currentDrag.cur = pos
       @currentDrag.adj.continueDrag(
         @currentDrag.cur.subtract(@currentDrag.start))
+    else
+      near = @_adjAtPoint(pos)
+      if @hoveringNear != near
+        @hoveringNear = near
+        @redraw()
 
   onUp: (ev) ->
     return unless @currentDrag
@@ -71,8 +81,6 @@
 
   _adjAtPoint: (pt) ->
     nearest = @qt.find(pt.e(1), pt.e(2))
-    if nearest?
-      log('near', nearest.distanceFrom(pt))
     if not nearest? or nearest.distanceFrom(pt) > maxDist
       return null
     return nearest?.adj
@@ -99,7 +107,8 @@
       
       @_drawAdjuster(adj.getDisplayValue(),
                      ctr.e(1) - 20, ctr.e(2) - 10,
-                     ctr.e(1) + 20, ctr.e(2) + 10)
+                     ctr.e(1) + 20, ctr.e(2) + 10,
+                     adj == @hoveringNear)
     console.timeEnd('adjs redraw')
 
   _layoutCenters: ->
@@ -152,7 +161,7 @@
     Drawing.line(@ctx, ctr, target)
     @ctx.stroke()
     
-  _drawAdjuster: (label, x1, y1, x2, y2) ->
+  _drawAdjuster: (label, x1, y1, x2, y2, hover) ->
     radius = 8
 
     @ctx.shadowColor = 'black'
@@ -160,7 +169,7 @@
     @ctx.shadowOffsetX = 5
     @ctx.shadowOffsetY = 9
     
-    @ctx.fillStyle = 'rgba(255, 255, 0, 0.5)'
+    @ctx.fillStyle = if hover then '#ffff88' else 'rgba(255, 255, 0, 0.5)'
     @ctx.beginPath()
     Drawing.roundRect(@ctx, x1, y1, x2, y2, radius)
     @ctx.fill()
--- a/light9/web/timeline/viewstate.coffee	Thu May 31 22:59:43 2018 +0000
+++ b/light9/web/timeline/viewstate.coffee	Fri Jun 01 01:39:40 2018 +0000
@@ -38,7 +38,7 @@
     if @zoomSpec.duration() and @zoomSpec.t2() > @zoomSpec.duration()
       @zoomSpec.t2(@zoomSpec.duration())
 
-    rightPad = 2 # don't let time adjuster fall off right edge
+    rightPad = 5 # don't let time adjuster fall off right edge
     @fullZoomX.domain([0, @zoomSpec.duration()])
     @fullZoomX.range([0, @width() - rightPad])