createCanvas(800, 800);

​

  circles = []

  class Circle {

    constructor() {

      this.pos = createVector(random(width), random(height));

      this.vel = createVector(random(8) - 4, random(10) - 5);

      this.r = 20 + random(50);

    }    

    show() {

      strokeWeight(5);

      fill(255);

      stroke(0);

      circle(this.pos.x, this.pos.y, this.r);

    }

    move() {

      this.pos.add(this.vel)

      if (this.pos.x > width - this.r/2) {

        this.pos.x = width - this.r/2;

        this.vel.x = this.vel.x *= -1;

      }

      else if (this.pos.x < this.r/2) {

        this.pos.x = this.r/2;

        this.vel.x = this.vel.x *= -1

      }

      if (this.pos.y > height - this.r/2) {

        this.pos.y = height - this.r/2;

        this.vel.y = this.vel.y *= -1;

      }

      else if (this.pos.y < this.r/2) {

        this.pos.y = this.r/2;

        this.vel.y = this.vel.y *= -1

      }

    }

//    circles.push(Circle);

  }

  circA = new Circle();

  circB = new Circle();

} // setup

​

function draw() {

  background(120);

  circA.show();

  circA.move();

  circB.move();

  circB.show();

  collision();

}

​

function mouseClicked(){

  setup()

}

​

function coll(_a, _b) {

  ax = _a.pos.x;

  ay = _a.pos.y;

  bx = _b.pos.x;

  by = _b.pos.y;

​

  this.a = abs(ax - bx);

  this.b = abs(ay - by);

​

  this.c = sqrt((a * a) + (b * b))

​

  this.d = _a.r/2 + _b.r/2

  return (c < d)

}

​

function collision() {

  if (coll(circA, circB)) {

    circA.vel.x *= -1;

    circA.vel.y *= -1;

​

    circB.vel.x *= -1;

    circB.vel.y *= -1;

  }

}