const ELLIPSE_SIZE = 100;
const CANVAS_SIZE = 500;

let x, y, velX, velY;

// Draw an ellipse that travels diagonally from the top left corner of the canvas to the bottom right
function topLeftToBottomRight() {
    x = -50;
    y = -50;
    velX = 5;
    velY = 5;
}

// Draw an ellipse that travels diagonally from the top right corner of the canvas to the bottom left
function topRightToBottomLeft() {
    x = 550;
    y = -50;
    velX = -5;
    velY = 5;
}

// Draw an ellipse that travels vertically from the bottom centre of the canvas to the top centre of the canvas.
function bottomCenterToTopCenter() {
    x = 250;
    y = 550;
    velX = 0;
    velY = -5;
}

function setup() {
    createCanvas(CANVAS_SIZE, CANVAS_SIZE);
    fill(0);
    topLeftToBottomRight();
}

function draw() {
    background(255);
    x += velX;
    y += velY;
    ellipse(x, y, ELLIPSE_SIZE, ELLIPSE_SIZE);
}