A colourful loading spinner for Processing 3.3.7

colourspinner.pde

// A colourful loading spinner.
// By @marcedwards from @bjango.

void setup() {
  size(512, 512, P2D);
  frameRate(30);
  smooth(8);
  noFill();
  strokeWeight(10);
}

void draw() {
  background(0);
  blendMode(SCREEN);

  for (int i = 0; i < 16; i++) {
    drawArc(width / 2, height / 2, i * 24, i + 0,  i + 12, 40, #0000ff);
    drawArc(width / 2, height / 2, i * 24, i + 8,  i + 20, 40, #00ff00);
    drawArc(width / 2, height / 2, i * 24, i + 16, i + 28, 40, #ff0000);
  }
  
  fill(#191030);
  noStroke();
  rect(0, 0, width, height);
}

void drawArc(int x, int y, float radius, int startoffset, int endoffset, int totalframes, color arccol) {
  float a = easeInOutN(timeCycle(totalframes, startoffset), 4);
  float b = easeInOutN(timeCycle(totalframes, endoffset), 5);
  float r = timeCycle(totalframes, 0);

  if (a > b) {
    b++;
  }

  if (frameCount % totalframes > (frameCount + startoffset) % totalframes) {
    a++;
    b++;
  }

  noFill();
  pushMatrix();
  translate(x, y);
  rotate(TAU * 0.75);
  stroke(arccol);
  arc(0, 0, radius, radius,
      a * TAU * 0.7 + r * TAU * 0.3 - 0.2,
      b * TAU * 0.7 + r * TAU * 0.3 + 0.2
      );
  popMatrix();
}

float easeInOutN(float t, float power) {
  return t<0.5 ? 0.5*pow(2*t, power) : 1-0.5*pow(2*(1-t), power);
}

float timeCycle(int totalframes, int offset) {
  return float((frameCount + offset) % totalframes) / float(totalframes);
}