Bouncing Ball with Objects

let colourList = ['red',

                  'yellow', 

                  'blue', 

                  'green', 

                  'pink', 

                  'purple', 

                  'indigo']

let count = 0;

​

function setup() {

  createCanvas(windowWidth, windowHeight);

​

  ball = {

    x: width / 2,

    y: height / 2,

    diameter: 50,

    speedX: 5,

    speedY: 5

  }

}

​

function draw() {

  background("grey");

  drawBall();

  moveBall();

  countNumber();

}

​

function countNumber() {

  textSize(20)

  text(`Number of bounces: ${count}`, 20, 30);

}

​

function drawBall() {

  circle(ball.x, ball.y, ball.diameter)

}

​

function moveBall() {

  ball.x += ball.speedX;

  ball.y += ball.speedY;

​

  if (ballOutOfBoundsX()) {

    fill(random(colourList))

    ball.speedX = -ball.speedX;

    count += 1

  }

​

  if (ballOutOfBoundsY()) {

    fill(random(colourList))

    ball.speedY = -ball.speedY;

    count += 1

  }

}

​

function ballOutOfBoundsX() {

  return ((ball.x + 25) > width || (ball.x - 25) <= 0);

}

​

function ballOutOfBoundsY() {

  return ((ball.y + 25) > height || (ball.y - 25) <= 0);

}