let now = Tone.now();

​

let instructText = "Use the dropdowns to select Key (A-G#), Octave, and Scale / Mode"+'\n'+"Press highlighted boxes to play in that key and scale"

let keys = [];

let amount = 0;

let octaves = ["0", "1", "2", "3", "4", "5", "6", "7", "8"];

let notes = ["C", "C#", "D", "D#", "E", "F", "F#", "G", "G#", "A", "A#", "B"];

let baseNotes = [

  "C",

  "C#",

  "D",

  "D#",

  "E",

  "F",

  "F#",

  "G",

  "G#",

  "A",

  "A#",

  "B",

];

​

let intervals = [

  [0, 2, 4, 7, 9],

  [0, 3, 5, 7, 10],

  [0, 2, 4, 5, 7, 9, 11],

  [0, 2, 4, 5, 7, 9, 10],

  [0, 2, 3, 5, 7, 8, 10],

  [0, 2, 3, 5, 7, 8, 11],

  [0, 3, 5, 6, 7, 10],

  [0, 2, 3, 4, 7, 9],

  [0, 3, 5, 6, 7, 10],

  [0, 2, 5, 7, 8],

  [0, 2, 3, 5, 7, 9, 10],

  [0, 1, 3, 5, 7, 8, 10],

  [0, 1, 4, 5, 7, 8, 10],

  [0, 2, 4, 6, 7, 9, 11],

  [0, 2, 4, 6, 7, 9, 10],

  [0, 2, 3, 4, 5, 7, 8, 9, 10, 11],

  [0, 2, 4, 5, 7, 8, 11],

  [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11],

  [0, 2, 4, 6, 8, 10],

  [0, 1, 3, 5, 6, 8, 10],

  [0, 2, 3, 5, 7, 9, 11],

  [0, 1, 3, 4, 6, 8, 10],

  [0, 2, 3, 5, 6, 8, 9, 11],

  [0, 1, 3, 4, 6, 7, 9, 10],

];

​

let keyMap = ["a","w","s","e","d","f","t","g","y","h","u","j"]

​

let modeSelect;

let keySelect;

let octaveSelect;

let fnt = 20;

let instructions;

let canvas;

​

function setup() {

  modeSelect = createSelect("Mode / Mood");

  keySelect = createSelect("Key");

  octaveSelect = createSelect("Octave");

​

  keySelect.position(10, 10);

  keySelect.option("C", 0);

  keySelect.option("C#", 1);

  keySelect.option("D", 2);

  keySelect.option("D#", 3);

  keySelect.option("E", 4);

  keySelect.option("F", 5);

  keySelect.option("F#", 6);

  keySelect.option("G", 7);

  keySelect.option("G#", 8);

  keySelect.option("A", 9);

  keySelect.option("A#", 10);

  keySelect.option("B", 11);

​

  modeSelect.position(140, 10);

  modeSelect.option("--Mainstream--");

  modeSelect.disable("--Mainstream--");

  modeSelect.option("Major Pentatonic", 0);

  modeSelect.option("Minor Pentatonic", 1);

  modeSelect.option("Major", 2);

  modeSelect.option("Mixolydian", 3);

  modeSelect.option("Natural Minor", 4);

  modeSelect.option("Harmonic Minor", 5);

​

  modeSelect.option("--Blues--");

  modeSelect.disable("--Blues--");

  modeSelect.option("Blues (Chords)", 6);

  modeSelect.option("Major Blues", 7);

  modeSelect.option("Blues (Scale)", 8);

  modeSelect.option("Kansas City Blues", 9);

​

  modeSelect.option("--Hip/Jazzy--");

  modeSelect.disable("--Hip/Jazzy--");

  modeSelect.option("Dorian", 10);

  modeSelect.option("Phrygian", 11);

  modeSelect.option("Phrygian Dominant", 12);

  modeSelect.option("Lydian", 13);

  modeSelect.option("Lydian Dominant", 14);

  modeSelect.option("Supermode", 15);

  modeSelect.option("Harmonic Major", 16);

​

  modeSelect.option("--Weird--");

  modeSelect.disable("--Weird--");

  modeSelect.option("Chromatic", 17);

  modeSelect.option("Whole Tone", 18);

  modeSelect.option("Locrian", 19);

  modeSelect.option("Melodic Minor", 20);

  modeSelect.option("Altered", 21);

  modeSelect.option("Octatonic", 22);

  modeSelect.option("Diminished", 23);

​

  octaveSelect.position(55, 10);

  octaveSelect.option("--Octave--");

​

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

    octaveSelect.option(octaves[i]);

  }

  octaveSelect.disable("--Octave--");

​

  modeSelect.changed(changeMode);

  keySelect.changed(changeMode);

  octaveSelect.changed(changeMode);

  let octv = octaveSelect.value();

  instructions = createP(instructText);

  canvas = createCanvas(windowWidth, windowHeight);

  instructions.position(0,40);

​

​

  for (let i = 0; i < 12; i++) {

    keys[i] = new Pianokey(

      i * 50 + 10,

      height / 8,

      50,

      160,

      false,

      255,

      255,

      255,

      false,

      notes[i] + octv,

      false

    );

  }

​

  console.log(synth);

}

​

function draw() {

  background(245);

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

    keys[i].show();

  }

}

​

function changeMode() {

  let mode = Number(modeSelect.value());

  //notes.length = 0;

  let newNotes = [];

  let musicalKey = Number(keySelect.value());

  let octave = octaveSelect.value();

  // console.log(notes.length, mode , musicalKey);

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

    notes.pop();

    newNotes[i] = baseNotes[musicalKey];

    musicalKey++;

    musicalKey = musicalKey % 12;

  }

  // mode

  for (let i = 0; i < intervals[mode].length; i++) {

    notes[i] = newNotes[intervals[mode][i]] + octave;

  }

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

    keys[i].note = baseNotes[i] + octave;

    keys[i].enableNote = false;

  }

​

  for (let j = 0; j < notes.length; j++) {

    let setNote = false;

​

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

      if (!setNote && keys[i].enableNote == false) {

        if (keys[i].note == notes[j]) {

          keys[i].enableNote = true;

          keys[i].r = 0;

          keys[i].g = 255;

          keys[i].b = 0;

        } else {

          keys[i].enableNote = false;

          keys[i].r = 255;

          keys[i].g = 255;

          keys[i].b = 255;

        }

      }

    }

  }

  console.log(notes);

}

​

function mousePressed() {

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

    if (

      mouseX > keys[i].x &&

      mouseX < keys[i].x + keys[i].sizex &&

      mouseY > keys[i].y &&

      mouseY < keys[i].y + keys[i].sizey

    ) {

      keys[i].hit = true;

      keys[i].hitt(keys[i].note, 1.7);

      keys[i].r = 255;

      keys[i].g = 0;

      keys[i].b = 255;

    }

  }

}

function mouseReleased() {

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

    if ( keys[i].enableNote == true &&

      mouseX > keys[i].x &&

      mouseX < keys[i].x + keys[i].sizex &&

      mouseY > keys[i].y &&

      mouseY < keys[i].y + keys[i].sizey

    ) {

      keys[i].r = 0;

      keys[i].g = 255;

      keys[i].b = 0;

    }

    if ( keys[i].enableNote == false &&

      mouseX > keys[i].x &&

      mouseX < keys[i].x + keys[i].sizex &&

      mouseY > keys[i].y &&

      mouseY < keys[i].y + keys[i].sizey

    ) {

      keys[i].r = 255;

      keys[i].g = 255;

      keys[i].b = 255;

    }

  }

}

​

class Pianokey {

  constructor(_x, _y, _szx, _szy, _ispl, r, g, b, hit, _note, _enableNote) {

    this.x = _x;

    this.y = _y;

    this.sizex = _szx;

    this.sizey = _szy;

    this.note = _note;

    this.isPlaying = _ispl;

    this.r = r;

    this.g = g;

    this.b = b;

    this.hit = hit;

    this.enableNote = _enableNote;

    this.sound = false;

    this.synth = new Tone.PolySynth(Tone.Synth).toDestination();

  }

​

  show() {

    textSize(fnt);

    textAlign(CENTER, CENTER);

    fill(this.r, this.g, this.b);

    rect(this.x, this.y, this.sizex, this.sizey);

    fill(0);

    text(this.note, this.x + this.sizex / 2, this.y + (this.sizey + fnt));

  }

​

  hitt(note, end) {

    this.now = Tone.now();

    if (this.hit) {

      //this.speed.mult(random(0.99, 1.01));

      this.synth.triggerAttack(this.note, this.now);

      // this.synth.triggerAttack("F4", this.now);

      // this.synth.triggerAttack("A4", this.now);

      this.synth.triggerRelease(this.note, this.now + end);

      this.hit = false;

    }

  }

}

​