Make a Ball

// Declare CONSTANT_VARIABLES
var BALL_SIZE = 20; // Width and Height are same for a Circle
// Declare operatorVariables
var ballPositionX = 140;
var ballPositionY = 100;

draw = function(){
size(400, 400);
background(0);
/** Position Circle using Variables */
ellipse(ballPositionX, ballPositionY, BALL_SIZE, BALL_SIZE);

};

Make a Ball Move

// Declare CONSTANT_VARIABLES
var BALL_SIZE = 20;
// Declare operatorVariables
var ballPositionX = 0; 
var ballPositionY = 200;

draw = function(){  // Begin Draw Loop
background(0); // Clear the screen Black

// Draw the Ball
ellipse(ballPositionX, ballPositionY, BALL_SIZE, BALL_SIZE);
    
/** Update Ball Position for next pass through Draw Loop */
    ballPositionX += 1; // Add 1 to Ball X Position

}; // End Draw Loop

Notice it only goes across the screen once. (refreash the screen to see it)
I also am going to declare a new variable 
called Ball size (var BALL_SIZE = 20;)

Make a Ball Bounce

// Declare CONSTANT_VARIABLES
var BALL_SIZE = 20;
var BALL_SPEED = 2; // Declare Variable for Ball Speed 

// Declare operatorVariables
var ballPositionX = 0; 
var ballPositionY = 200;

draw = function(){  // Begin Draw Loop
background(0); // Clear the screen Black

// Draw the Ball
ellipse(ballPositionX, ballPositionY, BALL_SIZE, BALL_SIZE);

    // Add BALL_SPEED to Ball X
    ballPositionX += BALL_SPEED; 

    // Our Screen is 400 Pixels wide
    if(ballPositionX > 400){ // If the Ball goes too far...
        BALL_SPEED = BALL_SPEED * -1; // Reverse Direction
    }
/** Multiplying by -1 makes a Positive Number Negative ;) */

}; // End Draw Loop

Make a Ball Bounce off BOTH edges

// Declare CONSTANT_VARIABLES
var BALL_SIZE = 20;
var BALL_SPEED = 2; // Declare Variable for Ball Speed 

// Declare operatorVariables
var ballDirectionX = "right";
var ballPositionX = 40; 
var ballPositionY = 200;

draw = function(){  // Begin Draw Loop
background(0); // Clear the screen Black

// Draw the Ball
ellipse(ballPositionX, ballPositionY, BALL_SIZE, BALL_SIZE);

    /** If it hits the Right side of Screen */
    if(ballPositionX > 399 - BALL_SIZE / 2){ 
        ballDirectionX = "left"; // Reverse Direction
    }
    /** If it hits the Left side of Screen */
    if(ballPositionX < BALL_SIZE / 2){ 
        ballDirectionX = "right"; // Forward Direction
    }
    
    // Add BALL_SPEED to Ball Position X
    if(ballDirectionX === "right"){    
    ballPositionX += BALL_SPEED; 
    }
    // Subtract Ball Speed from Ball Position X
    if(ballDirectionX === "left"){
        ballPositionX -= BALL_SPEED; 
    }

}; // End Draw Loop

/* Tutorials in plain English by Dillinger © 2013 
All code is owned by its respective author 
and made available under an MIT license:
http://opensource.org/licenses/mit-license.php */
Back to Mr. G Javascript Tutorial