let bubbles=[];

​

function setup() {

  createCanvas(400, 400);

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

  let x=random(width);

  let y=random(height);

  let r=random(10,50);

  let b= new Bubble(x,y,r);

  // bubble= new Bubble(x,y,r)

  bubbles.push(b);

  }

}

​

function mousePressed(){

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

  bubbles[i].clicked();

}

}

// function mousePressed(){

//   let r=random(10,50);

//   let b= new Bubble(mouseX,mouseY,r)

//   // bubbles[0]=b;

//   bubbles.push(b);

// }

​

​

function draw() {

  background(0);

  // bubble.move();

  // bubble.show();

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

  bubbles[i].move();

  bubbles[i].show();

}

}

​

​

class Bubble {

  constructor(x,y,r=50){

    this.x=x;

    this.y=y;

    this.r=r;

}

  move(){

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

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

  }

  show(){

    stroke(255);

    strokeWeight(4);  

    noFill(255,10);

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

}

  clicked(){

    let d=dist(mouseX,mouseY,this.x,this.y);

    if(d<this.r){

    console.log("clicked!!")

    }

  }

}