Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature: precognition #21

Open
philholden opened this issue May 25, 2017 · 3 comments
Open

Feature: precognition #21

philholden opened this issue May 25, 2017 · 3 comments

Comments

@philholden
Copy link

philholden commented May 25, 2017

Just watched the React Europe talk. Sounds like a cool component. But I was thinking what you really want to know is will the mouse enter the component not is it close. You could do this by interpolating the mouse trajectory based on mouse position, speed and acceleration.

// each interval
x = mouse.x
xspeed = x - prevx
xacc = xspeed - prevxspeed

//calculate mouse pos 10 frames ahead
for (let i=0; i < 10; i++ ) {
  xspeed = xspeed + xacc
  x = x + xspeed
  // if (x, y) in box and (xspeed**2 + yspeed**2) < 10
  // mouse very likely to rest in box within 10 frames
}

I used this logic in a game where you controlled firefly. A fish would jump out of the water only if based on pre calculating both trajectories it would eat you in ten frames (providing you did not take evasive action). The fish seldom missed and always took you by surprise if you flew too close to the water. What felt cool was the firefly's speed made no difference to the fishes accuracy.

the fish is only missing here because he is photoshopped in

10 frames would give you 160ms to preload even if the mouse was moving fast towards the button from a long distance.

@aweary
Copy link
Owner

aweary commented Jun 20, 2017

I think this is very related to #21

I'd like to support this in a really flexible way. I'm thinking we can add a prop that takes a function that's called with x and y and returns a boolean indicating whether onBreach should be called?

@jdreesen
Copy link

You accidentally linked to this issue again ;)

@aarondack
Copy link

Any updates on this? I'm pretty interested in this idea.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants