constructor(x,y){

    this.x = x;

    this.y = y;

    this.state = 'sq'

  }

  draw(s){

    if (s == 'cr') {

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

    } else {

      rect(this.x,this.y,40)

    }

  }

  update(s){

    this.state = s;

  }

}

​

let arr = [];

​

function setup() {

  createCanvas(350, 400);

  background(255);

  noFill();

  stroke(0);

  strokeWeight(2);

  rectMode(CENTER);

  for (let x = 25; x < width; x += 50) {

    for (let y = 25; y < height; y += 50) {

      arr.push(new Element(x,y));

    }

  }

}

​

function draw() {

  background(255);

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

    arr[i].draw(arr[i].state);

  }

  noLoop();

}

​

function mouseClicked() {

  let n = floor(random(1,7));

  let picked = [];

  while (picked.length < n) {

    let index = floor(random(arr.length));

    while (picked.includes(index)) {

      index = floor(random(arr.length));

    }

    picked.push(index);

    arr[index].update('cr');

  }

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

    if (!picked.includes(i)) {

      arr[i].update('sq');

    }

  }

  loop();

}