mattdesl / spring-input Goto Github PK

to reproduce:

1. place input at 0
2. start dragging from far right of screen toward the left
3. cursor will snap to the right edge

I just came across this package. Really useful!

But there is one behavior that's not expected in my opinion:

I call spring.start in mousedown, spring.move in mousemove, spring.end in mouseup and spring.update in requestAnimationFrame.

Now if I press the mouse button, then move the mouse really fast, then stop the mouse movement abruptly but hold the button pressed the spring.value stops changing also, but if I now release the mouse button the spring.value starts changing again because it has still a height velocity value that is only being used while spring.interacting is false.

The reason is obviously because there is no mousestop event in javascript that could be called if the mouse is not moving anymore.

My current solution is the following:

let framesSinceMove = 0;
function onDragMove(evt) {
  framesSinceMove = 0;
  spring.move(evt.clientX)
}

function onDragEnd(evt) {
  spring.end(evt.clientX)
}

function tick() {
  if(spring.interacting && ++framesSinceMove > 3) {
    spring.velocity = 0
  }
  spring.update()
}

each time spring.update is called I increment a counter. Each time the mouse is moved I reset the counter. Then if spring.interacting is true and update has been called more than 3 times (ie the mouse has not been moved for 4 frames) I reset the velocity.

I would suggest to build this into the library itself. Would you accept a pull request?