finiteBreath

let fArray = [];
function setup() {
  createCanvas(windowWidth, windowHeight);
  angleMode(DEGREES);
  fArray.push(new dots(0, 0, 0));
  stroke(255);
}

function draw() {
  translate(width / 2, height / 2);
  background(0, 0, 0, 30);
  t = (width / 2) * sin(frameCount / 10) * sin(frameCount / 100);
  for (let i = 0; i < fArray.length; i++) {
    fArray[i].display();
  }
}

function mousePressed() {
  fArray.push(new dots(mouseX - width / 2, mouseY - height / 2, t));
}

class dots {
  constructor(x, y, t) {
    this.x = x;
    this.y = y;
    this.t = t;
  }
  display() {
    fill(255, 255, 255, 5);
    circle(this.x, this.y, 20);
    circle(this.x, this.y, t);
    circle(this.x, this.y, width / 2 - t);
  }
}

function keyPressed() {
  fArray = [];
  fArray.push(new dots(0, 0, 0));
}