let balls = [];

​

function setup() {

  createCanvas(400, 400);

​

  //create the balls

  for (let i = 0; i < 10; i++) {

    let x = random(400);

    let y = random(400);

    balls[i] = new Ball(x, y, r);

  }

}

​

function draw() {

  background(220);

​

  for (let b = 0; b < balls.length; b++) {

    balls[b].display();

    balls[b].move();

    let collision = false;

    let toggle = 0;

    let toggleS = 3;

    for (let ob = 0; ob < balls.length; ob++) {

      if (ob != b && balls[b].collide(balls[ob])) {

        collision = true;

      }

      if (collision) {

        // print(toggleS);

        // bounce(toggle, 0, height, toggleS)

        balls[b].colorChange('red');

        collision = !collision

      } else {

        balls[b].colorChange('white');

      }

      // }

      // if (toggle = 1) {

      //   balls[b].colorChange('red');

      // } else if (toggle = 0) {

      //   balls[b].colorChange('white');

      // }

    }

  }

}

​

function bounce(pos, low, high, speed) {

    if (pos < low || pos > high) {

      return speed *= -1;

    } else return speed;

​

  }

​

class Ball {

  constructor(x, y, r) {

    this.x = x;

    this.y = y;

    this.r = r;

    this.xSpeed = random(5);

    this.ySpeed = random(5);

    this.color = 'white';

  }

​

  move() {

    this.x += this.xSpeed;

    this.y += this.ySpeed;

    this.xSpeed = bounce(this.x, 0, width, this.xSpeed);

    this.ySpeed = bounce(this.y, 0, height, this.ySpeed);

  }

​

​

​

  collide(other) {

    let d = dist(this.x, this.y, other.x, other.y);

    return (d < r * 2);

  }

​

  colorChange(c) {

    this.color = c;

  }

​

  display() {

    //noStroke();

    //fill(random(255))

    fill(this.color);

    ellipse(this.x, this.y, this.r * 2);

  }

​

​

​

​

​

}