xxxxxxxxxx
84
// this sketch allows you to use your wrists to draw on the screen
// the closer your nose is to the camera, the thicker the stroke
// we find the distance of nose to screen by checking the distance between your eyes
// circles get cleared after a while. Implemented using FIFO and arrays
let poseNet;
let myVideo;
let myResults;
let latestLeft = [];
let latestRight = [];
let rectSizeLeft = 50;
let rectSizeRight = 50;
function setup() {
myVideo = createCapture(VIDEO);
myVideo.hide()
createCanvas(640, 480);
poseNet = ml5.poseNet(myVideo, gotModel);
noStroke();
fill(155, 255, 10)
rectMode(CENTER)
}
function gotModel(){
poseNet.on('pose', gotResults);
}
function gotResults(results){
myResults = results;
if(myResults[0]) {
const left = myResults[0].pose.leftWrist;
const leftDist = dist(left.x, left.y, 100, 100);
if (leftDist < size/2){
rectSizeLeft += 10;
}
latestLeft.push(left)
if (latestLeft.length > 50){
latestLeft.shift();
}
const right = myResults[0].pose.rightWrist;
latestRight.push(right)
if (latestRight.length > 50){
latestRight.shift();
}
}
}
function draw() {
image(myVideo, 0, 0, width, height);
fill(20, 200, 200);
rect(500, 100, rectSizeLeft, rectSizeLeft);
fill(155,20, 200);
rect(100, 100, rectSizeRight, rectSizeRight);
for (let i = 0; i < latestLeft.length;i++){
fill(`rgba(20,200, 200, ${i/50})`)
ellipse(latestLeft[i].x, latestLeft[i].y, 5+i*1, 5+i*1)
}
for (let i = 0; i < latestRight.length;i++){
fill(`rgba(155,20, 200, ${i/50})`)
ellipse(latestRight[i].x, latestRight[i].y, 5+i*1, 5+i*1)
}
//image(myVideo, 0, 0, width, height);
// if (myResults && myResults[0]){
// const nose = myResults[0].pose.nose;
// //ellipse(nose.x, nose.y, 15, 15)
// const leftEye = myResults[0].pose.leftEye;
// const rightEye = myResults[0].pose.rightEye;
// const size = dist(rightEye.x, rightEye.y,leftEye.x, leftEye.y);
// //fill(random() * 255, random() * 255, random() * 255) // ranbow fill
// //fill(random() * 255, 255, 10)
// ellipse(nose.x, nose.y, size/4, size/4);
}