let targetLabel = "C"

​

let state = 'collection';

​

let data;

​

let dataShownGate = true;

​

//Notes found at https://pages.mtu.edu/~suits/notefreqs.html

let notes = {

  C: 261.63,

  D: 293.66,

  E: 329.63,

  F: 349.23,

  G: 392.00,

  A: 440.00,

  B: 493.88

}

​

function setup() {

  createCanvas(400, 400);

  env = new p5.Envelope();

  env.setADSR(0.05,0.1,0.5,1);

  env.setRange(1.2,0);

  wave = new p5.Oscillator();

  wave.setType('sine');

  wave.start();

  wave.freq();

  wave.amp(env);

  let options = {

    inputs: ['x','y'], 

    outputs: ['label'],

    task: 'classification',

    debug: 'true',

    learningRate: 0.5 

  };

  model = ml5.neuralNetwork(options);

  background(255);

}

​

function keyPressed(){

  if (key == 't'){

    trainData();

  }else if(key == 's'){

    model.saveData('mouse-notes');

  }else if(key == 'l'){

    loadData();

  }else if(key == 'h'){

    if(dataShownGate){

      showData();

      dataShownGate = false;

    }else{

      hideData();

      dataShownGate = true;

    }

  }else{

    targetLabel = key.toUpperCase();

  }

}

​

function mousePressed(){

  let inputs = {

    x: mouseX,

    y: mouseY

  };

  if (state == 'collection'){

    let target = {

      label: targetLabel

    }

    model.addData(inputs,target);

    stroke(0);

    noFill();

    ellipse(mouseX,mouseY,24);

    fill(0)

    noStroke();

    textAlign(CENTER,CENTER);

    text(targetLabel,mouseX,mouseY);

    wave.freq(notes[targetLabel]);

    env.play();

  } else if(state == 'prediction'){

    model.classify(inputs, gotResults);

  }

}

​

function trainData(){

  state = 'training'

  console.log('Starting training');

  model.normalizeData();

  let options = {

    epochs: 200

  };

  model.train(options, whileTraining, finishTraining);

}

​

function whileTraining(epoch, loss){

  //console.log(epoch);

}

​

function finishTraining(){

  console.log('finished training');

  state = 'prediction';

}

​

function loadData(){

  model.loadData('mouse-notes.json',dataLoaded);

}

​

function dataLoaded(){

  console.log('Data loaded')

  data = model.data.data.raw;

}

​

function showData(){

  console.log('Data drawn')

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

    let inputs = data[i].xs;

    let target = data[i].ys;

    stroke(0);

    noFill();

    ellipse(inputs.x,inputs.y,24);

    fill(0)

    noStroke();

    textAlign(CENTER,CENTER);

    text(target.label,inputs.x,inputs.y); 

  }

}

​

function hideData(){

  console.log('Data hidden')

  background(255);

}

​

function gotResults(error, results){

  if(error){

    console.log(error);

    return;

  }else {

    console.log(results);

    stroke(0);

    fill(0,0,255);

    ellipse(mouseX,mouseY,24);

    fill(0);

    noStroke();

    textAlign(CENTER,CENTER);

    let label = results[0].label

    text(label,mouseX,mouseY);

    wave.freq(notes[label]);

    env.play();    

  }

}