In this project, I was able to make a ball bounce from any area of a canvas using variables for the X & Y axis.
First, both variables for when the ball moves left/right (X) and up/down (right) were created along with their speeds. This was done before on start to make the program recognize that information must be read first because if not, it will dismiss it.
Second, variables X&Y were set to 300 because in the beginning of the program, the ball needs to meet in the middle of the screen. If the canvas is 600, then the ball meets at 300. I assigned the speed for both X&Y at random, but made sure they weren't the same.
After, in order to have the ball change color when user starts project, I RGB to random at 255. In the loop section the ellipse was granted a fill of (r,g,b) and I used the variables ballX and ballY to fill in the values of the ellipse.
Then, to make the ball bounce from the right side to the left side of the canvas, I made an if statement saying if ballX is greater than 600(size of canvas) - 25(half of ellipse) then set speedX equal to -speedX which makes the ball bounce off the corner of canvas. The same logic was applied to Y.
https://editor.p5js.org/cguiran1/sketches/4CAJ8sR5E