You are tasked with creating an interactive bouncing box animation. The box should move within a canvas, changing its direction and color when it hits the edges.
Canvas and Animation
The canvas dimensions should be 500px wide and 300px tall and the box dimensions should be 50px wide and 50px tall. The box should move smoothly within the canvas and bounce back when it hits any edge. Set the x and y coordinate changes to be 5px.
Dynamic Color Change
The box should change its color whenever it hits an edge. Use the colors Deep Sky Blue, Tomato, Lime Green, and Gold in order.
The animation must run continuously, with smooth frame transitions. Use the appropriate methods to achieve the same.
Here is what the final animation will look like
