@sage-rsc/talking-head-react 1.0.49 → 1.0.51

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sage-rsc/talking-head-react",
-  "version": "1.0.49",
+  "version": "1.0.51",
   "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/src/components/TalkingHeadAvatar.jsx

@@ -289,120 +289,71 @@ const TalkingHeadAvatar = forwardRef(({
           const talkingHead = talkingHeadRef.current;
           
           // Set up a polling mechanism to detect when speech finishes
-          // Wait for audio to actually start playing before checking if it's finished
           let checkInterval = null;
           let checkCount = 0;
-          let audioStarted = false;
           const maxChecks = 1200; // 60 seconds max (50ms intervals)
-          const maxWaitForAudioStart = 10000; // 10 seconds max to wait for audio to start
+          let callbackFired = false;
           
-          // First, wait for audio to actually start playing (API call completes and audio is added to playlist)
-          let waitForAudioStartCount = 0;
-          const waitForAudioStart = setInterval(() => {
-            waitForAudioStartCount++;
-            
-            // Check if audio has started playing (audioPlaylist has items OR isAudioPlaying is true)
-            // Also check if isSpeaking is true (indicating API call has started processing)
-            if (talkingHead && talkingHead.isSpeaking && (
-              (talkingHead.audioPlaylist && talkingHead.audioPlaylist.length > 0) ||
-              (talkingHead.isAudioPlaying === true)
-            )) {
-              audioStarted = true;
-              clearInterval(waitForAudioStart);
-              
-              // Now start checking if speech has finished
-              checkInterval = setInterval(checkSpeechFinished, 50);
-            }
-            
-            // Also check if speech queue is empty and not speaking (meaning all sentences processed)
-            // This handles the case where text was split into sentences but all are processed
-            const speechQueueEmpty = !talkingHead.speechQueue || talkingHead.speechQueue.length === 0;
-            
-            if (talkingHead && !talkingHead.isSpeaking && speechQueueEmpty && 
-                (!talkingHead.audioPlaylist || talkingHead.audioPlaylist.length === 0) &&
-                (!talkingHead.isAudioPlaying || talkingHead.isAudioPlaying === false)) {
-              // All speech has finished (all sentences processed and audio finished)
-              clearInterval(waitForAudioStart);
-              try {
-                options.onSpeechEnd();
-              } catch (e) {
-                console.error('Error in onSpeechEnd callback:', e);
-              }
-              return;
-            }
-            
-            // Timeout if audio doesn't start within reasonable time
-            if (waitForAudioStartCount * 50 > maxWaitForAudioStart) {
-              clearInterval(waitForAudioStart);
-              // Check if speech has actually started (isSpeaking should be true)
-              // If isSpeaking is false, the speech might have failed or completed very quickly
-              if (talkingHead && talkingHead.isSpeaking) {
-                // Still waiting for API, but assume it will start soon
-                audioStarted = true;
-                checkInterval = setInterval(checkSpeechFinished, 50);
-              } else if (talkingHead && !talkingHead.isSpeaking && speechQueueEmpty &&
-                         (!talkingHead.audioPlaylist || talkingHead.audioPlaylist.length === 0) &&
-                         (!talkingHead.isAudioPlaying || talkingHead.isAudioPlaying === false)) {
-                // Speech never started or finished immediately, call callback
-                try {
-                  options.onSpeechEnd();
-                } catch (e) {
-                  console.error('Error in onSpeechEnd callback:', e);
-                }
-              }
-            }
-          }, 50);
-          
-          const checkSpeechFinished = () => {
+          // Start checking immediately - don't wait for audio to start
+          checkInterval = setInterval(() => {
             checkCount++;
+            
+            // Safety timeout - call callback anyway after max time
             if (checkCount > maxChecks) {
-              // Timeout - call callback anyway
               if (checkInterval) {
                 clearInterval(checkInterval);
                 checkInterval = null;
               }
-              try {
-                options.onSpeechEnd();
-              } catch (e) {
-                console.error('Error in onSpeechEnd callback:', e);
+              if (!callbackFired) {
+                callbackFired = true;
+                try {
+                  options.onSpeechEnd();
+                } catch (e) {
+                  console.error('Error in onSpeechEnd callback (timeout):', e);
+                }
               }
               return;
             }
             
-            // Only check if audio has started playing
-            if (!audioStarted) {
-              return;
-            }
-            
             // Check if speech has finished:
-            // 1. Not speaking OR speech queue is empty
-            // 2. Audio playlist is empty (no more audio to play)
-            // 3. Not currently playing audio
-            // 4. Speech queue is empty (all sentences have been processed)
+            // 1. isSpeaking is false (not currently processing speech)
+            // 2. speechQueue is empty (all sentences processed)
+            // 3. audioPlaylist is empty (no more audio to play)
+            // 4. isAudioPlaying is false (not currently playing audio)
             const speechQueueEmpty = !talkingHead.speechQueue || talkingHead.speechQueue.length === 0;
+            const audioPlaylistEmpty = !talkingHead.audioPlaylist || talkingHead.audioPlaylist.length === 0;
             
             const isFinished = talkingHead && 
-              (!talkingHead.isSpeaking || talkingHead.isSpeaking === false) && 
-              (!talkingHead.audioPlaylist || talkingHead.audioPlaylist.length === 0) &&
-              (!talkingHead.isAudioPlaying || talkingHead.isAudioPlaying === false) &&
-              speechQueueEmpty;
+              talkingHead.isSpeaking === false && 
+              speechQueueEmpty &&
+              audioPlaylistEmpty &&
+              talkingHead.isAudioPlaying === false;
             
-            if (isFinished) {
-              if (checkInterval) {
-                clearInterval(checkInterval);
-                checkInterval = null;
-              }
-              
-              // Small delay to ensure everything is settled
+            if (isFinished && !callbackFired) {
+              // Double-check after a small delay to ensure it's really finished
               setTimeout(() => {
-                try {
-                  options.onSpeechEnd();
-                } catch (e) {
-                  console.error('Error in onSpeechEnd callback:', e);
+                // Re-check one more time to be sure
+                const finalCheck = talkingHead && 
+                  talkingHead.isSpeaking === false && 
+                  (!talkingHead.speechQueue || talkingHead.speechQueue.length === 0) &&
+                  (!talkingHead.audioPlaylist || talkingHead.audioPlaylist.length === 0) &&
+                  talkingHead.isAudioPlaying === false;
+                
+                if (finalCheck && !callbackFired) {
+                  callbackFired = true;
+                  if (checkInterval) {
+                    clearInterval(checkInterval);
+                    checkInterval = null;
+                  }
+                  try {
+                    options.onSpeechEnd();
+                  } catch (e) {
+                    console.error('Error in onSpeechEnd callback:', e);
+                  }
                 }
-              }, 50);
+              }, 100);
             }
-          };
+          }, 100); // Check every 100ms for better reliability
         }
         
         if (talkingHeadRef.current.lipsync && Object.keys(talkingHeadRef.current.lipsync).length > 0) {

package/src/lib/talkinghead.mjs

@@ -180,9 +180,9 @@ class TalkingHead {
       lightSpotDispersion: 1,
       avatarMood: "neutral",
       avatarMute: false,
-      avatarIdleEyeContact: 0.2,
+      avatarIdleEyeContact: 0.6,
       avatarIdleHeadMove: 0.5,
-      avatarSpeakingEyeContact: 0.5,
+      avatarSpeakingEyeContact: 0.8,
       avatarSpeakingHeadMove: 0.5,
       avatarIgnoreCamera: false,
       listeningSilenceThresholdLevel: 40,
@@ -426,7 +426,7 @@ class TalkingHead {
 
     this.animMoods = {
       'neutral' : {
-        baseline: { eyesLookDown: 0.1 },
+        baseline: { eyesLookDown: 0 },
         speech: { deltaRate: 0, deltaPitch: 0, deltaVolume: 0 },
         anims: [
           { name: 'breathing', delay: 1500, dt: [ 1200,500,1000 ], vs: { chestInhale: [0.5,0.5,0] } },
@@ -448,7 +448,7 @@ class TalkingHead {
         ]
       },
       'happy' : {
-        baseline: { mouthSmile: 0.2, eyesLookDown: 0.1 },
+        baseline: { mouthSmile: 0.2, eyesLookDown: 0 },
         speech: { deltaRate: 0, deltaPitch: 0.1, deltaVolume: 0 },
         anims: [
           { name: 'breathing', delay: 1500, dt: [ 1200,500,1000 ], vs: { chestInhale: [0.5,0.5,0] } },
@@ -2100,14 +2100,14 @@ class TalkingHead {
     
     console.log('Body movement set to:', movement);
     
-    // Ensure avatar is in full body mode for body movements
-    if (movement !== 'idle') {
-      this.setShowFullAvatar(true);
-      // Don't lock position for code-based animations - they should be stable by design
-    } else {
+    // Respect the current showFullAvatar setting instead of forcing it to true
+    // Only unlock position when returning to idle
+    if (movement === 'idle') {
       // Unlock position when returning to idle
       this.unlockAvatarPosition();
     }
+    // Note: We no longer force showFullAvatar to true for body movements
+    // The avatar will use whatever showFullAvatar value was set by the user
     
     // Apply body movement animation
     this.applyBodyMovementAnimation();