let l=[];

function setup() {

   createCanvas(windowWidth, windowHeight);

 x=windowWidth/2,y= windowHeight/2;

}

​

function draw() {

   background(0);

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

  l[i].move(); 

  l[i].draw();

}

}

class ball {

  constructor(tx,ty,txi,txj,tr,tg,tb) {

    this.x = tx;

    this.y = ty;

    this.xi=txi;

    this.xj=txj;

    this.r = tr;

    this.g = tg;

    this.b = tb;

  }

  move(txi,txj){

    if (this.x<50 || this.x>windowWidth-50){this.xi=-this.xi;}

  if (this.y<50 || this.y>windowHeight-50){this.xj=-this.xj;}

  this.x+=this.xi

  this.y+=this.xj  

  }

  draw(){

    stroke(this.r,this.g,this.b);

  strokeWeight(10);

   fill('#07C'); 

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

   }

}

function mouseClicked() {

  b=new ball(mouseX,mouseY,random(2,8),random(2,8),random(0,255),random(0,255),random(0,255));

  l.push(b);

  // prevent default

  return false;

}

​

function windowResized() {

   resizeCanvas(windowWidth, windowHeight);

}