let mic, recorder, soundFile;

let state = 0;

​

function setup() {

  let cnv = createCanvas(300, 300);

  cnv.mousePressed(canvasPressed);

  background(220);

  textAlign(CENTER, CENTER);

  // Create an audio in

  mic = new p5.AudioIn();

​

  // Prompts the user to enable their browser mic.

  mic.start();

  // Create a sound recorder.

  recorder = new p5.SoundRecorder();

  // Connect the mic to the recorder

  recorder.setInput(mic);

  // This sound file will be used to 

  // play back and save the recording

  soundFile = new p5.SoundFile();

  text("tap to record", width / 2, height / 2);

}

​

function canvasPressed() {

  // ensure audio is enabled

  userStartAudio();

​

  // make sure user enabled the mic

  if (state === 0 && mic.enabled) {

​

    // record to our p5.SoundFile

    recorder.record(soundFile);

​

    background(255,0,0);

    text('Recording!', width/2, height/2);

    state++;

  }

  else if (state === 1) {

    background(0,255,0);

​

    // stop recorder and

    // send result to soundFile

    recorder.stop();

​

    text('Done! Tap to play and download', width/2, height/2, width - 20);

    state++;

  }

​

  else if (state === 2) {

    soundFile.play(); // play the result!

    // save(soundFile, 'mySound.wav');

    state++;

  }

}

​

function keyPressed(){

  if (["1", "2", "3"].includes(key)){

    canvasPressed();

  }

}

​

// function draw() {

//   background(0);

//   fill(255);

//   text("tap to start", width / 2, 20);

//   micLevel = mic.getLevel();

//   let y = height - micLevel * height;

//   let d = map(micLevel, 0, 1, 10, 300);

//   circle(width / 2, y, d);

// }