// A basic visualization of sound level over time

//

// For a scrolling version, see:

// https://editor.p5js.org/jonfroehlich/sketches/PcJI-xu-R

// 

// By Professor Jon E. Froehlich

// https://jonfroehlich.github.io/

// http://makeabilitylab.cs.washington.edu

//

​

let mic;

let currentXPos = 0;

​

function setup() {

  createCanvas(600, 400);

  // Gets a reference to computer's microphone

  // https://p5js.org/reference/#/p5.AudioIn

  mic = new p5.AudioIn();

​

  // Start processing audio input

  // https://p5js.org/reference/#/p5.AudioIn/start

  mic.start();

  // Draw background once

  background(100);

  // Set stroke color

  stroke(255);

}

​

function draw() {

​

  // Get current microphone level (between 0 and 1)

  // See: https://p5js.org/reference/#/p5.AudioIn/getLevel

  let micLevel = mic.getLevel(); // between 0 and 1

  // Check if current x position is off graph; if so. Clear!

  if(currentXPos > width || currentXPos == 0){

    currentXPos = 0;

    background(100);

  }

​

  const yStart = height;

  const yLineHeight = micLevel * height;

  const yEnd = yStart - yLineHeight;

  line(currentXPos, yStart, currentXPos, yEnd);

  currentXPos++;

}