4/15 Ex1 - bouncing ball

let ball1, ball2, ball3, ball4, ball5;

​

function setup() {

  createCanvas(windowWidth, windowHeight);

  ball1 = new Ball();

  ball2 = new Ball();

  ball3 = new Ball();

  ball4 = new Ball();

  ball5 = new Ball();

}

​

function draw() {

  background('lightblue');

  ball1.bounce();

  ball1.move();

  ball1.display('brown');

  ball2.bounce();

  ball2.move();

  ball2.display('orange');

  ball3.bounce();

  ball3.move();

  ball3.display('gold');

  ball4.bounce();

  ball4.move();

  ball4.display('yellowgreen');

  ball5.bounce();

  ball5.move();

  ball5.display('pink');

}

​

class Ball {

  constructor() {

    this.x = random(width);

    this.y = random(height);

    this.speedX = 5;

    this.speedY = 5;

  }

  bounce() {

    if (this.x > width || this.x < 0) {

      this.speedX *= -1;

    }

    if (this.y > height || this.y < 0) {

      this.speedY *= -1;

    }

  }

  move() {

    this.x += this.speedX;

    this.y += this.speedY;

  }

  display(c) {

    noStroke();

    fill(color(c));

    ellipse(this.x, this.y, 100, 100);

  }

}