quantum donut

const size = 600;

const sketch = {

  fps: 30, // frames per second

  fpp: () => sketch.fps * sketch.duration, // frames per period

  duration: 10 // seconds

};

​

let clk, scale, rows, cols;

​

function setup() {

  createCanvas(size, size);

  colorMode(HSB, 360, 100, 100);

  frameRate(sketch.fps);

  clk = new PeriodicFrameClock(sketch.fpp());

  scale = size / 25;

  rows = int(height / scale) + 1;

  cols = int(width / scale) + 1;

}

​

function draw() {

  background(300, 100, 5);

  noFill();

  noStroke();

  push();

  rectMode(CENTER);

  translate(scale * 0.33 / 2, 0);

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

    for (let j = 0; j < rows; j++) {

      const x = i * scale;

      const y = j * scale;

      push();

      translate(x, y);

      const d0 = map(dist(x, y, width / 2, height / 2), 0, size / 2, 0, 1);

      const d1 = map(dist(x, y, 0, 0), 0, size, 0, 1);

      rotate(-TAU * d0);

      let w = 2;

      let h = map(

        pow(clk.tan(clk.time(2) - d0), 3),

        -1, 1,

        scale * 0.67, scale);

      let a = clk.cos(clk.time() - (d0/2)) * 0.9;

      h = h * a;

      // fill(map(d2, 0, 1, 280, 320), 11, 95, a);

      fill(map(sin(d1), -1, 1, 280, 320), 100, 95, a);

      rect(0, 0, w, h);

      pop();

    }

  }

  pop();

​

}