​

function setup() {

  createCanvas(windowWidth, windowHeight);

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

    let b = new Ball(i);

    balls.push(b);

  }

}

​

function draw() {

  background(30);

​

  for (var i = 0; i < balls.length; i++) {

     balls[i].collide();

     balls[i].edges();

     balls[i].move();

     balls[i].show();

  }

}

​

class Ball {

  constructor(index) {

    this.index=index

    this.radius = 50;

    this.pos = createVector(

      random(this.radius, width - this.radius),

      random(this.radius, height - this.radius)

    );

    this.speed=p5.Vector.random2D().mult(2)

  }

  collide(){

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

      var d=dist(this.pos.x, this.pos.y, balls[i].pos.x,balls[i].pos.y)

    if (d<this.radius+balls[i].radius && this.index!==i){

      fill(255,0,0)

      break

    }else{

      fill(255)

    }

    }

  }

  edges(){

    if (this.pos.x<this.radius||this.pos.x>width-this.radius){

  this.speed.x*=-1

  }

  if (this.pos.y<this.radius||this.pos.y>height-this.radius){

    this.speed.y*=-1

  }

  }

  move() {

    this.pos.add(this.speed)

  }

  show() {

    noStroke();

    fill(255);

    ellipse(this.pos.x, this.pos.y, this.radius * 2);

  }

  }

​