let video;

let hands = [];

let targetLabel;

let brain;

let state = 'waiting';

​

function preload() {

  // Load the handPose model

  handPose = ml5.handPose({ flipped: true });

}

​

function setup() {

  createCanvas(640, 480);

  // Create the webcam video and hide it

  video = createCapture(VIDEO, { flipped: true });

  video.size(640, 480);

  video.hide();

  // start detecting hands from the webcam video

  handPose.detectStart(video, gotHands);

​

  let options = {

    inputs: 42,

    outputs: 4,

    task: "classification",

    debug: true,

  };

  brain = ml5.neuralNetwork(options);

}

​

function draw() {

  // Draw the webcam video

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

​

  if (hands.length > 0) {

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

      let hand = hands[i];

      let inputs = [];

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

        let keypoint = hand.keypoints[j];

        let x = keypoint.x;

        let y = keypoint.y;

        inputs.push(x);

        inputs.push(y);

        noStroke();

        circle(x, y, 10);

      }

      let target = [targetLabel];

      brain.addData(inputs, target);

      // console.log(inputs);

    }

  }

}

​

// Callback function for when handPose outputs data

function gotHands(results) {

  // save the output to the hands variable

  hands = results;

}

​

function keyPressed() {

  if(key == 's'){

    brain.saveData('shapes');

  }

​

  if(key == 't'){

    targetLabel = 'triangle';

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

    targetLabel = 'circle';

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

    targetLabel = 'rectangle';

  } else {

    targetLabel = key;

  }

  console.log(targetLabel);

  setTimeout(function () {

    console.log("collecting");

    state = "collecting";

    setTimeout(function(){

      console.log('not collecting');

      state = 'waiting';

    }, 10000);

  }, 10000);

}

​