var bpm = 20;

let sel;

​

let root = [82, 110, 147, 197, 247, 330];

let cChord = [82, 131, 165, 197, 262, 330];

let dChord = [82, 110, 147, 220, 294, 370];

let eChord = [82, 123, 165, 208, 294, 370];

​

var col = 'white';

let synth = new Tone.Synth().toMaster();

​

​

  let octave = 3 *24;

  let midiNote = 60 + octave *12;

​

​

function setup() {

  createCanvas(450, 450);

//   let n = root

//   let c = cChord

//   n = 'Base'

//   c = 'C Chord'

  sel = createSelect();

  sel.position(190, 400);

  sel.option('Open');

  sel.option('C Chord');

  sel.option('D Chord');

  sel.option('E Chord');

  sel.changed(musicStart);

​

}

​

​

function draw() {

  var i;

  background(0);

   stroke(80);

   line(50,150,400,150);

 line(50,250,400,250);

  stroke(col);

  noFill();

​

  var pos;

  pos = 110;

  for (i = 100; i <=350; i += 50 ){

    line(i,50,i,pos);

    line(i,pos,i,350);

    ellipse(i, 50, 4, 4);

    ellipse(i, 350, 4, 4);

  }

  if (mouseY <= 350 && mouseY >= 50){

  //console.log(mouseY);

      if (mouseX >= 95 && mouseX <=105){

        line(100,50,mouseX,mouseY);

        line(mouseX,mouseY,100,350);

​

​

      musicStart(0);

      stroke(col);

      // pos = mouseX;

      //   i = mouseY;

​

      } else if (mouseX >= 145 && mouseX <=155){

         line(150,50,mouseX,mouseY);

        line(mouseX,mouseY,150,350);

      musicStart(1);

    stroke(col);

​

      } else if (mouseX >= 195 && mouseX <=205){

           line(200,50,mouseX,mouseY);

        line(mouseX,mouseY,200,350);

​

      musicStart(2);

    stroke(col);

​

      } else if (mouseX >= 245 && mouseX <=255){

         line(250,50,mouseX,mouseY);

        line(mouseX,mouseY,250,350);

      musicStart(3);

    stroke(col);

​

      } else if (mouseX >= 295 && mouseX <=305){

            line(300,50,mouseX,mouseY);

        line(mouseX,mouseY,300,350);

​

      musicStart(4);

    stroke(col);

​

      } else if (mouseX >= 345 && mouseX <=355){

         line(350,50,mouseX,mouseY);

        line(mouseX,mouseY,350,350);

      musicStart(5);

    stroke(col);

​

      } 

  }

​

​

}

​

function musicStart(freQ){

   let change = sel.value();

    synth.toMaster();

​

    Tone.Transport.bpm.value = 60;

​

    if (change == 'C Chord') {

    synth.triggerAttackRelease(cChord[freQ], 0.4); 

    col = 'cyan';

    ellipse(150, 300, 40, 40);

    ellipse(200, 200, 40, 40);

    ellipse(300, 100, 40, 40);

  } else if (change == 'D Chord') {

  synth.triggerAttackRelease(dChord[freQ], 0.4); 

    col = 'yellow';

    ellipse(250, 200, 40, 40);

    ellipse(300, 300, 40, 40);

    ellipse(350, 200, 40, 40);

  } else if (change == 'E Chord') {

  synth.triggerAttackRelease(eChord[freQ], 0.4); 

    col = 'magenta';

    ellipse(150, 200, 40, 40);

    ellipse(200, 200, 40, 40);

    ellipse(250, 100, 40, 40);

  } else {

  synth.triggerAttackRelease(root[freQ], 0.4); 

    col = 'white';

  } 

​

}

​

​

​

​

​

​

​

​

​