let fft;

​

function preload() {

  song = loadSound('we_wish_you_a_merry_christmas.mp3')

}

​

function setup() {

  createCanvas(windowWidth, windowHeight);

  fft = new p5.FFT() // analyzes sound and returns an array of values

}

​

function draw() {

  background(0);

  stroke(255);

  noFill();

  let wave = fft.waveform() // making the data to be displayed in a wave form

  beginShape()

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

    let index = floor(map(i, 0, width, 0, wave.length)) // mapping the index values to the 1024 values of the waveform data. using floor to ensure all of the values are integers

    let x = i

    let y = wave[index] * 100 + height / 2 // values can be changed to play with the volume of the waves on the screen

    vertex(x, y)

  }

  endShape()

}

​

​

function mouseClicked() {

  if (song.isPlaying()) { 

    song.pause()

    noLoop()

  } else {

    song.play()

    loop()

  }  

}