let canvas;

​

function setup() {

  p5Canvas = createCanvas(1080, 1080);

  canvas = p5Canvas.canvas;

  angleMode(DEGREES);

  colorMode(HSB, 360);

  radius = 800;

  n = 3

  bg = color(30, 60, 20);

  frameRate(60);

}

​

function draw() {

  if(frameCount==2) 

    capturer.start();

  background(bg);

  translate(width / 2, height / 2);

  //rotate(frameCount);

  //translate(50, 0);

  stroke(220);

  noFill();

  //shape(800);

  i = -1;

  while (radius * pow(2, -i) > 1) {

    push();

    if (radius * pow(2, -i) < 2500) {

      rotate(frameCount * pow(-1, i));

      shape(radius*pow(2, -i));

    }

    pop();

    rotate(180 / n);

    i++;

  }

  radius *= 1.01

  resetMatrix();

  fill(300, 250);

  stroke(300, 250);

  strokeWeight(1);

  textFont('Nunito', 30);

  text("@URBANOXYGEN_", width - 290, height - 20)

  //noLoop();

  if(frameCount < frameLimit) {

    capturer.capture(canvas);

  } else if(frameCount == frameLimit) {

    capturer.stop();

    capturer.save();

}

​

}

​

function shape(r) {

  rotate(frameCount);

  translate(r/16, 0);

  rotate(-frameCount);

  stroke(r / 4 % 360, 360, 360);

  strokeWeight(r/200);

  ellipse(0, 0, r);

  ellipse(0, 0, 0.75*r);

  n=22;

  for(j=0;j<n;j++) {

    push();

    rotate(360/n*j);

    translate(3.5*r/8, 0);

    arc(0, 0, r/8, r/8, j%2==0? 0:180, j%2==0? 180:0);

    rotate(-frameCount);

    translate(r/64, 0);

    ellipse(0, r/64*pow(-1, j+1), r/32);

    ellipse(0, -r/64*pow(-1, j+1), r/64);

    pop();

  }

}

​

function polygon(x, y, radius, npoints) {

  angleMode(RADIANS);

  let angle = TWO_PI / npoints;

  beginShape();

  for (let a = 0; a < TWO_PI; a += angle) {

    let sx = x + cos(a) * radius;

    let sy = y + sin(a) * radius;

    vertex(sx, sy);

  }

  endShape(CLOSE);

  angleMode(DEGREES);

}