How do i stop the ball from getting stuck in wall ? [Solved]

Question

So here the ball changes it's direction whenever it hits any side. But if you watch it moving for like 1 and 1/2 minute or around 2 minutes , it will get stuck at the top or the bottom side , so how do i prevent it from doing that ? Any help is much appreciated .

Click on the ball to make it start.

https://code.sololearn.com/W935hZ36UD42/?ref=app

Answer 1

you must at least add some update to make sure the ball would be inside viewport after 'update' function call...
add:

ball.x = ball.x<31 ? 31 : window.innerWidth-131;

before update() call in 'if' test for horizontal out of bounds, and:

ball.y = ball.y<4 ? 4 : window.innerHeight-100;

before update() call in 'if' test for vertical out of bounds...

also, you may want to disallow strictly vertical or horizontal angle (multiples of 90)...
to do so, you must take remainder of angle%360 (to leave it in the -360,360 range) and test if angle==0 or angle==180 in vertical out of bounds, and if angle==90 or angle==270 in horizontal out of bounds, and modify it if so (to not also stuck on a border when angle is null related to the side).

to avoid stuck on a fixed y or x coordinate, you should handle others 90 multiples in both 'if' blocks...

Answer 2

visph thank you so much ! I had an idea of checking for those values like that but i just gave up on it as it didn't seemed to work and spend like hours thinking of other ways , i would have probably give up on this thing if you didn't helped me here, so thank you again for it and for that advice on that angle thing.

Answer 3

Mirielle[ INACTIVE ] you must click on the ball to let it start moving ;)

Answer 4

I made this one, the code works pretty fine and I think it's also pretty simple to understand so you can probably find the solution to your problem here:

https://code.sololearn.com/W65x7ux8htc8/?ref=app

Answer 5

Karak10 you mentionned me in another thread about your code, but you deleted the question before I could read it ^^

Answer 6

Mirielle[ INACTIVE ] i have put "Click on the ball to make it start",but now i think I could have add "start *moving" as well . Sorry for your loss of time!