update webcam.js

dist/static/assets/webcam.js

@@ -191,48 +191,44 @@ function drawLandmarks(detection) {
     const leftEyeBrow = detection.parts.leftEyeBrow;
     const jawOutline = detection.parts.jawOutline;
 
-    drawPart(mouth, true);
-    drawPart(nose, true);
-    drawPart(leftEye, true);
-    drawPart(leftEyeBrow, false);
-    drawPart(rightEye, true);
-    drawPart(rightEyeBrow, false);
-    drawPart(jawOutline, false);
+    strokePoints(mouth, CLOSE);
+    strokePoints(nose, CLOSE);
+    strokePoints(leftEye, CLOSE);
+    strokePoints(leftEyeBrow, OPEN);
+    strokePoints(rightEye, CLOSE);
+    strokePoints(rightEyeBrow, OPEN);
+    strokePoints(jawOutline, OPEN);
 
     // }
 }
 
-function drawPart(feature, closed) {
+function strokePoints(points, closed) {
     beginShape();
 
-    for (let i = 0; i < feature.length; i++) {
-        const x = feature[i].x;
-        const y = feature[i].y;
+    for (let i = 0; i < points.length; i++) {
+        const x = points[i].x;
+        const y = points[i].y;
         vertex(x, y)
     }
 
-    if (closed === true) {
-        endShape(CLOSE);
-    } else {
-        endShape();
+    if(typeof closed === 'undefined') {
+        closed = CLOSE;
     }
 
+    endShape(closed)
 }
 
-// /**
-//  * Wrapper around p5.js color class
-//  * @param {*} c color, either as array, or string (css name or HEX string)
-//  */
-// function getColor(c) {
-//     if(!Array.isArray(c)) c = [c];
-//     return new p5.Color(p5.instance, c);
-// }
+function drawPoints(points, radius) {
+    if(typeof radius === 'undefined') {
+        radius = 2;
+    }
 
-// var colors = {
-//     red: getColor('red'),
-//     blue: getColor('blue'),
-//     green: getColor('green'),
-// };
+    for (let i = 0; i < points.length; i++) {
+        const x = points[i].x;
+        const y = points[i].y;
+        circle(x, y, radius);
+    }
+}
 
 function faceDistance(face1, face2){
     // distance between faces, in pixels, not meters.. for now