There are several errors in your code:
- You're initializing variables outside of a function, always use an initializer (immediately invoked function) for that.
- As mentioned by kalley you are creating a new ball at the starting position for every draw instead of using a global object.
- Even if your ball would draw correctly it would be outside the drawing area within the next frame because Date.now() is measured in seconds (use .getMilliseconds()).
- Lastly the ball stays at the same position because the canvas isn't cleaned up after each draw.
what you're looking for:
function draw() {
ctx.clearRect(0, 0, canvas.width, canvas.height);
theBall.draw();
}
There are several other things but this fiddle should do for now.