deltoid

const bgCol = "#447abd";
const gCol = "#a2c2e8";
const nGrid = 20;
let w;
let gSpace;

function setup() {
  w = max(400, min(windowWidth, windowHeight) * 0.9);
  gSpace = (w / nGrid) * 0.95;
  describe(
    "5 deltoids being drawn by 5 rotating circles inside one larger cirlce on a blueprint design"
  );
  createCanvas(w, w);
  rectMode(CENTER);

  angleMode(DEGREES);
  textSize(16);
  r1 = 5.5;
  r2 = 8;
  r3 = r2 - r1;
}

function draw() {
  background(bgCol);
  translate(w / 2, w / 2);
  drawGrid();
  t = frameCount;
  stroke(gCol);
  strokeWeight(1);
  push();
  circle(0, 0, gSpace * 16);
  n = 5;
  for (let i = 0; i < n; i++) {
    deltoid(5.5, 8, (360 / n) * i);
  }

  pop();
  noStroke();
  fill(gCol);
  text("deltoid", -w / 2 + 10, w / 2 - 5);
}
function deltoid(r1, r2, rot) {
  r3 = r2 - r1;
  push();
  rotate(rot);
  stroke(gCol);
  strokeWeight(1);

  circle(gSpace * r1 * cos(-t), gSpace * r1 * sin(-t), gSpace * r3 * 2);
  circle(gSpace * r1 * cos(-t), gSpace * r1 * sin(-t), 2);
  line(
    gSpace * r1 * cos(-t),
    gSpace * r1 * sin(-t),
    gSpace * r1 * cos(-t) + r3 * gSpace * cos(2 * t),
    gSpace * r1 * sin(-t) + r3 * gSpace * sin(2 * t)
  );
  stroke(255);
  strokeWeight(2);
  beginShape();
  for (let i = 0; i < int(t % 360); i++) {
    vertex(
      gSpace * r1 * cos(-i) + r3 * gSpace * cos(2 * i),
      gSpace * r1 * sin(-i) + r3 * gSpace * sin(2 * i)
    );
  }
  endShape();

  pop();
}
function tang(t) {
  for (let i = 0; i < nV; i++) {
    let theta1 = (360 / nV) * i;
    let theta2 = (360 / nV) * (i + 1);
    x1 = r * cos(theta1);
    y1 = r * sin(theta1);
    x2 = r * cos(theta2);
    y2 = r * sin(theta2);
    line(x1, y1, x2, y2);
    r3 = dist(
      r * cos(theta1),
      r * sin(theta1),
      0.9 * r * cos(theta1),
      0.9 * r * sin(theta1)
    );
    dx = r * mul[nV - 3] * cos(theta2) - r * mul[nV - 3] * cos(theta1);
    dy = r * mul[nV - 3] * sin(theta2) - r * mul[nV - 3] * sin(theta1);
    nn = 3;
    for (let j = 0; j < nn; j++) {
      x = x1 * mul[nV - 3] + dx * abs(sin((t + (360 / nn) * j) % 90));
      y = y1 * mul[nV - 3] + dy * abs(sin((t + (360 / nn) * j) % 90));
      push();
      translate(x, y);
      strokeWeight(1);
      circle(0, 0, r3);
      push();
      strokeWeight(0.5);
      rotate(-10 * t);
      ns = 5;
      for (let k = 0; k < ns; k++) {
        line(
          (r3 / 2) * cos((k * 180) / ns),
          (r3 / 2) * sin((k * 180) / ns),
          (-r3 / 2) * cos((k * 360) / ns),
          (-r3 / 2) * sin((k * 360) / ns)
        );
      }
      pop();


      pop();
    }
    h = 0.78;
    strokeWeight(1);
    x1 = r * h * cos(theta1);
    y1 = r * h * sin(theta1);
    x2 = r * h * cos(theta2);
    y2 = r * h * sin(theta2);
    line(x1, y1, x2, y2);
    strokeWeight(3);
    circle(0, 0, h * r);
    circle(0, 0, (h * r) / 2);
    ns = 50;
    push();
    rotate(t / 10);
    for (let k = 0; k < ns; k++) {
      strokeWeight(1);
      line(
        ((h * r) / 2) * cos((360 / ns) * k),
        ((h * r) / 2) * sin((360 / ns) * k),
        ((h * r) / 2) * cos((360 / ns) * k + 120),
        ((h * r) / 2) * sin((360 / ns) * k + 120)
      );
    }
    pop();
    push();
    stroke(gCol);
    strokeWeight(0.5);
    circle(x1, y1, r * 2);
    circle(0, 0, r * 2);
    pop();
  }
}

function drawGrid() {
  gSpace = (w / nGrid) * 0.95;
  stroke(gCol);
  strokeWeight(0.3);
  for (let i = 1; i <= nGrid; i++) {
    for (let j = 1; j <= nGrid; j++) {
      line(
        -w / 2 + gSpace * i,
        -w / 2 + gSpace,
        -w / 2 + gSpace * i,
        w / 2 - gSpace
      );
      line(
        -w / 2 + gSpace,
        -w / 2 + gSpace * i,
        w / 2 - gSpace,
        -w / 2 + gSpace * i
      );
    }
  }
  noFill();
  strokeWeight(3);
  rect(0, 0, w - 2 * gSpace);
}

function mousePressed() {
  setup();
  draw();
}
function windowResized() {
  setup();
  draw();
}