@sage-rsc/talking-head-react 1.3.7 → 1.3.9

package/dist/index.js

@@ -4395,18 +4395,31 @@ class Be {
   }
   /**
    * Apply shoulder adjustment to lower shoulders to a more natural position
+   * This is called from updatePoseBase for pose-based animations
    */
   applyShoulderAdjustment() {
-    const e = new y.Euler();
+    const t = new y.Euler(), e = 1;
     if (this.poseAvatar.props["LeftShoulder.quaternion"]) {
       const n = this.poseAvatar.props["LeftShoulder.quaternion"];
-      e.setFromQuaternion(n, "XYZ"), e.x += -0.6, n.setFromEuler(e, "XYZ");
+      t.setFromQuaternion(n, "XYZ"), t.x > e && (t.x = Math.max(e, t.x - 0.4)), n.setFromEuler(t, "XYZ");
     }
     if (this.poseAvatar.props["RightShoulder.quaternion"]) {
       const n = this.poseAvatar.props["RightShoulder.quaternion"];
-      e.setFromQuaternion(n, "XYZ"), e.x += -0.6, n.setFromEuler(e, "XYZ");
+      t.setFromQuaternion(n, "XYZ"), t.x > e && (t.x = Math.max(e, t.x - 0.4)), n.setFromEuler(t, "XYZ");
     }
   }
+  /**
+   * Apply shoulder adjustment directly to bone objects
+   * This is called AFTER FBX animations update to ensure shoulders stay relaxed
+   * regardless of what the animation sets
+   */
+  applyShoulderAdjustmentToBones() {
+    if (!this.armature) return;
+    const t = this.armature.getObjectByName("LeftShoulder"), e = this.armature.getObjectByName("RightShoulder");
+    if (!t || !e) return;
+    const n = new y.Euler(), i = new y.Quaternion(), s = 1;
+    t.quaternion && (n.setFromQuaternion(t.quaternion, "XYZ"), n.x > s && (n.x = Math.max(s, n.x - 0.4)), i.setFromEuler(n, "XYZ"), t.quaternion.copy(i), t.updateMatrixWorld(!0)), e.quaternion && (n.setFromQuaternion(e.quaternion, "XYZ"), n.x > s && (n.x = Math.max(s, n.x - 0.4)), i.setFromEuler(n, "XYZ"), e.quaternion.copy(i), e.updateMatrixWorld(!0));
+  }
   /**
   * Update avatar pose deltas
   */
@@ -5208,7 +5221,7 @@ class Be {
         eyeLookOutRight: [null, 0],
         eyeContact: [0]
       }
-    })))), e > 2 * this.animFrameDur && (e = 2 * this.animFrameDur), (this.viewName !== "full" || this.isAvatarOnly) && (n = this.mtRandomized[Math.floor(Math.random() * this.mtRandomized.length)], i = this.mtAvatar[n], i.needsUpdate || Object.assign(i, { base: (this.mood.baseline[n] || 0) + (1 + l / 255) * Math.random() / 5, needsUpdate: !0 })), this.updatePoseBase(this.animClock), this.mixer && this.mixer.update(e / 1e3 * this.mixer.timeScale), this.updatePoseDelta(), (this.isSpeaking || this.isListening) && h ? l > this.volumeMax ? (this.volumeHeadBase = 0.05, Math.random() > 0.6 && (this.volumeHeadTarget = -0.05 - Math.random() / 15), this.volumeMax = l) : (this.volumeMax *= 0.92, this.volumeHeadTarget = this.volumeHeadBase - 0.9 * (this.volumeHeadBase - this.volumeHeadTarget)) : (this.volumeHeadTarget = 0, this.volumeMax = 0), n = this.volumeHeadTarget - this.volumeHeadCurrent, i = Math.abs(n), i > 1e-4 && (o = i * (this.volumeHeadEasing(Math.min(1, this.volumeHeadVelocity * e / 1e3 / i) / 2 + 0.5) - 0.5), this.volumeHeadCurrent += Math.sign(n) * Math.min(i, o)), Math.abs(this.volumeHeadCurrent) > 1e-4 && ($.setFromAxisAngle(mt, this.volumeHeadCurrent), this.objectNeck.quaternion.multiply($)), We.setFromObject(this.armature), this.objectLeftToeBase.getWorldPosition(ve), ve.sub(this.armature.position), this.objectRightToeBase.getWorldPosition(Re), Re.sub(this.armature.position), this.objectHips.position.y -= We.min.y / 2, this.objectHips.position.x -= (ve.x + Re.x) / 4, this.objectHips.position.z -= (ve.z + Re.z) / 2, this.dynamicbones.update(e), this.fbxAnimationLoader && this.fbxAnimationLoader.update(), this.opt.update && this.opt.update(e), this.updateMorphTargets(e), this.isAvatarOnly)
+    })))), e > 2 * this.animFrameDur && (e = 2 * this.animFrameDur), (this.viewName !== "full" || this.isAvatarOnly) && (n = this.mtRandomized[Math.floor(Math.random() * this.mtRandomized.length)], i = this.mtAvatar[n], i.needsUpdate || Object.assign(i, { base: (this.mood.baseline[n] || 0) + (1 + l / 255) * Math.random() / 5, needsUpdate: !0 })), this.updatePoseBase(this.animClock), this.mixer && this.mixer.update(e / 1e3 * this.mixer.timeScale), this.updatePoseDelta(), (this.isSpeaking || this.isListening) && h ? l > this.volumeMax ? (this.volumeHeadBase = 0.05, Math.random() > 0.6 && (this.volumeHeadTarget = -0.05 - Math.random() / 15), this.volumeMax = l) : (this.volumeMax *= 0.92, this.volumeHeadTarget = this.volumeHeadBase - 0.9 * (this.volumeHeadBase - this.volumeHeadTarget)) : (this.volumeHeadTarget = 0, this.volumeMax = 0), n = this.volumeHeadTarget - this.volumeHeadCurrent, i = Math.abs(n), i > 1e-4 && (o = i * (this.volumeHeadEasing(Math.min(1, this.volumeHeadVelocity * e / 1e3 / i) / 2 + 0.5) - 0.5), this.volumeHeadCurrent += Math.sign(n) * Math.min(i, o)), Math.abs(this.volumeHeadCurrent) > 1e-4 && ($.setFromAxisAngle(mt, this.volumeHeadCurrent), this.objectNeck.quaternion.multiply($)), We.setFromObject(this.armature), this.objectLeftToeBase.getWorldPosition(ve), ve.sub(this.armature.position), this.objectRightToeBase.getWorldPosition(Re), Re.sub(this.armature.position), this.objectHips.position.y -= We.min.y / 2, this.objectHips.position.x -= (ve.x + Re.x) / 4, this.objectHips.position.z -= (ve.z + Re.z) / 2, this.dynamicbones.update(e), this.fbxAnimationLoader && this.fbxAnimationLoader.update(), this.applyShoulderAdjustmentToBones(), this.opt.update && this.opt.update(e), this.updateMorphTargets(e), this.isAvatarOnly)
       this.stats && this.stats.end();
     else {
       if (this.cameraClock !== null && this.cameraClock < 1e3) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sage-rsc/talking-head-react",
-  "version": "1.3.7",
+  "version": "1.3.9",
   "description": "A reusable React component for 3D talking avatars with lip-sync and text-to-speech",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",

package/scripts/update-talkinghead.sh

@@ -0,0 +1,51 @@
+#!/bin/bash
+# Script to help update TalkingHead while preserving customizations
+
+set -e
+
+echo "=== TalkingHead Update Helper ==="
+echo ""
+echo "This script helps identify customizations to preserve during update."
+echo ""
+
+# Colors for output
+GREEN='\033[0;32m'
+YELLOW='\033[1;33m'
+NC='\033[0m' # No Color
+
+echo -e "${GREEN}Step 1: Identifying custom methods...${NC}"
+echo ""
+echo "=== Position Locking Methods ==="
+grep -n "lockAvatarPosition\|unlockAvatarPosition\|maintainLockedPosition" src/lib/talkinghead.mjs | head -20
+
+echo ""
+echo "=== Shoulder Adjustment Methods ==="
+grep -n "applyShoulderAdjustment" src/lib/talkinghead.mjs | head -10
+
+echo ""
+echo "=== Position Locking Calls ==="
+grep -n "lockAvatarPosition\|unlockAvatarPosition\|positionWasLocked\|lockedPosition" src/lib/talkinghead.mjs | head -20
+
+echo ""
+echo -e "${YELLOW}Step 2: Custom files to preserve (DO NOT REPLACE):${NC}"
+echo "- src/components/TalkingHeadComponent.jsx"
+echo "- src/components/TalkingHeadAvatar.jsx"
+echo "- src/components/SimpleTalkingAvatar.jsx"
+echo "- src/components/CurriculumLearning.jsx"
+echo "- src/config/ttsConfig.js"
+echo "- src/lib/enhancedFBXLoader.js"
+echo "- src/lib/fbxAnimationLoader.js"
+echo "- src/utils/animationLoader.js"
+echo "- scripts/generate-animation-manifest.js"
+
+echo ""
+echo -e "${GREEN}Step 3: Next steps:${NC}"
+echo "1. Download latest TalkingHead source"
+echo "2. Compare talkinghead.mjs files"
+echo "3. Merge changes while preserving custom methods above"
+echo "4. Test thoroughly"
+echo ""
+echo "To compare files, use:"
+echo "  diff -u old-talkinghead.mjs src/lib/talkinghead.mjs > talkinghead.diff"
+echo ""
+

package/src/lib/talkinghead.mjs

@@ -1615,17 +1615,20 @@ class TalkingHead {
   
   /**
    * Apply shoulder adjustment to lower shoulders to a more natural position
+   * This is called from updatePoseBase for pose-based animations
    */
   applyShoulderAdjustment() {
-    // Shoulder adjustment: reduce X-axis rotation by ~0.6 radians (34 degrees) to lower shoulders to a relaxed position
-    const shoulderAdjustment = -0.6; // Negative to lower shoulders (increased for more relaxed look)
     const tempEuler = new THREE.Euler();
+    const maxX = 1.0; // Maximum X rotation for relaxed shoulders
     
     // Adjust left shoulder
     if (this.poseAvatar.props['LeftShoulder.quaternion']) {
       const leftShoulder = this.poseAvatar.props['LeftShoulder.quaternion'];
       tempEuler.setFromQuaternion(leftShoulder, 'XYZ');
-      tempEuler.x += shoulderAdjustment; // Reduce X rotation to lower shoulder
+      // Reduce X rotation if too high for relaxed shoulders
+      if (tempEuler.x > maxX) {
+        tempEuler.x = Math.max(maxX, tempEuler.x - 0.4);
+      }
       leftShoulder.setFromEuler(tempEuler, 'XYZ');
     }
     
@@ -1633,10 +1636,62 @@ class TalkingHead {
     if (this.poseAvatar.props['RightShoulder.quaternion']) {
       const rightShoulder = this.poseAvatar.props['RightShoulder.quaternion'];
       tempEuler.setFromQuaternion(rightShoulder, 'XYZ');
-      tempEuler.x += shoulderAdjustment; // Reduce X rotation to lower shoulder
+      // Reduce X rotation if too high for relaxed shoulders
+      if (tempEuler.x > maxX) {
+        tempEuler.x = Math.max(maxX, tempEuler.x - 0.4);
+      }
       rightShoulder.setFromEuler(tempEuler, 'XYZ');
     }
   }
+  
+  /**
+   * Apply shoulder adjustment directly to bone objects
+   * This is called AFTER FBX animations update to ensure shoulders stay relaxed
+   * regardless of what the animation sets
+   */
+  applyShoulderAdjustmentToBones() {
+    if (!this.armature) return;
+    
+    // Get shoulder bones directly from armature
+    const leftShoulderBone = this.armature.getObjectByName('LeftShoulder');
+    const rightShoulderBone = this.armature.getObjectByName('RightShoulder');
+    
+    if (!leftShoulderBone || !rightShoulderBone) return;
+    
+    const tempEuler = new THREE.Euler();
+    const tempQuaternion = new THREE.Quaternion();
+    
+    // Target relaxed shoulder rotation for natural appearance
+    // Reduce X rotation (forward tilt) to lower shoulders
+    // Typical values: 1.5-1.8 (high/stiff) -> 0.9-1.1 (relaxed)
+    const maxX = 1.0; // Maximum X rotation for relaxed shoulders
+    
+    // Adjust left shoulder bone directly
+    if (leftShoulderBone.quaternion) {
+      tempEuler.setFromQuaternion(leftShoulderBone.quaternion, 'XYZ');
+      // Reduce X rotation if it's too high for relaxed shoulders
+      if (tempEuler.x > maxX) {
+        // Smooth interpolation towards relaxed position
+        tempEuler.x = Math.max(maxX, tempEuler.x - 0.4);
+      }
+      tempQuaternion.setFromEuler(tempEuler, 'XYZ');
+      leftShoulderBone.quaternion.copy(tempQuaternion);
+      leftShoulderBone.updateMatrixWorld(true);
+    }
+    
+    // Adjust right shoulder bone directly
+    if (rightShoulderBone.quaternion) {
+      tempEuler.setFromQuaternion(rightShoulderBone.quaternion, 'XYZ');
+      // Reduce X rotation if it's too high for relaxed shoulders
+      if (tempEuler.x > maxX) {
+        // Smooth interpolation towards relaxed position
+        tempEuler.x = Math.max(maxX, tempEuler.x - 0.4);
+      }
+      tempQuaternion.setFromEuler(tempEuler, 'XYZ');
+      rightShoulderBone.quaternion.copy(tempQuaternion);
+      rightShoulderBone.updateMatrixWorld(true);
+    }
+  }
 
   /**
   * Update avatar pose deltas
@@ -3221,6 +3276,10 @@ class TalkingHead {
     if (this.fbxAnimationLoader) {
       this.fbxAnimationLoader.update();
     }
+    
+    // Apply shoulder adjustment AFTER FBX animations to ensure relaxed shoulders
+    // This overrides any shoulder positions set by animations
+    this.applyShoulderAdjustmentToBones();
 
     // Custom update
     if ( this.opt.update ) {