xxxxxxxxxx
103
let modelHand;
let thumbTip;
let indexTip;
let middleTip;
let ringTip;
let pinkyTip;
// thumbTip = (36,273)
// indexTip = (126,80)
// middleTip = (205,44)
// ringTip = (275,95)
// pinkyTip = (335,178)
let keyPointObjs = [];
let resultPoints = {
thumbTip: "result[0].thumb",
indexTip: "result[0].index_finger",
// add in rest and get correct selectors for handpose sketches
};
function preload() {
modelHand400 = loadImage("modelImages/modelHand400.png");
frameRate(10);
}
function setup() {
canvas = createCanvas(800, 600);
//image(modelHand, 0, 0, modelHand.width, modelHand.height);
// create a 'keyPointObj' object for each finger and push to 'keyPointObjs' dictionary
keyPointObjs.push(new keyPointObj(36, 273, "thumbTip", false, "red", 8));
keyPointObjs.push(new keyPointObj(126, 80, "indexTip", false, "orange", 8));
keyPointObjs.push(new keyPointObj(205, 44, "middleTip", false, "yellow", 8));
keyPointObjs.push(new keyPointObj(275, 95, "ringTip", false, "green", 8));
keyPointObjs.push(new keyPointObj(335, 178, "pinkyTip", false, "blue", 8));
}
function draw() {
background(220);
image(modelHand400, 0, 0, modelHand400.width, modelHand400.height);
noStroke();
for (let i = 0; i < keyPointObjs.length; i++) {
keyPointObjs[i].isSelected();
}
//getMouseCoords()
}
function mousePressed() {
for (let i = 0; i < keyPointObjs.length; i++) {
keyPointObjs[i].clicked(mouseX, mouseY);
}
}
function mouseOver(){
for (let i = 0; i < keyPointObjs.length; i++) {
keyPointObjs[i].hovering(mouseX, mouseY);
}
}
class keyPointObj {
constructor(x, y, id, selected, color, r) {
this.id = id;
this.selected = selected;
this.color = color;
this.x = x;
this.y = y;
this.r = r;
}
isSelected() {
if (this.selected) {
fill(this.color);
ellipse(this.x, this.y, this.r * 2, this.r * 2);
}
}
// class function to control what happens when obj instance is clicked
clicked(px, py) {
let d = dist(px, py, this.x, this.y);
if (d < this.r) {
this.selected = !this.selected;
this.isSelected();
console.log(resultPoints.thumbTip);
}
}
hovering(px, py) {
let d = dist(px, py, this.x, this.y);
if (d < this.r) {
// this.selected = !this.selected;
// this.isSelected();
console.log("hovering",resultPoints.thumbTip);
}
}
}
//utility functions below
function getMouseCoords() {
//code for finding coords
fill(255, 60, 100);
text("(" + mouseX + ", " + mouseY + ")", mouseX, mouseY);
stroke(0);
}