framecount=1;

​

function setup() {

  createCanvas(1200, 1000);

}

​

function draw() {

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

    balls[i].update();

    balls[i].render();

    if (balls[i].ballisFinished()) {

      balls.splice(i, .1);

    }

  }

}

​

function mousePressed() {

push();

  if (mouseY < height) {

    for (var i = 0; i < width; i++) {

      balls.push(new Ball((mouseX + random(-10, 10)), mouseY + random(-10, 10)));

    }

    fill(framecount,100,100,100);

  }

  pop();

}

​

class Ball {

  constructor(x, y) {

    this.x = x;

    this.y = y;

    this.speed = 2;

    this.gravity = 0.1;

    this.diameter = (dist(x, y, mouseX, mouseY)) * 2;

​

    this.ax = random(-this.speed, this.speed);

    this.ay = random(-this.speed, this.speed);

​

    this.colour = random(['#FEDA25', '#FEA925', '#FFFA69', '#FF6F2B', '#DE5949', '#FFBFB4', '#FCD347']);

  }

​

  update() {

    this.diameter = this.diameter - 0.15;

    this.x += this.ax / 2;

    this.y += this.ay / 2;

​

    this.x += random(-this.speed / 2, this.speed / 2);

    this.y += random(-this.speed / 2, this.speed / 2);

  }

​

  ballisFinished() {

    if (this.diameter < 0) {

      return true;

    }

  }

​

  render() {

    //print(this.colour);

    noStroke();

    if (this.diameter > 0) {

      fill(this.colour);

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

    }

​

  }

}