My Sketch

let sound, amplitude;

​

function preload(){

  sound = loadSound('wuhu.mp3');

}

function setup() {

  let cnv = createCanvas(windowWidth,windowHeight);

  cnv.mouseClicked(togglePlay);

  amplitude = new p5.Amplitude();

}

​

function draw() {

  background("black");

​

  let level = amplitude.getLevel();

  let size = map(level, 0, 1, 0, 1000);

  let size2 =map(level, 0, 1, 0, 900);

  let size3 =map(level,0,10,0,2000);

  fill("white");

  rect(0,0, 100000, size3);

  fill("Navy");

  rect(20,50, 50, size,50,50);

  fill('DarkBlue');

  rect(80,50, 50, size2,50,50);

  fill("MediumBlue");

  rect(140,50, 50, size,50,50);

  fill("Blue");

  rect(200,50, 50, size2,50,50);

  fill("MidnightBlue");

  rect(260,50, 50, size,50,50);

  fill("RoyalBlue");

  rect(320,50, 50, size2,50,50);

  fill("SteelBlue");

  rect(380,50, 50, size,50,51);

  fill("DodgerBlue");

  rect(440,50, 50, size2,50,51);

  fill("DeepSkyBlue");

  rect(500,50, 50, size,50,51);

  fill("CornflowerBlue");

  rect(560,50, 50, size2,50,51);

  fill("SkyBlue");

  rect(620,50, 50, size,50,51);

  fill("LightSkyBlue");

  rect(680,50, 50, size2,50,51);

  fill("LightSteelBlue");

  rect(740,50, 50, size,50,51);

  fill("LightBlue");

  rect(800,50, 50, size2,50,51);

  fill("PowderBlue");

  rect(860,50, 50, size,50,51);

  fill("Navy");

  rect(920,50, 50, size2,50,51);

  fill("DarkBlue");

  rect(980,50, 50, size,50,51);

  fill("MediumBlue");

  rect(1040,50, 50, size2,50,51);

  fill("Blue");

  rect(1100,50, 50, size,50,51);

  fill("MidnightBlue");

  rect(1160,50, 50, size2,50,51);

  fill("RoyalBlue");

  rect(1220,50, 50, size,50,51);

  fill("SteelBlue");

  rect(1280,50, 50, size2,50,51);

  fill("DodgerBlue");

  rect(1340,50, 50, size,50,51);

  fill("DeepSkyBlue");

  rect(1400,50, 50, size2,50,51);

​

​

}

​

function togglePlay() {

  if (sound.isPlaying() ){

    sound.pause();

  } else {

    sound.loop();

    amplitude = new p5.Amplitude();

    amplitude.setInput(sound);

  }

}