//record button reference: https://p5js.org/examples/dom-input-and-button.html

​

let camera;

let xScale;

let yScale;

var mic;

let speed = 0.02;

let speed2 = 0.7;

var recorder, soundFile;

var state = 0;

let button;

​

​

function setup() {

  createCanvas(windowWidth, windowHeight);

  camera = createCapture(VIDEO);

  camera.size(40, 30);

  camera.hide();

  mic = new p5.AudioIn()

  mic.start();

  fft = new p5.FFT();

  xScale = width / camera.width;

  yScale = height / camera.height;

  nScale = width / camera.width;

  recorder = new p5.SoundRecorder();

  recorder.setInput(mic);

  soundFile = new p5.SoundFile();

  button = createButton('Record');

  button.position(width - 80, 20);

  button.mousePressed('playbutton');

}

​

function playbutton() {

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

    recorder.record(soundFile);

    state++;

  } else if (state === 1) {

    recorder.stop();

    state++;

  } else if (state === 2) {

    soundFile.play();

    save(soundFile, 'mySound.wav');

    state++;

  }

}

​

function draw() {

  background(random(0, 300));

  camera.loadPixels();

  micLevel = mic.getLevel();

  SR = sampleRate();

  print(micLevel);

  // playbutton();

  fft.setInput(mic);

  var spectrum = fft.analyze();

  noStroke();

  fill(0, 255, 0);

  for (var i = 0; i < spectrum.length; i++) {

    var x = map(i, 0, spectrum.length, 0, width);

    var h = -height + map(spectrum[i], 0, 255, height, 0);

    rect(x, height, width / spectrum.length, h)

  }

​

  var waveform = fft.waveform();

  fill(micLevel * 100 / 4);

  beginShape();

  stroke(255, 0, 0);

  strokeWeight(random(1, 100));

​

  for (var i = 0; i < waveform.length; i++) {

    var x = map(i, 0, waveform.length, 0, width);

    var y = map(waveform[i], -1, 1, 0, height);

    vertex(x, y);

  }

  endShape();

​

  for (let y = 0; y < camera.height; y++) {

    for (let x = camera.width; x >= 0; x--) {

      let i = (x + y * camera.width) * 4;

      let r = (camera.pixels[i + 100]);

      let g = camera.pixels[i + 12];

      let b = camera.pixels[i + 10];

​

      if (g >= 15 || g <= 2) {

        g = 40 + 1;

      }

​

      colorMode(HSB, map(200 + micLevel * 40, 200 - micLevel * 10, height, 100, 600));

      strokeWeight(3);

      textSize(40);

      text('Volume :  ' + micLevel, 40, 30);

      text('Sample Rate :  ' + SR, 40, 90);

      noStroke();

      fill(micLevel * 800, g, b);

​

      let avg = (r + g + b) / 3;

      if (avg <= 35) {

        stroke(0, random(10, 40 * micLevel));

        yScale += random(-speed2, speed2);

        nScale = constrain(nScale, nScale - 0.8, nScale + 0.8);

      }

​

      if (keyIsPressed === true) {

        if (micLevel > 0.000100)

          blendMode(EXCLUSION);

        if (micLevel > 0.00100)

          blendMode(DIFFERENCE);

        if (micLevel > 0.00800)

          blendMode(DODGE);

        if (micLevel > 0.0500)

          blendMode(MULTIPLY);

      } else {

        blendMode(BLEND);

      }

​

      if (avg >= 128) {

        if (micLevel >= 0.0100) {

          nScale += random(-speed, speed);

          yScale += random(-speed, speed);

        } else {

          yScale = height / camera.height;

        }

​

        //  if (yScale < 20 ) {

        //  yScale = height / camera.height;

        // }

​

        if (micLevel >= 0.080) {

          stroke(random(40, 100), random(40, 100));

          nScale = nScale + 0.005;

          //yScale = height / camera.height;

        } else {

          nScale = width / camera.width;

        }

      }

      ellipse((camera.width - x - 1) * nScale, y * yScale + 5, nScale + 10, yScale);

    }

  }

  camera.updatePixels();

}