three-mediapipe-rig 0.1.2 → 0.1.3

package/dist/rigger.js

@@ -1,27 +1,27 @@
 var Pe = Object.defineProperty;
-var Ee = (l, o, e) => o in l ? Pe(l, o, { enumerable: !0, configurable: !0, writable: !0, value: e }) : l[o] = e;
-var R = (l, o, e) => Ee(l, typeof o != "symbol" ? o + "" : o, e);
-import { PoseLandmarker as we, HandLandmarker as I, FaceLandmarker as G, FilesetResolver as ge, DrawingUtils as We } from "@mediapipe/tasks-vision";
-import * as u from "three/webgpu";
-import { Vector3 as b, Quaternion as ye, VideoTexture as Q, SRGBColorSpace as Y, MeshPhysicalNodeMaterial as Fe } from "three/webgpu";
-import * as _ from "three";
+var Ee = (h, o, e) => o in h ? Pe(h, o, { enumerable: !0, configurable: !0, writable: !0, value: e }) : h[o] = e;
+var R = (h, o, e) => Ee(h, typeof o != "symbol" ? o + "" : o, e);
+import { PoseLandmarker as Le, HandLandmarker as G, FaceLandmarker as j, FilesetResolver as We, DrawingUtils as ge } from "@mediapipe/tasks-vision";
+import * as p from "three/webgpu";
+import { Vector3 as b, Quaternion as ke, VideoTexture as Z, SRGBColorSpace as J, MeshPhysicalNodeMaterial as Fe } from "three/webgpu";
+import * as C from "three";
 import { Bone as Ae } from "three";
-import { uniform as C, attribute as Se, instancedArray as Me, varying as Ve, vec3 as Ne, float as Oe, texture as Te, vec2 as _e } from "three/tsl";
+import { uniform as D, attribute as Se, instancedArray as Me, varying as Ve, vec3 as Ne, float as Oe, texture as Te, vec2 as _e } from "three/tsl";
 import { c as Ce, F as De } from "./face-tracker-utils-xt9__vBF.js";
 import { GLTFExporter as ze } from "three/examples/jsm/Addons.js";
-const z = new b(), Z = new b(), Be = new b(1, 0, 0), Ue = new b(-1, 0, 0), Ie = new b(0, 1, 0), Ge = new b(0, -1, 0), J = new b(0, 0, 1);
+const U = new b(), ee = new b(), Be = new b(1, 0, 0), Ue = new b(-1, 0, 0), Ie = new b(0, 1, 0), He = new b(0, -1, 0), te = new b(0, 0, 1);
 new b(0, 0, -1);
-const ee = new b(), He = new b(), qe = new b(), te = new ye(), B = new ye();
-function F(l, o, e, t = "+x") {
-  l.lookAt(o);
-  const n = t == "+x" ? Be : t == "-x" ? Ue : t == "+y" ? Ie : Ge;
-  l.getWorldPosition(Z), l.getWorldQuaternion(B), z.subVectors(e, Z).normalize(), ee.copy(n).applyQuaternion(B);
-  const s = ee, a = He.copy(J).applyQuaternion(B), i = z.clone().addScaledVector(a, -z.dot(a)).normalize(), r = qe.crossVectors(s, i), m = Math.atan2(r.dot(a), s.dot(i));
-  te.setFromAxisAngle(J, m), l.quaternion.multiply(te);
+const oe = new b(), Ge = new b(), je = new b(), se = new ke(), I = new ke();
+function S(h, o, e, t = "+x") {
+  h.lookAt(o);
+  const s = t == "+x" ? Be : t == "-x" ? Ue : t == "+y" ? Ie : He;
+  h.getWorldPosition(ee), h.getWorldQuaternion(I), U.subVectors(e, ee).normalize(), oe.copy(s).applyQuaternion(I);
+  const n = oe, d = Ge.copy(te).applyQuaternion(I), i = U.clone().addScaledVector(d, -U.dot(d)).normalize(), r = je.crossVectors(n, i), m = Math.atan2(r.dot(d), n.dot(i));
+  se.setFromAxisAngle(te, m), h.quaternion.multiply(se);
 }
-const D = new u.Vector3(), N = new u.Vector3(), U = new u.Vector3();
-new u.Vector3();
-class H {
+const z = new p.Vector3(), O = new p.Vector3(), H = new p.Vector3();
+new p.Vector3();
+class q {
   constructor(o, e) {
     R(this, "objectGhost");
     R(this, "root");
@@ -29,17 +29,17 @@ class H {
      * per landmark index, it points to it's object3D equivalent.
      */
     R(this, "marks", {});
-    this.points = o, this.debugConnections = e, this.root = new u.Object3D(), this.objectGhost = /* @__PURE__ */ new Map();
+    this.points = o, this.debugConnections = e, this.root = new p.Object3D(), this.objectGhost = /* @__PURE__ */ new Map();
     for (let t in this.points)
-      this.marks[t] = new $e(), this.root.add(this.marks[t]);
+      this.marks[t] = new qe(), this.root.add(this.marks[t]);
   }
   updateLandmarks(o, e, t) {
-    for (let n in this.points) {
-      const s = this.points[n], a = this.marks[n];
-      a && (s instanceof Array ? (D.copy(o[s[0]]), a.position.copy(o[s[1]]).sub(D).divideScalar(2).add(o[s[0]]), s.length == 4 && (D.subVectors(
-        o[s[3]],
-        o[s[2]]
-      ).divideScalar(2).add(o[s[2]]).sub(a.position).divideScalar(2), a.position.add(D))) : a.position.copy(o[s]));
+    for (let s in this.points) {
+      const n = this.points[s], d = this.marks[s];
+      d && (n instanceof Array ? (z.copy(o[n[0]]), d.position.copy(o[n[1]]).sub(z).divideScalar(2).add(o[n[0]]), n.length == 4 && (z.subVectors(
+        o[n[3]],
+        o[n[2]]
+      ).divideScalar(2).add(o[n[2]]).sub(d.position).divideScalar(2), d.position.add(z))) : d.position.copy(o[n]));
     }
     t && e && t.drawConnectors(
       e,
@@ -52,7 +52,7 @@ class H {
   getGhost(o) {
     var e;
     if (!this.objectGhost.has(o)) {
-      const t = new je();
+      const t = new $e();
       t.position.copy(o.position), t.quaternion.copy(o.quaternion), (e = o.parent) == null || e.add(t), this.objectGhost.set(o, t);
     }
     return this.objectGhost.get(o);
@@ -67,47 +67,47 @@ class H {
     this.marks[o].position.set(1, 2, 3);
   }
   syncObjects(o, e, t) {
-    for (const [n, s, a, i] of o) {
-      this.marks[a].getWorldPosition(U), this.marks[s].getWorldPosition(N);
-      const r = U.sub(N);
-      n.getWorldPosition(N), N.add(r);
-      const m = N, c = n.getWorldPosition(U).sub(t), f = this.getGhost(n);
-      F(f, m, c, i), f.rotateX(Math.PI / 2), n.position.lerp(f.position, e * 4), n.quaternion.slerp(f.quaternion, e * 4);
+    for (const [s, n, d, i] of o) {
+      this.marks[d].getWorldPosition(H), this.marks[n].getWorldPosition(O);
+      const r = H.sub(O);
+      s.getWorldPosition(O), O.add(r);
+      const m = O, l = s.getWorldPosition(H).sub(t), u = this.getGhost(s);
+      S(u, m, l, i), u.rotateX(Math.PI / 2), s.position.lerp(u.position, e * 4), s.quaternion.slerp(u.quaternion, e * 4);
     }
   }
   getBone(o, e) {
     return o.getObjectByName(e.replace(/[\.\:]/g, ""));
   }
 }
-class $e extends u.Mesh {
+class qe extends p.Mesh {
   constructor() {
-    super(new u.SphereGeometry(0.01, 3, 3), new u.MeshStandardMaterial({ color: 16711680, wireframe: !0 }));
-    R(this, "_worldPosition", new u.Vector3());
-    this.add(new u.AxesHelper(1e-3));
+    super(new p.SphereGeometry(0.01, 3, 3), new p.MeshStandardMaterial({ color: 16711680, wireframe: !0 }));
+    R(this, "_worldPosition", new p.Vector3());
+    this.add(new p.AxesHelper(1e-3));
   }
   get worldPosition() {
     return this.getWorldPosition(this._worldPosition), this._worldPosition;
   }
 }
-class je extends u.Object3D {
+class $e extends p.Object3D {
   lerp(o, e, t = 8) {
     o.position.lerp(this.position, e * t), o.quaternion.slerp(this.quaternion, e * t);
   }
 }
-function W(l, o, e) {
-  return e.worldToLocal(o.getWorldPosition(l)), l;
+function A(h, o, e) {
+  return e.worldToLocal(o.getWorldPosition(h)), h;
 }
-function Ke(l) {
-  return l.replace(/[\.\:]/g, "");
+function Ke(h) {
+  return h.replace(/[\.\:]/g, "");
 }
-function P(l, o) {
+function P(h, o) {
   let e;
-  return o = Ke(o), l.traverse((t) => {
+  return o = Ke(o), h.traverse((t) => {
     t.name.indexOf(o) === 0 && t instanceof Ae && (e = t);
-  }), e || console.log("Bone not found: ", o, l.name), e;
+  }), e || console.log("Bone not found: ", o, h.name), e;
 }
-async function Xe(l, o) {
-  const e = await we.createFromOptions(l, {
+async function Xe(h, o) {
+  const e = await Le.createFromOptions(h, {
     baseOptions: {
       modelAssetPath: (o == null ? void 0 : o.modelPath) ?? "pose_landmarker_lite.task",
       //modelAssetPath: `https://storage.googleapis.com/mediapipe-models/pose_landmarker/pose_landmarker_lite/float16/1/pose_landmarker_lite.task`,
@@ -141,10 +141,10 @@ const Qe = {
   torso: [24, 23, 12, 11],
   leftEar: 7,
   rightEar: 8
-}, Ye = new u.Vector3(), oe = new u.Vector3(), Ze = new u.Vector3(), Je = new u.Vector3(), et = new u.Vector3(), ne = new u.Vector3(), se = new u.Vector3();
-class tt extends H {
+}, Ye = new p.Vector3(), ne = new p.Vector3(), Ze = new p.Vector3(), Je = new p.Vector3(), et = new p.Vector3(), ie = new p.Vector3(), re = new p.Vector3();
+class tt extends q {
   constructor(e, t) {
-    super(Qe, we.POSE_CONNECTIONS);
+    super(Qe, Le.POSE_CONNECTIONS);
     R(this, "_leftWristNormalizedPosition");
     R(this, "_rightWristNormalizedPosition");
     this.poseLandmarker = e, this.config = t, this.root.scale.y *= -2, this.root.scale.z *= -2, this.root.scale.x *= 2;
@@ -162,9 +162,9 @@ class tt extends H {
     return this._rightWristNormalizedPosition;
   }
   predict(e, t) {
-    this.poseLandmarker.detectForVideo(e, performance.now(), (n) => {
-      var s;
-      n.landmarks.length != 0 && (this.updateLandmarks(n.worldLandmarks[0], ((s = this.config) == null ? void 0 : s.drawLandmarks) === !1 ? void 0 : n.landmarks[0], t), this._leftWristNormalizedPosition = n.landmarks[0][this.points.leftWrist], this._rightWristNormalizedPosition = n.landmarks[0][this.points.rightWrist]);
+    this.poseLandmarker.detectForVideo(e, performance.now(), (s) => {
+      var n;
+      s.landmarks.length != 0 && (this.updateLandmarks(s.worldLandmarks[0], ((n = this.config) == null ? void 0 : n.drawLandmarks) === !1 ? void 0 : s.landmarks[0], t), this._leftWristNormalizedPosition = s.landmarks[0][this.points.leftWrist], this._rightWristNormalizedPosition = s.landmarks[0][this.points.rightWrist]);
     });
   }
   // override sync ( delta:number, objects: BoneBinding[] ) {
@@ -176,7 +176,7 @@ class tt extends H {
   // }
   bind(e, t) {
     var r;
-    const n = {
+    const s = {
       hips: P(e, t.hips),
       neck: P(e, t.neck),
       leftArm: P(e, t.armL),
@@ -194,25 +194,25 @@ class tt extends H {
       rightKnee: P(e, t.shinR),
       rightFoot: P(e, t.footR)
     };
-    (r = this.config) != null && r.ignoreLegs && (delete n.leftLeg, delete n.leftKnee, delete n.leftFoot, delete n.leftToes, delete n.rightLeg, delete n.rightKnee, delete n.rightFoot, delete n.rightToes);
-    const s = new u.Vector3(), a = new u.Vector3(), i = (m, c, f, k, x, d) => {
-      if (!c) return;
-      const h = this.marks[k].getWorldPosition(s).sub(this.marks[f].getWorldPosition(a)).normalize();
-      W(ne, c, e).add(h).applyMatrix4(e.matrixWorld), W(se, c, e).add(x).applyMatrix4(e.matrixWorld);
-      const w = this.getGhost(c);
-      F(w, ne, se, d), w.rotateX(Math.PI / 2), w.lerp(c, m);
+    (r = this.config) != null && r.ignoreLegs && (delete s.leftLeg, delete s.leftKnee, delete s.leftFoot, delete s.leftToes, delete s.rightLeg, delete s.rightKnee, delete s.rightFoot, delete s.rightToes);
+    const n = new p.Vector3(), d = new p.Vector3(), i = (m, l, u, y, x, W) => {
+      if (!l) return;
+      const a = this.marks[y].getWorldPosition(n).sub(this.marks[u].getWorldPosition(d)).normalize();
+      A(ie, l, e).add(a).applyMatrix4(e.matrixWorld), A(re, l, e).add(x).applyMatrix4(e.matrixWorld);
+      const c = this.getGhost(l);
+      S(c, ie, re, W), c.rotateX(Math.PI / 2), c.lerp(l, m);
     };
     return {
       update: (m) => {
-        const c = this.marks.leftLeg.getWorldPosition(Ye).sub(this.marks.rightLeg.getWorldPosition(oe)).normalize(), f = this.marks.leftArm.getWorldPosition(oe).sub(this.marks.rightArm.getWorldPosition(Ze)).normalize(), k = this.marks.leftEar.getWorldPosition(Je).sub(this.marks.rightEar.getWorldPosition(et)).normalize();
-        i(m, n.hips, "hips", "torso", c, "+x"), i(m, n.torso, "torso", "neck", f, "+x"), i(m, n.neck, "neck", "head", k, "+x"), i(m, n.head, "neck", "head", k, "+x"), i(m, n.leftArm, "leftArm", "leftElbow", f, "-x"), i(m, n.leftElbow, "leftElbow", "leftWrist", f, "-x"), i(m, n.leftLeg, "leftLeg", "leftKnee", c, "+x"), i(m, n.leftKnee, "leftKnee", "leftFoot", c, "+x"), i(m, n.leftFoot, "leftFoot", "leftToes", c, "+x"), i(m, n.rightArm, "rightArm", "rightElbow", f, "-x"), i(m, n.rightElbow, "rightElbow", "rightWrist", f, "-x"), i(m, n.rightLeg, "rightLeg", "rightKnee", c, "+x"), i(m, n.rightKnee, "rightKnee", "rightFoot", c, "+x"), i(m, n.rightFoot, "rightFoot", "rightToes", c, "+x");
+        const l = this.marks.leftLeg.getWorldPosition(Ye).sub(this.marks.rightLeg.getWorldPosition(ne)).normalize(), u = this.marks.leftArm.getWorldPosition(ne).sub(this.marks.rightArm.getWorldPosition(Ze)).normalize(), y = this.marks.leftEar.getWorldPosition(Je).sub(this.marks.rightEar.getWorldPosition(et)).normalize();
+        i(m, s.hips, "hips", "torso", l, "+x"), i(m, s.torso, "torso", "neck", u, "+x"), i(m, s.neck, "neck", "head", y, "+x"), i(m, s.head, "neck", "head", y, "+x"), i(m, s.leftArm, "leftArm", "leftElbow", u, "-x"), i(m, s.leftElbow, "leftElbow", "leftWrist", u, "-x"), i(m, s.leftLeg, "leftLeg", "leftKnee", l, "+x"), i(m, s.leftKnee, "leftKnee", "leftFoot", l, "+x"), i(m, s.leftFoot, "leftFoot", "leftToes", l, "+x"), i(m, s.rightArm, "rightArm", "rightElbow", u, "-x"), i(m, s.rightElbow, "rightElbow", "rightWrist", u, "-x"), i(m, s.rightLeg, "rightLeg", "rightKnee", l, "+x"), i(m, s.rightKnee, "rightKnee", "rightFoot", l, "+x"), i(m, s.rightFoot, "rightFoot", "rightToes", l, "+x");
       }
     };
   }
 }
-const ie = new u.Vector2(), re = new u.Vector2();
-async function ot(l, o) {
-  const e = await I.createFromOptions(l, {
+const ae = new p.Vector2(), de = new p.Vector2();
+async function ot(h, o) {
+  const e = await G.createFromOptions(h, {
     baseOptions: {
       modelAssetPath: o.modelPath ?? "hand_landmarker.task",
       //modelAssetPath: `https://storage.googleapis.com/mediapipe-models/hand_landmarker/hand_landmarker/float16/1/hand_landmarker.task`,
@@ -220,20 +220,20 @@ async function ot(l, o) {
     },
     runningMode: "VIDEO",
     numHands: 2
-  }), t = (n, s, a) => {
+  }), t = (s, n, d) => {
     try {
-      ie.copy(n()), re.copy(s());
+      ae.copy(s()), de.copy(n());
     } catch (i) {
       return console.warn("No pose data... will just be optimitic and say yes to everything.", i), !0;
     }
-    return ie.distanceTo(a) < re.distanceTo(a);
+    return ae.distanceTo(d) < de.distanceTo(d);
   };
   return {
-    left: new ue(e, "Left", t.bind(null, o.leftWrist, o.rightWrist), o.drawLandmarks),
-    right: new ue(e, "Right", t.bind(null, o.rightWrist, o.leftWrist), o.drawLandmarks)
+    left: new we(e, "Left", t.bind(null, o.leftWrist, o.rightWrist), o.drawLandmarks),
+    right: new we(e, "Right", t.bind(null, o.rightWrist, o.leftWrist), o.drawLandmarks)
   };
 }
-const nt = {
+const st = {
   wrist: 0,
   palm: [9, 13],
   thumb1: 1,
@@ -256,38 +256,38 @@ const nt = {
   pinky2: 18,
   pinky3: 19,
   pinky4: 20
-}, O = {
+}, T = {
   thumb: ["thumb1", "thumb2", "thumb3", "thumb4"],
   index: ["index1", "index2", "index3", "index4"],
   middle: ["middle1", "middle2", "middle3", "middle4"],
   ring: ["ring1", "ring2", "ring3", "ring4"],
   pinky: ["pinky1", "pinky2", "pinky3", "pinky4"]
-}, st = new u.Vector3(), ae = new u.Vector3(), de = new u.Vector3(), ce = new u.Vector3(), le = new u.Vector3(), he = new u.Vector3();
-new u.Vector3();
-new u.Vector3();
-new u.Vector3();
-const me = new u.Vector3(), pe = Math.PI / 2, it = new u.Vector3(0, -1, 0);
-class ue extends H {
-  constructor(e, t, n, s = !0) {
-    super(nt, I.HAND_CONNECTIONS);
+}, nt = new p.Vector3(), ce = new p.Vector3(), le = new p.Vector3(), he = new p.Vector3(), me = new p.Vector3(), pe = new p.Vector3();
+new p.Vector3();
+new p.Vector3();
+new p.Vector3();
+const ue = new p.Vector3(), fe = Math.PI / 2, it = new p.Vector3(0, -1, 0);
+class we extends q {
+  constructor(e, t, s, n = !0) {
+    super(st, G.HAND_CONNECTIONS);
     R(this, "sign");
     R(this, "isLeft");
     /**
      * the axis used to look at the pole
      */
     R(this, "lookAtPoleAxis");
-    this.handLandmarker = e, this.side = t, this.isMyWrist = n, this.drawLandmarks = s, this.sign = this.side == "Left" ? -1 : 1, this.isLeft = this.side == "Left", this.lookAtPoleAxis = this.sign < 0 ? "+x" : "-x", this.root.scale.setScalar(7), this.root.scale.y *= -1, this.root.scale.z *= -1;
+    this.handLandmarker = e, this.side = t, this.isMyWrist = s, this.drawLandmarks = n, this.sign = this.side == "Left" ? -1 : 1, this.isLeft = this.side == "Left", this.lookAtPoleAxis = this.sign < 0 ? "+x" : "-x", this.root.scale.setScalar(7), this.root.scale.y *= -1, this.root.scale.z *= -1;
   }
   predict(e, t) {
-    const n = this.handLandmarker.detectForVideo(e, performance.now());
-    if (n.landmarks.length)
-      for (let s = 0; s < n.landmarks.length; s++) {
-        const a = n.landmarks[s], i = a[this.points.wrist];
+    const s = this.handLandmarker.detectForVideo(e, performance.now());
+    if (s.landmarks.length)
+      for (let n = 0; n < s.landmarks.length; n++) {
+        const d = s.landmarks[n], i = d[this.points.wrist];
         if (this.isMyWrist(i)) {
-          this.updateLandmarks(n.worldLandmarks[s]), this.drawLandmarks && (t.drawConnectors(a, I.HAND_CONNECTIONS, {
+          this.updateLandmarks(s.worldLandmarks[n]), this.drawLandmarks && (t.drawConnectors(d, G.HAND_CONNECTIONS, {
             color: this.side == "Left" ? "#00FF00" : "#0000FF",
             lineWidth: 4
-          }), t.drawLandmarks(a, { color: this.side == "Left" ? "#00FF00" : "#0000FF", lineWidth: 3, radius: 1 }));
+          }), t.drawLandmarks(d, { color: this.side == "Left" ? "#00FF00" : "#0000FF", lineWidth: 3, radius: 1 }));
           break;
         }
       }
@@ -301,57 +301,57 @@ class ue extends H {
    * @param landmark2bones Array the same size as the umber of hand landmarks, and on each positionthe bone that belongs to that point.
    * @see https://ai.google.dev/edge/mediapipe/solutions/vision/hand_landmarker
    */
-  syncHandBones(e, t, n) {
-    const s = st.crossVectors(
-      ae.copy(this.marks.index1.worldPosition).sub(this.marks.wrist.worldPosition),
-      de.copy(this.marks.pinky1.worldPosition).sub(this.marks.wrist.worldPosition)
-    ).normalize(), a = ae.copy(this.marks.palm.worldPosition).sub(this.marks.wrist.worldPosition).normalize(), i = de.copy(this.marks.pinky1.worldPosition).sub(this.marks.index1.worldPosition).normalize();
-    if (!(a.dot(it) > 0.8)) {
+  syncHandBones(e, t, s) {
+    const n = nt.crossVectors(
+      ce.copy(this.marks.index1.worldPosition).sub(this.marks.wrist.worldPosition),
+      le.copy(this.marks.pinky1.worldPosition).sub(this.marks.wrist.worldPosition)
+    ).normalize(), d = ce.copy(this.marks.palm.worldPosition).sub(this.marks.wrist.worldPosition).normalize(), i = le.copy(this.marks.pinky1.worldPosition).sub(this.marks.index1.worldPosition).normalize();
+    if (!(d.dot(it) > 0.8)) {
       if (t.wrist) {
-        const r = W(ce, t.wrist, n).add(a).applyMatrix4(n.matrixWorld), m = W(le, t.wrist, n).sub(i).applyMatrix4(n.matrixWorld), c = this.getGhost(t.wrist);
-        F(c, r, m, "-y"), c.rotateX(pe), c.lerp(t.wrist, e);
+        const r = A(he, t.wrist, s).add(d).applyMatrix4(s.matrixWorld), m = A(me, t.wrist, s).sub(i).applyMatrix4(s.matrixWorld), l = this.getGhost(t.wrist);
+        S(l, r, m, "-y"), l.rotateX(fe), l.lerp(t.wrist, e);
       }
-      this.syncFinger(e, n, s, a, i, t, O.index, "middle1"), this.syncFinger(e, n, s, a, i, t, O.middle, "ring1"), this.syncFinger(e, n, s, a, i, t, O.ring, "pinky1"), this.syncFinger(e, n, s, a, i, t, O.pinky, "ring1", !0), this.syncFinger(e, n, s, a, i, t, O.thumb, "index1");
+      this.syncFinger(e, s, n, d, i, t, T.index, "middle1"), this.syncFinger(e, s, n, d, i, t, T.middle, "ring1"), this.syncFinger(e, s, n, d, i, t, T.ring, "pinky1"), this.syncFinger(e, s, n, d, i, t, T.pinky, "ring1", !0), this.syncFinger(e, s, n, d, i, t, T.thumb, "index1");
     }
   }
-  syncFinger(e, t, n, s, a, i, r, m, c = !1) {
-    for (let f = 0; f < r.length - 1; f++) {
-      const k = i[r[f]];
-      if (!k) continue;
-      const x = this.getGhost(k), d = ce.copy(this.marks[r[f + 1]].worldPosition).sub(this.marks[r[f]].worldPosition).normalize(), h = W(le, k, t);
-      if (f == 0) {
-        const w = he.copy(this.marks[m].worldPosition).sub(this.marks[r[0]].worldPosition).normalize();
-        c && w.negate(), me.copy(w), F(
+  syncFinger(e, t, s, n, d, i, r, m, l = !1) {
+    for (let u = 0; u < r.length - 1; u++) {
+      const y = i[r[u]];
+      if (!y) continue;
+      const x = this.getGhost(y), W = he.copy(this.marks[r[u + 1]].worldPosition).sub(this.marks[r[u]].worldPosition).normalize(), a = A(me, y, t);
+      if (u == 0) {
+        const c = pe.copy(this.marks[m].worldPosition).sub(this.marks[r[0]].worldPosition).normalize();
+        l && c.negate(), ue.copy(c), S(
           x,
-          d.add(h).applyMatrix4(t.matrixWorld),
-          w.add(h).applyMatrix4(t.matrixWorld),
+          W.add(a).applyMatrix4(t.matrixWorld),
+          c.add(a).applyMatrix4(t.matrixWorld),
           this.lookAtPoleAxis
         );
       } else
-        F(
+        S(
           x,
-          d.add(h).applyMatrix4(t.matrixWorld),
-          he.copy(me).add(h).applyMatrix4(t.matrixWorld),
+          W.add(a).applyMatrix4(t.matrixWorld),
+          pe.copy(ue).add(a).applyMatrix4(t.matrixWorld),
           this.lookAtPoleAxis
         );
-      x.rotateX(pe), x.lerp(k, e);
+      x.rotateX(fe), x.lerp(y, e);
     }
   }
   bind(e, t) {
-    const n = {}, s = (a, i) => {
-      const r = P(e, a);
+    const s = {}, n = (d, i) => {
+      const r = P(e, d);
       if (r)
-        return n[i] = r, i;
+        return s[i] = r, i;
     };
-    return s(this.isLeft ? t.handL : t.handR, "wrist"), s(this.isLeft ? t.index1L : t.index1R, "index1"), s(this.isLeft ? t.index2L : t.index2R, "index2"), s(this.isLeft ? t.index3L : t.index3R, "index3"), s(this.isLeft ? t.middle1L : t.middle1R, "middle1"), s(this.isLeft ? t.middle2L : t.middle2R, "middle2"), s(this.isLeft ? t.middle3L : t.middle3R, "middle3"), s(this.isLeft ? t.ring1L : t.ring1R, "ring1"), s(this.isLeft ? t.ring2L : t.ring2R, "ring2"), s(this.isLeft ? t.ring3L : t.ring3R, "ring3"), s(this.isLeft ? t.pinky1L : t.pinky1R, "pinky1"), s(this.isLeft ? t.pinky2L : t.pinky2R, "pinky2"), s(this.isLeft ? t.pinky3L : t.pinky3R, "pinky3"), s(this.isLeft ? t.thumb1L : t.thumb1R, "thumb1"), s(this.isLeft ? t.thumb2L : t.thumb2R, "thumb2"), s(this.isLeft ? t.thumb3L : t.thumb3R, "thumb3"), {
-      update: (a) => {
-        this.syncHandBones(a, n, e);
+    return n(this.isLeft ? t.handL : t.handR, "wrist"), n(this.isLeft ? t.index1L : t.index1R, "index1"), n(this.isLeft ? t.index2L : t.index2R, "index2"), n(this.isLeft ? t.index3L : t.index3R, "index3"), n(this.isLeft ? t.middle1L : t.middle1R, "middle1"), n(this.isLeft ? t.middle2L : t.middle2R, "middle2"), n(this.isLeft ? t.middle3L : t.middle3R, "middle3"), n(this.isLeft ? t.ring1L : t.ring1R, "ring1"), n(this.isLeft ? t.ring2L : t.ring2R, "ring2"), n(this.isLeft ? t.ring3L : t.ring3R, "ring3"), n(this.isLeft ? t.pinky1L : t.pinky1R, "pinky1"), n(this.isLeft ? t.pinky2L : t.pinky2R, "pinky2"), n(this.isLeft ? t.pinky3L : t.pinky3R, "pinky3"), n(this.isLeft ? t.thumb1L : t.thumb1R, "thumb1"), n(this.isLeft ? t.thumb2L : t.thumb2R, "thumb2"), n(this.isLeft ? t.thumb3L : t.thumb3R, "thumb3"), {
+      update: (d) => {
+        this.syncHandBones(d, s, e);
       }
     };
   }
 }
-async function rt(l, o) {
-  const e = await G.createFromOptions(l, {
+async function rt(h, o) {
+  const e = await j.createFromOptions(h, {
     baseOptions: {
       modelAssetPath: (o == null ? void 0 : o.modelPath) ?? "face_landmarker.task",
       delegate: "GPU"
@@ -375,11 +375,11 @@ const at = {
   noseBone: 6,
   chin: 152,
   forehead: 10
-}, dt = new b(), ct = new b(), Le = new b(), lt = new b(), ht = new b();
+}, dt = new b(), ct = new b(), be = new b(), lt = new b(), ht = new b();
 new b();
-class mt extends H {
+class mt extends q {
   constructor(e, t) {
-    super(at, G.FACE_LANDMARKS_TESSELATION);
+    super(at, j.FACE_LANDMARKS_TESSELATION);
     R(this, "blendshapeCategories");
     R(this, "blendshapeMap", /* @__PURE__ */ new Map());
     R(this, "smoothed", {});
@@ -389,9 +389,9 @@ class mt extends H {
     this.faceLandmarker = e, this.cfg = t, this.root.scale.y *= -1, this.root.scale.z *= -1, this.root.scale.multiplyScalar(3);
   }
   predict(e, t) {
-    var s, a, i;
-    const n = this.faceLandmarker.detectForVideo(e, performance.now());
-    n.faceLandmarks[0] && (this.cfg.drawLandmarks && (t.drawConnectors(n.faceLandmarks[0], G.FACE_LANDMARKS_TESSELATION, { color: "#00fff2ff", lineWidth: 0.1 }), t.drawLandmarks(n.faceLandmarks[0], { color: "#00ff00", lineWidth: 0.1, radius: 0.4 })), this.updateLandmarks(n.faceLandmarks[0], n.faceLandmarks[0])), this._faceLandmarks = n.faceLandmarks[0], this.blendshapeCategories = (a = (s = n.faceBlendshapes) == null ? void 0 : s[0]) == null ? void 0 : a.categories, (i = this.blendshapeCategories) == null || i.forEach((r) => {
+    var n, d, i;
+    const s = this.faceLandmarker.detectForVideo(e, performance.now());
+    s.faceLandmarks[0] && (this.cfg.drawLandmarks && (t.drawConnectors(s.faceLandmarks[0], j.FACE_LANDMARKS_TESSELATION, { color: "#00fff2ff", lineWidth: 0.1 }), t.drawLandmarks(s.faceLandmarks[0], { color: "#00ff00", lineWidth: 0.1, radius: 0.4 })), this.updateLandmarks(s.faceLandmarks[0], s.faceLandmarks[0])), this._faceLandmarks = s.faceLandmarks[0], this.blendshapeCategories = (d = (n = s.faceBlendshapes) == null ? void 0 : n[0]) == null ? void 0 : d.categories, (i = this.blendshapeCategories) == null || i.forEach((r) => {
       this.blendshapeMap.set(r.categoryName, r.score);
     });
   }
@@ -401,25 +401,25 @@ class mt extends H {
   bindShapeKeys(e) {
     const t = e.morphTargetDictionary;
     return {
-      update: (n) => {
-        var s;
-        (s = this.blendshapeCategories) == null || s.forEach((a) => {
-          const { categoryName: i, score: r } = a;
+      update: (s) => {
+        var n;
+        (n = this.blendshapeCategories) == null || n.forEach((d) => {
+          const { categoryName: i, score: r } = d;
           if (!(t != null && t.hasOwnProperty(i))) return;
           this.smoothed[i] === void 0 && (this.smoothed[i] = r);
-          const m = 1 - Math.pow(this.smoothing, n);
+          const m = 1 - Math.pow(this.smoothing, s);
           this.smoothed[i] += (r - this.smoothed[i]) * m, e.morphTargetInfluences[t[i]] = this.smoothed[i];
         });
       }
     };
   }
   bind(e) {
-    const t = new fe(e, "L"), n = new fe(e, "R"), s = P(e, "head");
+    const t = new ye(e, "L"), s = new ye(e, "R"), n = P(e, "head");
     return {
-      update: (a) => {
-        if (t.update(a, this.blendshapeMap), n.update(a, this.blendshapeMap), !s) return;
-        const i = dt.copy(this.marks.earL.worldPosition), r = ct.copy(this.marks.earR.worldPosition), m = Le.subVectors(i, r).multiplyScalar(0.5).add(r), c = lt.subVectors(this.marks.noseTip.worldPosition, m), f = i.sub(r), k = W(ht, s, e), x = f.add(k).applyMatrix4(e.matrixWorld), d = c.add(k).applyMatrix4(e.matrixWorld);
-        F(s, d, x, "+x");
+      update: (d) => {
+        if (t.update(d, this.blendshapeMap), s.update(d, this.blendshapeMap), !n) return;
+        const i = dt.copy(this.marks.earL.worldPosition), r = ct.copy(this.marks.earR.worldPosition), m = be.subVectors(i, r).multiplyScalar(0.5).add(r), l = lt.subVectors(this.marks.noseTip.worldPosition, m), u = i.sub(r), y = A(ht, n, e), x = u.add(y).applyMatrix4(e.matrixWorld), W = l.add(y).applyMatrix4(e.matrixWorld);
+        S(n, W, x, "+x");
       }
     };
   }
@@ -432,64 +432,64 @@ class mt extends H {
    */
   bindGeometry(e, t) {
     new b(), new b();
-    const n = new b();
+    const s = new b();
     new b();
-    const a = e.geometry.attributes.position;
-    C(new b(0.5, 0.5, 0.5)), Ce(e);
+    const d = e.geometry.attributes.position;
+    D(new b(0.5, 0.5, 0.5)), Ce(e);
     const i = Se("landmarkIndex", "uint"), r = Me(De, "vec3"), m = Ve(r.element(i)).xy;
-    let c;
-    const f = 116, k = 346, x = n.subVectors(
-      new b(a.getX(f), a.getY(f), a.getZ(f)),
-      new b(a.getX(k), a.getY(k), a.getZ(k))
+    let l;
+    const u = 116, y = 346, x = s.subVectors(
+      new b(d.getX(u), d.getY(u), d.getZ(u)),
+      new b(d.getX(y), d.getY(y), d.getZ(y))
     ).lengthSq();
     console.log("# mesh face reference (live): ", x);
-    const d = C(x), h = C(1);
-    let w;
+    const W = D(x), a = D(1);
+    let c;
     return {
       /**
        * Disposes of the material and removes events listeners on the video element.
        */
       disposeMaterial: () => {
-        w == null || w();
+        c == null || c();
       },
       /**
        * asas
        * @param delta asas
        * @returns 
        */
-      update: (E) => {
-        var g, L;
-        if (!c) {
-          const p = (L = (g = this.cfg) == null ? void 0 : g.videoElementRef) == null ? void 0 : L.call(g);
-          if (!p || !p.videoWidth || !p.videoHeight) return;
-          c = p;
-          const A = new Q(c);
-          A.colorSpace = Y;
-          const T = C(c.videoWidth / c.videoHeight), S = r.element(k).sub(r.element(f)).lengthSq(), be = d.div(S).sqrt().mul(2), xe = r.element(234).xy, q = r.element(93).xy, Re = r.element(454).xy, $ = r.element(323).xy, j = xe.sub(q).div(2).add(q), ve = Re.sub($).div(2).add($).sub(j).div(2).add(j), K = r.element(i).sub(ve).xzy.mul(Ne(1, -1, Oe(1).div(T))).mul(be), M = Te(A, _e(m.x, m.y.oneMinus())), X = () => {
-            const V = new Q(c);
-            V.colorSpace = Y, M.value = V, M.needsUpdate = !0, T.value = c.videoWidth / c.videoHeight;
+      update: (L) => {
+        var E, g;
+        if (!l) {
+          const k = (g = (E = this.cfg) == null ? void 0 : E.videoElementRef) == null ? void 0 : g.call(E);
+          if (!k || !k.videoWidth || !k.videoHeight) return;
+          l = k;
+          const f = new Z(l);
+          f.colorSpace = J;
+          const F = D(l.videoWidth / l.videoHeight), _ = r.element(y).sub(r.element(u)).lengthSq(), B = W.div(_).sqrt().mul(2), M = r.element(234).xy, $ = r.element(93).xy, Re = r.element(454).xy, K = r.element(323).xy, X = M.sub($).div(2).add($), ve = Re.sub(K).div(2).add(K).sub(X).div(2).add(X), Q = r.element(i).sub(ve).xzy.mul(Ne(1, -1, Oe(1).div(F))).mul(B), V = Te(f, _e(m.x, m.y.oneMinus())), Y = () => {
+            const N = new Z(l);
+            N.colorSpace = J, V.value = N, V.needsUpdate = !0, F.value = l.videoWidth / l.videoHeight;
           };
-          c.addEventListener("loadeddata", X), t ? t(K, M) : e.material = new Fe({
-            positionNode: K,
-            colorNode: M,
+          l.addEventListener("loadeddata", Y), t ? t(Q, V) : e.material = new Fe({
+            positionNode: Q,
+            colorNode: V,
             roughness: 0.93
-          }), w = () => {
-            var V;
-            M.value.dispose(), c == null || c.removeEventListener("loadeddata", X), (V = e.material) == null || V.dispose();
+          }), c = () => {
+            var N;
+            V.value.dispose(), l == null || l.removeEventListener("loadeddata", Y), (N = e.material) == null || N.dispose();
           };
         }
-        const y = this.lastKnownLandmarks;
-        if (!(y != null && y.length)) return;
-        h.value = n.subVectors(y[k], y[f]).lengthSq(), h.needsUpdate = !0;
+        const w = this.lastKnownLandmarks;
+        if (!(w != null && w.length)) return;
+        a.value = s.subVectors(w[y], w[u]).lengthSq(), a.needsUpdate = !0;
         const v = r.value.array;
-        for (let p = 0; p < y.length; p++)
-          v[p * 3] = y[p].x, v[p * 3 + 1] = y[p].y, v[p * 3 + 2] = y[p].z;
+        for (let k = 0; k < w.length; k++)
+          v[k * 3] = w[k].x, v[k * 3 + 1] = w[k].y, v[k * 3 + 2] = w[k].z;
         r.value.needsUpdate = !0;
       }
     };
   }
 }
-class fe {
+class ye {
   constructor(o, e) {
     R(this, "eyeBone");
     R(this, "eyeLookOut");
@@ -503,12 +503,12 @@ class fe {
   }
   update(o, e) {
     if (!this.eyeBone) return;
-    W(Le, this.eyeBone, this.rig);
-    const t = e.get(this.eyeLookOut) ?? 0, n = e.get(this.eyeLookIn) ?? 0, s = e.get(this.eyeLookUp) ?? 0, a = e.get(this.eyeLookDown) ?? 0, i = n - t, r = a - s;
+    A(be, this.eyeBone, this.rig);
+    const t = e.get(this.eyeLookOut) ?? 0, s = e.get(this.eyeLookIn) ?? 0, n = e.get(this.eyeLookUp) ?? 0, d = e.get(this.eyeLookDown) ?? 0, i = s - t, r = d - n;
     this.eyeBone.rotation.y = i * this.sign / 2, this.eyeBone.rotation.x = r / 2;
   }
 }
-const ke = {
+const xe = {
   faceMesh: "face",
   head: "head",
   hips: "hips",
@@ -612,93 +612,93 @@ const ke = {
   "mouthUpperUpRight",
   "tongueOut"
 ];
-function ut(l, o, e = 30) {
-  const t = [], n = l.getObjectByName(
+function ut(h, o, e = 30) {
+  const t = [], s = h.getObjectByName(
     o.faceMesh
-  ), s = /* @__PURE__ */ new Set();
-  if (n != null && n.morphTargetDictionary)
-    for (const h in n.morphTargetDictionary)
-      pt.includes(h) && s.add(h);
-  const a = Object.keys(o);
-  l.traverse((h) => {
-    if (h instanceof _.Bone) {
-      const w = a.find((E) => h.name.indexOf(o[E]) === 0);
-      w && t.push({
-        ref: h,
-        name: h.name,
-        normalizedName: w
+  ), n = /* @__PURE__ */ new Set();
+  if (s != null && s.morphTargetDictionary)
+    for (const a in s.morphTargetDictionary)
+      pt.includes(a) && n.add(a);
+  const d = Object.keys(o);
+  h.traverse((a) => {
+    if (a instanceof C.Bone) {
+      const c = d.find((L) => a.name.indexOf(o[L]) === 0);
+      c && t.push({
+        ref: a,
+        name: a.name,
+        normalizedName: c
       });
     }
   });
   const i = [], r = /* @__PURE__ */ new Map(), m = /* @__PURE__ */ new Map();
-  let c = !1, f = 0;
-  function k() {
-    r.clear(), m.clear(), i.length = 0, f = performance.now() / 1e3, c = !0;
+  let l = !1, u = 0;
+  function y() {
+    r.clear(), m.clear(), i.length = 0, u = performance.now() / 1e3, l = !0;
   }
   function x() {
-    if (!c) return;
-    const h = performance.now() / 1e3 - f;
-    i.push(h);
-    for (const w of t) {
-      r.has(w.name) || r.set(w.name, []);
-      const E = r.get(w.name), y = w.ref.quaternion;
-      E.push(y.x, y.y, y.z, y.w);
+    if (!l) return;
+    const a = performance.now() / 1e3 - u;
+    i.push(a);
+    for (const c of t) {
+      r.has(c.name) || r.set(c.name, []);
+      const L = r.get(c.name), w = c.ref.quaternion;
+      L.push(w.x, w.y, w.z, w.w);
     }
-    for (const w of s) {
-      m.has(w) || m.set(w, []);
-      const E = m.get(w), y = n.morphTargetDictionary[w], v = n.morphTargetInfluences[y];
-      E.push(v);
+    for (const c of n) {
+      m.has(c) || m.set(c, []);
+      const L = m.get(c), w = s.morphTargetDictionary[c], v = s.morphTargetInfluences[w];
+      L.push(v);
     }
   }
-  function d(h = "RecordedClip") {
-    c = !1;
-    const w = [];
-    for (const [y, v] of r)
-      w.push(
-        new _.QuaternionKeyframeTrack(
-          `${y}.quaternion`,
+  function W(a = "RecordedClip") {
+    l = !1;
+    const c = [];
+    for (const [w, v] of r)
+      c.push(
+        new C.QuaternionKeyframeTrack(
+          `${w}.quaternion`,
           i,
           v
         )
       );
-    for (const [y, v] of m)
-      w.push(
-        new _.NumberKeyframeTrack(
-          `${ke.faceMesh}.morphTargetInfluences[${y}]`,
+    for (const [w, v] of m)
+      c.push(
+        new C.NumberKeyframeTrack(
+          `${xe.faceMesh}.morphTargetInfluences[${w}]`,
           i,
           v
         )
       );
-    const E = new _.AnimationClip(h, -1, w);
+    const L = new C.AnimationClip(a, -1, c);
     return {
-      clip: E,
+      clip: L,
       saveToFile: () => {
         new ze().parse(
-          l,
+          h,
           (v) => {
-            const g = new Blob([v], {
+            const E = new Blob([v], {
               type: "model/gltf-binary"
-            }), L = URL.createObjectURL(g), p = document.createElement("a");
-            p.href = L, p.download = h + ".glb", p.click();
+            }), g = URL.createObjectURL(E), k = document.createElement("a");
+            k.href = g, k.download = a + ".glb", k.click();
           },
           (v) => {
             console.error(v);
           },
           {
             binary: !0,
-            animations: [E]
+            animations: [L]
           }
         );
       }
     };
   }
-  return { start: k, captureFrame: x, stop: d, isRecording: () => c };
+  return { start: y, captureFrame: x, stop: W, isRecording: () => l };
 }
 const ft = () => {
-  var l;
-  return !!((l = navigator.mediaDevices) != null && l.getUserMedia);
+  var h;
+  return !!((h = navigator.mediaDevices) != null && h.getUserMedia);
 };
-async function Pt(l) {
+async function Pt(h) {
   const o = {
     debugFrame: void 0,
     displayScale: 1,
@@ -713,136 +713,147 @@ async function Pt(l) {
       hand: "https://storage.googleapis.com/mediapipe-models/hand_landmarker/hand_landmarker/float16/1/hand_landmarker.task",
       face: "https://storage.googleapis.com/mediapipe-models/face_landmarker/face_landmarker/float16/1/face_landmarker.task"
     },
-    ...l
+    ...h
   };
   let e;
-  const t = await ge.forVisionTasks(o.modelPaths.vision ?? "/wasm"), n = o.onlyFace ? void 0 : await Xe(t, {
+  const t = await We.forVisionTasks(o.modelPaths.vision ?? "/wasm"), s = o.onlyFace ? void 0 : await Xe(t, {
     ignoreLegs: o.ignoreLegs,
     modelPath: o.modelPaths.pose,
     drawLandmarks: o.drawLandmarksOverlay
-  }), s = o.onlyFace ? void 0 : await ot(t, {
-    leftWrist: () => n.leftWristNormalizedPosition,
-    rightWrist: () => n.rightWristNormalizedPosition,
+  }), n = o.onlyFace ? void 0 : await ot(t, {
+    leftWrist: () => s.leftWristNormalizedPosition,
+    rightWrist: () => s.rightWristNormalizedPosition,
     modelPath: o.modelPaths.hand,
     drawLandmarks: o.drawLandmarksOverlay,
-    ...l == null ? void 0 : l.handsTrackerOptions
-  }), a = o.ignoreFace ? void 0 : await rt(t, { modelPath: o.modelPaths.face, videoElementRef: () => e, drawLandmarks: o.drawLandmarksOverlay }), i = document.createElement("div");
+    ...h == null ? void 0 : h.handsTrackerOptions
+  }), d = o.ignoreFace ? void 0 : await rt(t, { modelPath: o.modelPaths.face, videoElementRef: () => e, drawLandmarks: o.drawLandmarksOverlay }), i = document.createElement("div");
   i.style.position = "absolute", i.style.top = "0px", i.style.left = "0px", i.style.zIndex = "21", i.style.maxWidth = "600px", i.style.width = "100%", i.classList.add("three-mediapipe-rig"), document.body.appendChild(i);
-  const r = document.createElement("canvas"), m = r.getContext("2d"), c = new We(m);
+  const r = document.createElement("canvas"), m = r.getContext("2d"), l = new ge(m);
   r.style.zIndex = "22", r.style.position = "absolute", r.style.top = "0px", r.style.left = "0px", r.style.pointerEvents = "none", r.style.maxWidth = "100%", i.appendChild(r);
-  function f(d) {
-    m.save(), m.clearRect(0, 0, r.width, r.height), n == null || n.predict(d, c), s == null || s.left.predict(d, c), s == null || s.right.predict(d, c), a == null || a.predict(d, c), m.restore();
+  function u(a) {
+    m.save(), m.clearRect(0, 0, r.width, r.height), s == null || s.predict(a, l), n == null || n.left.predict(a, l), n == null || n.right.predict(a, l), d == null || d.predict(a, l), m.restore();
   }
-  function k() {
+  function y() {
     e = document.createElement("video"), i.appendChild(e);
-    let d = -1;
-    e.style.zIndex = "21", e.style.position = "absolute", e.style.top = "0px", e.style.left = "0px", e.style.height = "auto", e.style.maxWidth = "100%", e.style.display = "block", o.debugVideo && (e.src = o.debugVideo, e.controls = !0, e.loop = !0, e.muted = !0, e.controls = !0, e.play());
-    function h() {
-      d !== e.currentTime && e.readyState >= 2 && (f(e), d = e.currentTime), window.requestAnimationFrame(h);
+    let a = -1;
+    e.style.zIndex = "21", e.style.position = "absolute", e.style.top = "0px", e.style.left = "0px", e.style.height = "auto", e.style.maxWidth = "100%", e.style.display = "block", e.muted = !1, o.debugVideo && (e.src = o.debugVideo, e.controls = !0, e.loop = !0, e.muted = !0, e.controls = !0, e.play());
+    function c() {
+      a !== e.currentTime && e.readyState >= 2 && (u(e), a = e.currentTime), window.requestAnimationFrame(c);
     }
     e.addEventListener("loadeddata", () => {
-      e.width = e.videoWidth * o.displayScale, e.height = e.videoHeight * o.displayScale, r.width = e.videoWidth, r.height = e.videoHeight, r.style.height = e.height + "px", r.style.width = e.width + "px", window.requestAnimationFrame(h);
+      const L = e.videoWidth, w = e.videoHeight, g = Math.min(600 / L, 600 / w, 1);
+      e.width = L * g * (o.displayScale ?? 1), e.height = w * g * (o.displayScale ?? 1), r.width = e.width, r.height = e.height, r.style.height = "auto", r.style.width = e.width + "px", r.style.maxWidth = "100%", window.requestAnimationFrame(c);
     });
   }
   if (o.debugFrame) {
-    const d = document.createElement("img");
-    d.src = o.debugFrame, d.style.zIndex = "21", d.style.position = "absolute", d.style.top = "0px", d.style.left = "0px", i.appendChild(d), d.addEventListener("load", () => {
-      d.width = d.naturalWidth * o.displayScale, d.height = d.naturalHeight * o.displayScale, r.width = d.naturalWidth, r.height = d.naturalWidth, r.style.width = d.width + "px", r.style.height = d.height + "px";
-      function h() {
-        f(d);
+    const a = document.createElement("img");
+    a.src = o.debugFrame, a.style.zIndex = "21", a.style.position = "absolute", a.style.top = "0px", a.style.left = "0px", i.appendChild(a), a.addEventListener("load", () => {
+      a.width = a.naturalWidth * o.displayScale, a.height = a.naturalHeight * o.displayScale, r.width = a.naturalWidth, r.height = a.naturalWidth, r.style.width = a.width + "px", r.style.height = a.height + "px";
+      function c() {
+        u(a);
       }
-      window.requestAnimationFrame(h);
+      window.requestAnimationFrame(c);
     });
-  } else o.debugVideo && k();
+  } else o.debugVideo && y();
   let x;
+  function W(a) {
+    e && (e.srcObject ? e.srcObject.getTracks().forEach((L) => L.enabled = a) : a ? e.play() : e.pause());
+  }
   return {
-    poseTracker: n,
-    handsTracker: s,
-    faceTracker: a,
+    poseTracker: s,
+    handsTracker: n,
+    faceTracker: d,
     video: e,
     canvas: r,
     domElement: i,
-    start: async () => {
-      let d = !1;
+    start: async (a = !1) => {
+      let c = !1;
       if (!ft())
         throw new Error("Webcam not supported");
-      e || k();
-      let h;
-      function w(L) {
-        d || (console.warn("Camera track ended, attempting recovery..."), E(L), y(L));
+      e || y();
+      let L;
+      function w(f) {
+        c || (console.warn("Camera track ended, attempting recovery..."), v(f), E(f));
       }
-      function E(L) {
-        h == null || h.getVideoTracks().forEach((p) => p.stop()), h = void 0, L.srcObject = null;
+      function v(f) {
+        L == null || L.getVideoTracks().forEach((F) => F.stop()), L = void 0, f.srcObject = null;
       }
-      async function y(L, p = 0) {
-        const T = Math.min(1e3 * 2 ** p, 16e3);
-        if (p >= 3)
+      async function E(f, F = 0) {
+        const B = Math.min(1e3 * 2 ** F, 16e3);
+        if (F >= 3)
           throw new Error("Camera recovery failed after max attempts");
-        if (await new Promise((S) => setTimeout(S, T)), !d)
+        if (await new Promise((M) => setTimeout(M, B)), !c)
           try {
-            await v(L);
-          } catch (S) {
-            await g(S, L, p + 1);
+            await g(f);
+          } catch (M) {
+            await k(M, f, F + 1);
           }
       }
-      async function v(L) {
-        h = await navigator.mediaDevices.getUserMedia({ video: !0 }), L.srcObject = h, await L.play(), h.getVideoTracks().forEach((p) => {
-          p.addEventListener("ended", () => w(L));
+      async function g(f) {
+        L = await navigator.mediaDevices.getUserMedia({ video: !0, audio: a }), f.srcObject = L, await f.play(), L.getVideoTracks().forEach((F) => {
+          F.addEventListener("ended", () => w(f));
         });
       }
-      async function g(L, p, A = 0) {
-        if (L instanceof DOMException)
-          switch (L.name) {
+      async function k(f, F, _ = 0) {
+        if (f instanceof DOMException)
+          switch (f.name) {
             case "NotAllowedError":
               throw new Error("Permission denied — prompt user to allow camera");
             case "NotFoundError":
-              console.error("No camera found — retry when device is connected"), await y(p, A + 1);
+              console.error("No camera found — retry when device is connected"), await E(F, _ + 1);
               break;
             case "NotReadableError":
               throw new Error("Camera in use by another app");
             default:
-              throw new Error("Camera error: " + L.message);
+              throw new Error("Camera error: " + f.message);
           }
         else
-          throw new Error("Unknown camera error: " + L);
+          throw new Error("Unknown camera error: " + f);
       }
-      return await y(e), x = () => {
-        d = !0, E(e), x = void 0;
+      return await E(e), x = () => {
+        c = !0, v(e), x = void 0;
       }, {
+        getStream: () => L,
         stop: x
       };
     },
-    bind: (d, h) => {
-      if (h = h || ke, !n) throw new Error("Pose tracker not initialized");
-      if (!s) throw new Error("Hands tracker not initialized");
-      if (!a) throw new Error("Face tracker not initialized");
-      const w = n.bind(d, h), E = s.left.bind(d, h), y = s.right.bind(d, h);
-      let v;
-      const g = a == null ? void 0 : a.bind(d);
-      d.traverse((p) => {
-        p instanceof u.Mesh && p.name.indexOf(h.faceMesh) === 0 && (p.frustumCulled = !1, v = a == null ? void 0 : a.bindShapeKeys(p));
+    pause: () => {
+      W(!1);
+    },
+    resume: () => {
+      W(!0);
+    },
+    bind: (a, c) => {
+      if (c = c || xe, !s) throw new Error("Pose tracker not initialized");
+      if (!n) throw new Error("Hands tracker not initialized");
+      if (!d) throw new Error("Face tracker not initialized");
+      const L = s.bind(a, c), w = n.left.bind(a, c), v = n.right.bind(a, c);
+      let E;
+      const g = d == null ? void 0 : d.bind(a);
+      a.traverse((f) => {
+        f instanceof p.Mesh && f.name.indexOf(c.faceMesh) === 0 && (f.frustumCulled = !1, E = d == null ? void 0 : d.bindShapeKeys(f));
       });
-      const L = ut(d, h);
+      const k = ut(a, c);
       return {
         /**
          * Will save the tracked movement of the rig to an animation clip.
          * Only the bones moved by the bone mapping will be recorded.
          */
-        startRecording: L.start,
-        stopRecording: L.stop,
-        isRecording: () => L.isRecording(),
-        update: (p) => {
-          w.update(p), E.update(p), y.update(p), v == null || v.update(p), g == null || g.update(p), L.isRecording() && L.captureFrame();
+        startRecording: k.start,
+        stopRecording: k.stop,
+        isRecording: () => k.isRecording(),
+        update: (f) => {
+          L.update(f), w.update(f), v.update(f), E == null || E.update(f), g == null || g.update(f), k.isRecording() && k.captureFrame();
         }
       };
     },
-    setVideoFromSource: (d) => {
-      x == null || x(), e || k(), e.src = d instanceof File ? URL.createObjectURL(d) : d, e.controls = !0, e.loop = !0, e.muted = !0, e.controls = !0, e.play();
+    setVideoFromSource: (a) => {
+      x == null || x(), e || y(), e.src = a instanceof File ? URL.createObjectURL(a) : a, e.controls = !0, e.loop = !0, e.muted = !0, e.controls = !0, e.play();
     },
-    async setVideoFromWebcam() {
-      if (e || k(), x)
+    async setVideoFromWebcam(a = !1) {
+      if (e || y(), x)
         throw new Error("Webcam already started");
-      return await this.start();
+      return await this.start(a);
     }
   };
 }