let handposeModel;

let handData;

let thumb;

let index;

let middle;

let ring;

let pinky;

let myNN;

let myNNresults;

​

function setup() {https://unpkg.com/ml5@latest/dist/ml5.min.js:579:36330

  createCanvas(640, 480);

  video = createCapture(VIDEO);

  video.size(width, height);

  video.hide();

  handposeModel = ml5.handpose(video, gotModel);

  handposeModel.on('hand', gotPose);

  const option = {

    task: 'classification',

    debug: true

  }

  myNN = ml5.neuralNetwork(option);

}

​

function gotPose(results) {

  handData = results;

  // console.log('results', results)

  if (results.length > 0) {

    index = results[0].annotations.indexFinger[3];

    thumb = results[0].annotations.thumb[3];

    middle = results[0].annotations.middleFinger[3];

    ring = results[0].annotations.ringFinger[3];

    pinky = results[0].annotations.pinky[3];

  }

}

​

function keyPressed() {

  if (keyCode === 49) {

    console.log('press 1')

    const data = [index[0], index[1], index[2], thumb[0], thumb[1], thumb[2], middle[0], middle[1], middle[2], ring[0], ring[1], ring[2]];

    myNN.addData(data, ['Hello']);

  } else if (keyCode === 50) {

    console.log('press 2')

    const data = [index[0], index[1], index[2], thumb[0], thumb[1], thumb[2], middle[0], middle[1], middle[2], ring[0], ring[1], ring[2]];

    myNN.addData(data, ['Good']);

  } else if (keyCode === 51) {

    console.log('press 3')

    const data = [index[0], index[1], index[2], thumb[0], thumb[1], thumb[2], middle[0], middle[1], middle[2], ring[0], ring[1], ring[2]];

    myNN.addData(data, ['Yea']);

  } else if (keyCode === 32) {

    myNN.normalizeData();

    myNN.train({epochs: 50}, trainingDone);

  } else if (keyCode === 83) {

    myNN.save('model');

  }

}

​

function trainingDone() {

  classify();

}

​

function classify() {

  const data = [index[0], index[1], index[2], thumb[0], thumb[1], thumb[2], middle[0], middle[1], middle[2], ring[0], ring[1], ring[2], pinky[0], pinky[1], pinky[2]];

  myNN.classify(data, gotNNResults);

}

​

function gotNNResults(err, results) {

  if (err) {

    console.log(err);

  }

  if (results) {

    console.log(results);

    myNNresults = results;

    classify();

  }

}

​

function gotModel() {

  console.log('handposeModel', handposeModel)

}

​

function draw() {

  image(video, 0, 0, width, height);

  if (handData && handData.length > 0) {

    noStroke();

    fill(255, 10, 10);

    ellipse(thumb[0], thumb[1], 20, 20);

    fill(10, 255, 10);

    ellipse(index[0], index[1], 20, 20);

    fill(10, 10, 255);

    ellipse(middle[0], middle[1], 20, 20);

    fill(30, 220, 100);

    ellipse(ring[0], ring[1], 20, 20);

    fill(100, 30, 220);

    ellipse(pinky[0], pinky[1], 20, 20);

  }

  if (myNNresults) {

    textSize(60);

    text(myNNresults[0].label + ', ' + myNNresults[0].confidence, width / 2, height / 2);

      if(myNNresults[0].label =='Hello'){

      textSize(27);

      text('Hi👋!');

      console.log ('Hi!');

    }

    else if(myNNresults[0].label =='Good'){

      textSize(27);

      text('Good👍!', width/2, 350);

    }

    else if(myNNresults[0].label == 'Yea'){

      textSize(27);

      text('Yea🙌!', width/2, 350);

    }

  }

}

​

​