let capture;

let poseNet;

let poses = [];

​

function setup() {

  createCanvas(640, 480); //adjusted aspect ratio here

  capture = createCapture(VIDEO);

​

  // Create a new poseNet method with a single detection

  poseNet = ml5.poseNet(capture, modelReady);

  // This sets up an event that fills the global variable "poses" with an array every time new poses are detected

  poseNet.on('pose', function(results) {

    poses = results;

  });

  // Hide the video element, and just show the canvas

  capture.hide();

}

​

function modelReady() {

 print('poseNet ready');

}

​

​

function draw() {

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

  strokeWeight(2);

​

  // For one person's pose only (use a for loop for multiple people's poses!)

  if (poses.length > 0) {

    let Person1 = poses[0].pose;

​

    // Create a pink ellipse for the nose

    fill(213, 0, 143);

    let nose = Person1.nose;

    ellipse(nose.x, nose.y, 20, 20);

​

    // Create a yellow ellipse for the right eye

    fill(255, 215, 0);

    let rightEye = Person1.rightEye;

    ellipse(rightEye.x, rightEye.y, 20, 20);

​

    // Create a yellow ellipse for the right eye

    fill(255, 215, 0);

    let leftEye = Person1.leftEye;

    ellipse(leftEye.x, leftEye.y, 20, 20);

  }

}