let binaryText = "01010101001101101010010110100101";

let noiseScale = 0.05;

let rotationAngle = 0;

let rotationSpeed = 0.01;

let unravelProgress = 0;

let unravelSpeed = 0.003;

let recording = false;

var capturer = new CCapture({

  format: 'png',

  framerate: 27

});

​

function preload() {

  font = loadFont('CardoneTrial-Regular.otf');

}

​

function setup() {

  createCanvas(700, 700);

  capturer = new CCapture({ format: 'webm', framerate: 27 });

  textFont(font);

  fill(0);

  frameRate(27);

}

​

function draw() {

  background('#F7F7EC');

  // Capture frame if recording

  if (recording) {

    capturer.capture(canvas);

  }

  let centerX = width / 2;

  let centerY = height / 2;

  // Draw the title (unchanged)

  textAlign(CENTER, CENTER);

  textSize(70);

  fill(0);

  text("aura", centerX, centerY);

  // Parameters for the spiral

  let numLoops = 10;

  let baseRadius = 100;

  let minTextSize = 8;   // Starting text size

  let maxTextSize = 22;  // Maximum text size

  // Calculate current unravel state

  let currentLoop = floor(unravelProgress * numLoops);

  let loopFraction = (unravelProgress * numLoops) % 1;

  // Draw circles with rotation

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

    let radius = baseRadius + i * 20;

    let numPoints = floor(TWO_PI * radius / 15);

    let currentTextSize = map(i, 0, numLoops - 1, minTextSize, maxTextSize);

    textSize(currentTextSize);

    // Apply the current rotation angle

    let angleOffset = rotationAngle + (i * PI / 8);

    // For loops that are complete

    if (i < currentLoop) {

      drawCompleteCircle(centerX, centerY, radius, numPoints, angleOffset, currentTextSize);

    } 

    // For the loop currently being unraveled

    else if (i === currentLoop) {

      drawPartialCircle(centerX, centerY, radius, numPoints, angleOffset, loopFraction, currentTextSize);

    }

    // Don't draw loops that haven't started unraveling yet

  }

  // Update animation states

  rotationAngle += rotationSpeed;

  unravelProgress += unravelSpeed;

  // Reset the unravel progress when complete

  if (unravelProgress >= numLoops) {

    unravelProgress = 0;

  }

}

​

// This function needs to be OUTSIDE the draw function

function keyPressed() {

  if (key === 'S' || key === 's') {

    console.log("Starting recording...");

    recording = true;

    capturer.start();

  }

  if (key === 'E' || key === 'e') {

    console.log("Ending recording...");

    recording = false;

    capturer.stop();

    capturer.save();

  }

}

​

function drawCompleteCircle(centerX, centerY, radius, numPoints, angleOffset, textSize) {

  fill(0);

  let binaryIndex = 0;

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

    let angle = map(j, 0, numPoints, 0, TWO_PI) + angleOffset;

    let x = centerX + cos(angle) * radius + noise(j * noiseScale) * 20;

    let y = centerY + sin(angle) * radius + noise(j * noiseScale + 1000) * 20;

    let char = binaryText[binaryIndex % binaryText.length];

    binaryIndex++;

    text(char, x, y);

  }

}

​

function drawPartialCircle(centerX, centerY, radius, numPoints, angleOffset, fraction, textSize) {

  fill(0);

  let binaryIndex = 0;

  let pointsToDraw = ceil(numPoints * fraction);

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

    let angle = map(j, 0, numPoints, 0, TWO_PI) + angleOffset;

    let x = centerX + cos(angle) * radius + noise(j * noiseScale) * 20;

    let y = centerY + sin(angle) * radius + noise(j * noiseScale + 1000) * 20;

    let char = binaryText[binaryIndex % binaryText.length];

    binaryIndex++;

    text(char, x, y);

  }

}