​

var bubbles = [];

var checkBubbles = false;

​

function setup() {

  createCanvas(600, 400);

}

​

function draw() {

  background(0);

​

  noStroke();

  fill(10, 45, 255);

  ellipse(width / 2, height / 2, 300, 300);

​

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

    bubbles[i].move();

    bubbles[i].show();

    bubbles[i].update();

  }

}

​

function mousePressed() {

  let d = dist(width / 2, height / 2, mouseX, mouseY);

  if (d < 120) {

    this.checkBubbles = true;

    bubbles.push(new Bubble(mouseX, mouseY, 10));

  }

}

​

class Bubble {

​

  constructor(x, y, r) {

    this.x = x;

    this.y = y;

    this.r = r;

    this.speed = 0;

    this.lifespan = 255;

    this.bye = false;

  }

​

  move() {

    this.x = this.x + random(-1, 1);

    this.y = this.y + random(-1, 1);

  }

​

  show() {

    stroke(255);

    strokeWeight(1);

    noFill();

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

  }

​

  update() {

    let i = 0;

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

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

    this.lifespan--;

    if (this.lifespan < 0) {

      bubbles.splice(i, 1);

    }

  }

​

​

  goodBye() {

    if (this.lifespan < 0) {

      return true;

    } else {

      return false;

    }

  }

​

  /*

    update(){

      this.y = this.y + this.speed;

      if (this.y >= (height-this.lifespan/ 2)) {

      this.speed = this.speed * (-0.95);

      }

      this.lifespan--;

    }

    goodBye(){

      if (this.lifespan <= 0) {

        this.bye = true;

      }

      return this.bye;

    }

    */

}