let fft;

let lyrics = [

      "I've been reading books of old",

    "The legends and the myths"," Achilles and his gold",

    "Hercules and his gifts",

    "Spider-Man's control",

    "And Batman with his fists",

    "And clearly I don't see myself upon that list"

​

​

  // Add more lyric lines as needed

];

let currentLyricIndex = 0;

let lyricY = -20; // Initial y-coordinate for displaying lyrics

​

function preload() {

  song = loadSound("sjlt.mp3");

}

​

function setup() {

  createCanvas(400, 400);

  fft = new p5.FFT();

  angleMode(DEGREES);

}

​

function draw() {

  background(0);

  stroke(255);

  noFill();

  translate(width / 2, height / 2);

  var wave = fft.waveform();

  beginShape();

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

    var index = floor(map(i, 0, 180, 0, wave.length - 1));

    var r = map(wave[index], -1, 1, 100, 250);

    var x = r * sin(i);

    var y = r * cos(i);

    vertex(x, y);

  }

  endShape();

  beginShape();

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

    var index = floor(map(i, 0, 180, 0, wave.length - 1));

    var r = map(wave[index], -1, 1, 100, 250);

    var x = -r * sin(i);

    var y = -r * cos(i);

    vertex(x, y);

  }

  endShape();

​

  // Display lyrics

  textSize(16);

  textAlign(CENTER, CENTER);

  fill(255);

  text(lyrics[currentLyricIndex], 0, lyricY);

​

  // Move lyrics downward

  lyricY += 1;

​

  // Check if the current lyric has gone off the bottom

  if (lyricY > height) {

    // Reset lyricY and switch to the next lyric

    lyricY = -20;

    currentLyricIndex = (currentLyricIndex + 1) % lyrics.length;

  }

}

​

function mouseClicked() {

  if (song.isPlaying()) {

    song.pause();

    noLoop();

  } else {

    song.play();

    loop();

  }

}

​