sqr: true,

  tri: true,

  sin: true,

  saw: true,

  attackTime: 0.005,

  decayTime: 0.2,

  sustainPercent: 0.2,

  releaseTime: 0.5,

};

​

let filter, fft;

let triD3, sawD3, sinD3, sqrD3, envD3;

let triA3, sawA3, sinA3, sqrA3, envA3;

let triC4, sawC4, sinC4, sqrC4, envC4;

let triD4, sawD4, sinD4, sqrD4, envD4;

let triE4, sawE4, sinE4, sqrE4, envE4;

let triF4, sawF4, sinF4, sqrF4, envF4;

let triG4, sawG4, sinG4, sqrG4, envG4;

let triA4, sawA4, sinA4, sqrA4, envA4;

let triC5, sawC5, sinC5, sqrC5, envC5;

​

function setup() {

  createCanvas(windowWidth, windowHeight);

​

  // create oscillators

​

  sawD3 = new p5.Oscillator("sawtooth");

  sinD3 = new p5.Oscillator("sine");

  sqrD3 = new p5.Oscillator("square");

  triD3 = new p5.Oscillator("triangle");

​

  sawA3 = new p5.Oscillator("sawtooth");

  sinA3 = new p5.Oscillator("sine");

  sqrA3 = new p5.Oscillator("square");

  triA3 = new p5.Oscillator("triangle");

​

  triC4 = new p5.Oscillator("triangle");

  sawC4 = new p5.Oscillator("sawtooth");

  sinC4 = new p5.Oscillator("sine");

  sqrC4 = new p5.Oscillator("sine");

​

  triD4 = new p5.Oscillator("triangle");

  sawD4 = new p5.Oscillator("sawtooth");

  sinD4 = new p5.Oscillator("sine");

  sqrD4 = new p5.Oscillator("sine");

​

  triE4 = new p5.Oscillator("triangle");

  sawE4 = new p5.Oscillator("sawtooth");

  sinE4 = new p5.Oscillator("sine");

  sqrE4 = new p5.Oscillator("sine");

​

  triF4 = new p5.Oscillator("triangle");

  sawF4 = new p5.Oscillator("sawtooth");

  sinF4 = new p5.Oscillator("sine");

  sqrF4 = new p5.Oscillator("sine");

​

  triG4 = new p5.Oscillator("triangle");

  sawG4 = new p5.Oscillator("sawtooth");

  sinG4 = new p5.Oscillator("sine");

  sqrG4 = new p5.Oscillator("sine");

​

  triA4 = new p5.Oscillator("triangle");

  sawA4 = new p5.Oscillator("sawtooth");

  sinA4 = new p5.Oscillator("sine");

  sqrA4 = new p5.Oscillator("sine");

​

  triC5 = new p5.Oscillator("triangle");

  sawC5 = new p5.Oscillator("sawtooth");

  sinC5 = new p5.Oscillator("sine");

  sqrC5 = new p5.Oscillator("sine");

​

  // create envelopes

​

  envD3 = new p5.Envelope();

  envA3 = new p5.Envelope();

  envC4 = new p5.Envelope();

  envD4 = new p5.Envelope();

  envE4 = new p5.Envelope();

  envF4 = new p5.Envelope();

  envG4 = new p5.Envelope();

  envA4 = new p5.Envelope();

  envC5 = new p5.Envelope();

  setAllASDR();

  // create filter

  filter = new p5.BandPass();

​

  // create FFT

  fft = new p5.FFT();

​

  // start oscillators

  triD3.start();

  sawD3.start();

  sqrD3.start();

  sinD3.start();

​

  sawA3.start();

  sinA3.start();

  sqrA3.start();

  triA3.start();

​

  triC4.start();

  sawC4.start();

  sinC4.start();

  sqrC4.start();

​

  triD4.start();

  sawD4.start();

  sinD4.start();

  sqrD4.start();

​

  triE4.start();

  sawE4.start();

  sinE4.start();

  sqrE4.start();

​

  triF4.start();

  sawF4.start();

  sinF4.start();

  sqrF4.start();

​

  triG4.start();

  sawG4.start();

  sinG4.start();

  sqrG4.start();

​

  triA4.start();

  sawA4.start();

  sinA4.start();

  sqrA4.start();

​

  triC5.start();

  sawC5.start();

  sinC5.start();

  sqrC5.start();

​

  // apply envelope to oscillators

​

  triD3.amp(envD3);

  sawD3.amp(envD3);

  sinD3.amp(envD3);

  sqrD3.amp(envD3);

​

  triA3.amp(envA3);

  sawA3.amp(envA3);

  sinA3.amp(envA3);

  sqrA3.amp(envA3);

​

  triC4.amp(envC4);

  sawC4.amp(envC4);

  sinC4.amp(envC4);

  sqrC4.amp(envC4);

​

  triD4.amp(envD4);

  sawD4.amp(envD4);

  sinD4.amp(envD4);

  sqrD4.amp(envD4);

​

  triE4.amp(envE4);

  sawE4.amp(envE4);

  sinE4.amp(envE4);

  sqrE4.amp(envE4);

​

  triF4.amp(envF4);

  sawF4.amp(envF4);

  sinF4.amp(envF4);

  sqrF4.amp(envF4);

​

  triG4.amp(envG4);

  sawG4.amp(envG4);

  sinG4.amp(envG4);

  sqrG4.amp(envG4);

​

  triA4.amp(envA4);

  sawA4.amp(envA4);

  sinA4.amp(envA4);

  sqrA4.amp(envA4);

​

  triC5.amp(envC5);

  sawC5.amp(envC5);

  sinC5.amp(envC5);

  sqrC5.amp(envC5);

​

  // apply filter to oscillators

​

  triD3.disconnect();

  triD3.connect(filter);

  sawD3.disconnect();

  sawD3.connect(filter);

  sinD3.disconnect();

  sinD3.connect(filter);

  sqrD3.disconnect();

  sqrD3.connect(filter);

​

  triA3.disconnect();

  triA3.connect(filter);

  sawA3.disconnect();

  sawA3.connect(filter);

  sinA3.disconnect();

  sinA3.connect(filter);

  sqrA3.disconnect();

  sqrA3.connect(filter);

​

  triC4.disconnect();

  triC4.connect(filter);

  sawC4.disconnect();

  sawC4.connect(filter);

  sinC4.disconnect();

  sinC4.connect(filter);

  sqrC4.disconnect();

  sqrC4.connect(filter);

​

  triD4.disconnect();

  triD4.connect(filter);

  sawD4.disconnect();

  sawD4.connect(filter);

  sinD4.disconnect();

  sinD4.connect(filter);

  sqrD4.disconnect();

  sqrD4.connect(filter);

​

  triE4.disconnect();

  triE4.connect(filter);

  sawE4.disconnect();

  sawE4.connect(filter);

  sinE4.disconnect();

  sinE4.connect(filter);

  sqrE4.disconnect();

  sqrE4.connect(filter);

​

  triF4.disconnect();

  triF4.connect(filter);

  sawF4.disconnect();

  sawF4.connect(filter);

  sinF4.disconnect();

  sinF4.connect(filter);

  sqrF4.disconnect();

  sqrF4.connect(filter);

​

  triG4.disconnect();

  triG4.connect(filter);

  sawG4.disconnect();

  sawG4.connect(filter);

  sinG4.disconnect();

  sinG4.connect(filter);

  sqrG4.disconnect();

  sqrG4.connect(filter);

​

  triA4.disconnect();

  triA4.connect(filter);

  sawA4.disconnect();

  sawA4.connect(filter);

  sinA4.disconnect();

  sinA4.connect(filter);

  sqrA4.disconnect();

  sqrA4.connect(filter);

​

  triC5.disconnect();

  triC5.connect(filter);

  sawC5.disconnect();

  sawC5.connect(filter);

  sinC5.disconnect();

  sinC5.connect(filter);

  sqrC5.disconnect();

  sqrC5.connect(filter);

}

​

function draw() {

  background(0);

​

  textSize(32);

  fill(255,127,127)

  let i = 0;

  for (let key in state) {

    if (state.hasOwnProperty(key)) {

        value = state[key];

        text(key+": "+value,32,32+32*i++);

    }

}

  // draw FFT spectrum

  let spectrum = fft.analyze();

  noStroke();

  fill(0, 255, 0);

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

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

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

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

  }

}

​

function keyPressed() {

  // set oscillator frequencies based on key press

  if (

    key === "Q" ||

    key === "q" ||

    key === "A" ||

    key === "a" ||

    key === "Z" ||

    key === "z"

  ) {

    if (state.tri) {

      triD3.freq(146.83);

    } else {

      triD3.freq(0);

    }

    if (state.saw) {

      sawD3.freq(146.83);

    } else {

      sawD3.freq(0);

    }

    if (state.sin) {

      sinD3.freq(146.83);

    } else {

      sinD3.freq(0);

    }

    if (state.sqr) {

      sqrD3.freq(146.83);

    } else {

      sqrD3.freq(0);

    }

​

    envD3.play();

  } else if (

    key === "W" ||

    key === "w" ||

    key === "S" ||

    key === "s" ||

    key === "X" ||

    key === "x"

  ) {

    if (state.tri) {

      triA3.freq(220);

    } else {

      triA3.freq(0);

    }

    if (state.saw) {

      sawA3.freq(220);

    } else {

      sawA3.freq(0);

    }

    if (state.sin) {

      sinA3.freq(220);

    } else {

      sinA3.freq(0);

    }

    if (state.sqr) {

      sqrA3.freq(220);

    } else {

      sqrA3.freq(0);

    }

​

    envA3.play();

  } else if (

    key === "E" ||

    key === "e" ||

    key === "D" ||

    key === "d" ||

    key === "C" ||

    key === "c"

  ) {

    if (state.tri) {

      triC4.freq(261.63);

    } else {

      triC4.freq(0);

    }

    if (state.saw) {

      sawC4.freq(261.63);

    } else {

      sawC4.freq(0);

    }

    if (state.sin) {

      sinC4.freq(261.63);

    } else {

      sinC4.freq(0);

    }

    if (state.sqr) {

      sqrC4.freq(261.63);

    } else {

      sqrC4.freq(0);

    }

    envC4.play();

  } else if (

    key === "R" ||

    key === "r" ||

    key === "F" ||

    key === "f" ||

    key === "V" ||

    key === "v"

  ) {

    if (state.tri) {

      triD4.freq(293.66);

    } else {

      triD4.freq(0);

    }

    if (state.saw) {

      sawD4.freq(293.66);

    } else {

      sawD4.freq(0);

    }

    if (state.sin) {

      sinD4.freq(293.66);

    } else {

      sinD4.freq(0);

    }

    if (state.sqr) {

      sqrD4.freq(293.66);

    } else {

      sqrD4.freq(0);

    }

    envD4.play();

  } else if (

    key === "T" ||

    key === "t" ||

    key === "G" ||

    key === "g" ||

    key === "B" ||

    key === "b"

  ) {

    if (state.tri) {

      triE4.freq(329.63);

    } else {

      triE4.freq(0);

    }

    if (state.saw) {

      sawE4.freq(329.63);

    } else {

      sawE4.freq(0);

    }

    if (state.sin) {

      sinE4.freq(329.63);

    } else {

      sinE4.freq(0);

    }

    if (state.sqr) {

      sqrE4.freq(329.63);

    } else {

      sqrE4.freq(0);

    }

    envE4.play();

  } else if (

    key === "Y" ||

    key === "y" ||

    key === "H" ||

    key === "h" ||

    key === "N" ||

    key === "n"

  ) {

    if (state.tri) {

      triF4.freq(349.23);

    } else {

      triF4.freq(0);

    }

    if (state.saw) {

      sawF4.freq(349.23);

    } else {

      sawF4.freq(0);

    }

    if (state.sin) {

      sinF4.freq(349.23);

    } else {

      sinF4.freq(0);

    }

    if (state.sqr) {

      sqrF4.freq(349.23);

    } else {

      sqrF4.freq(0);

    }

    envF4.play();

  } else if (

    key === "U" ||

    key === "u" ||

    key === "J" ||

    key === "j" ||

    key === "M" ||

    key === "m"

  ) {

    if (state.tri) {

      triG4.freq(392);

    } else {

      triG4.freq(0);

    }

    if (state.saw) {

      sawG4.freq(392);

    } else {

      sawG4.freq(0);

    }

    if (state.sin) {

      sinG4.freq(392);

    } else {

      sinG4.freq(0);

    }

    if (state.sqr) {

      sqrG4.freq(392);

    } else {

      sqrG4.freq(0);

    }

    envG4.play();

  } else if (

    key === "I" ||

    key === "i" ||

    key === "K" ||

    key === "k" ||

    key === "<" ||

    key === ","

  ) {

    if (state.tri) {

      triA4.freq(440);

    } else {

      triA4.freq(0);

    }

    if (state.saw) {

      sawA4.freq(440);

    } else {

      sawA4.freq(0);

    }

    if (state.sin) {

      sinA4.freq(440);

    } else {

      sinA4.freq(0);

    }

    if (state.sqr) {

      sqrA4.freq(440);

    } else {

      sqrA4.freq(0);

    }

    envA4.play();

  } else if (

    key === "O" ||

    key === "o" ||

    key === "L" ||

    key === "l" ||

    key === ">" ||

    key === "."

  ) {

    if (state.tri) {

      triC5.freq(523.25);

    } else {

      triC5.freq(0);

    }

    if (state.saw) {

      sawC5.freq(523.25);

    } else {

      sawC5.freq(0);

    }

    if (state.sin) {

      sinC5.freq(523.25);

    } else {

      sinC5.freq(0);

    }

    if (state.sqr) {

      sqrC5.freq(523.25);

    } else {

      sqrC5.freq(0);

    }

    envC5.play();

  }

​

  if (keyCode === UP_ARROW) {

    state.sqr = !state.sqr;

  } else if (keyCode === DOWN_ARROW) {

    state.sin = !state.sin;

  }

  if (keyCode === LEFT_ARROW) {

    state.tri = !state.tri;

  } else if (keyCode === RIGHT_ARROW) {

    state.saw = !state.saw;

  }

  if (key === "1") {

    state.attackTime -= 0.005;

    setAllASDR();

  } else if (key === "2") {

    state.attackTime += 0.005;

    setAllASDR();

  } else if (key === "3") {

    state.decayTime -= 0.05;

    setAllASDR();

  } else if (key === "4") {

    state.decayTime += 0.05;

    setAllASDR();

  } else if (key === "5") {

    state.sustainPercent -= 0.1;

    setAllASDR();

  } else if (key === "6") {

    state.sustainPercent += 0.1;

    setAllASDR();

  } else if (key === "7") {

    state.releaseTime -= 0.1;

    setAllASDR();

  } else if (key === "8") {

    state.releaseTime += 0.1;

    setAllASDR();

  }

  //console.log(state);

}

​

function setAllASDR() {

  //D3

  envD3.setADSR(

    state.attackTime,

    state.decayTime,

    state.sustainPercent,

    state.releaseTime

  );

  envD3.setRange(1, 0);

  //A3

  envA3.setADSR(

    state.attackTime,

    state.decayTime,

    state.sustainPercent,

    state.releaseTime

  );

  envA3.setRange(1, 0);

  //C4

  envC4.setADSR(

    state.attackTime,

    state.decayTime,

    state.sustainPercent,

    state.releaseTime

  );

  envC4.setRange(1, 0);

  //D4

  envD4.setADSR(

    state.attackTime,

    state.decayTime,

    state.sustainPercent,

    state.releaseTime

  );

  envD4.setRange(1, 0);

  //E4

  envE4.setADSR(

    state.attackTime,

    state.decayTime,

    state.sustainPercent,

    state.releaseTime

  );

  envE4.setRange(1, 0);

  //F4

  envF4.setADSR(

    state.attackTime,

    state.decayTime,

    state.sustainPercent,

    state.releaseTime

  );

  envF4.setRange(1, 0);

  //G4

  envG4.setADSR(

    state.attackTime,

    state.decayTime,

    state.sustainPercent,

    state.releaseTime

  );

  envG4.setRange(1, 0);

  //A4

  envA4.setADSR(

    state.attackTime,

    state.decayTime,

    state.sustainPercent,

    state.releaseTime

  );

  envA4.setRange(1, 0);

  //C5

  envC5.setADSR(

    state.attackTime,

    state.decayTime,

    state.sustainPercent,

    state.releaseTime

  );

  envC5.setRange(1, 0);

}

​