let bubble2;

let bubble3;

​

class Bubble {

    constructor(){

    this.x = random(600);

    this.y = random(400);

    this.speed = 3;

    this.size = 1.25

  }

  move(){ 

  if (this.y > height){

    this.size = this.size * 1.25  

     this.speed = this.speed * 1.01 * -1

   }

  if (this.y < 0){

    this.size = this.size * 1.25  

    this.speed = this.speed * 1.01 * -1

  }

    this.y += this.speed 

    if (this.size >= 600){

    this.size = 1.25}

  }

  show(){

    stroke(255-r, 255-b, 255-g);

    strokeWeight(5);

    fill(r, g, b); 

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

  }

}

​

function setup() {

  createCanvas(600, 400);

  bubble1 = new Bubble();

  bubble2 = new Bubble();

  bubble3 = new Bubble();

  r = random(255);

  g = random(255);

  b = random(255);

}

​

function draw(){

  background(0)

  bubble1.move()

  bubble1.show();

  bubble2.move()

  bubble2.show();

  bubble3.move()

  bubble3.show()

}

​

function mousePressed() {

  // Check if mouse is inside the circle

  let d = dist(mouseX, mouseY, 360, 200);

  if (d < 100) {

    // Pick new random color values

    r = random(255);

    g = random(255);

    b = random(255);

  }

}

​

​

​

​