mattdesl / mattdesl/spring-input
velocity keeps high if move fast, then not end
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 29
- Forks
- 5
- PR merge metrics
- No merged PRs in 30d
Description
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:
``` ts
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?
Contributor guide
No contributing guide indexed for this repository
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start at the spring.start, spring.move, spring.end, and spring.update entry points described in the issue, focusing on how velocity is retained while spring.interacting is true. Reproduce the fast-move-then-hold sequence and verify that releasing the mouse does not restart motion caused by stale velocity.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100