​

let video;

let poseNet;

let wrist1X = 50;   //for left-handed

let wrist1Y = 50;

​

​

var x = 0;

var y = 0;

var stepSize = 9.0;

var font = 'Georgia';

var letters = '*';

var fontSizeMin = 20;

var angleDistortion = 0.0;

​

var counter = 0;

​

​

function setup() {

  createCanvas(700, 700);

  video = createCapture(VIDEO);

  video.hide();

​

  poseNet = ml5.poseNet(video, modelReady);

  poseNet.on('pose', gotPoses);

  background(20);

  textFont(font);

  textAlign(LEFT);

  fill(255);

}

​

function gotPoses(poses) {

  if (poses.length > 0) {

    let pose = poses[0].pose;

    wrist1X = lerp(wrist1X, pose.leftWrist.x, 0.1);

    wrist1Y = lerp(wrist1Y, pose.leftWrist.y, 0.1);

  }

}

​

function modelReady() {

  console.log('model ready');

}

​

function draw() {

  // scale(-1, 1);

  image(video,0, 0,200,140);

​

​

​

  var d = dist(x,y,wrist1X,wrist1Y);

  textSize(fontSizeMin + d / 2);

  var newLetter = letters.charAt(counter);

  stepSize = textWidth(newLetter);

​

  if (d > stepSize) {

    var angle = atan2(wrist1Y - y, wrist1X - x);

​

    push();

    translate(x, y);

    rotate(angle + random(angleDistortion));

    text(newLetter, 0, 0);

    pop();

​

    counter++;

    if (counter >= letters.length) counter = 0;

​

    x = x + cos(angle) * stepSize;

    y = y + sin(angle) * stepSize;

  }

​

}