@sage-rsc/talking-head-react 1.6.2 → 1.6.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sage-rsc/talking-head-react",
-  "version": "1.6.2",
+  "version": "1.6.3",
   "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/SimpleTalkingAvatar.jsx

@@ -89,21 +89,10 @@ const SimpleTalkingAvatar = forwardRef(({
       // Priority 1: If both manifest and auto are provided, use manifest (more reliable)
       if (animations.manifest && animations.auto) {
         try {
-          console.log('🔄 Loading animations from manifest (priority over auto-discovery):', animations.manifest);
           const manifestAnimations = await loadAnimationsFromManifest(animations.manifest);
           setLoadedAnimations(manifestAnimations);
-          console.log('✅ Animations loaded from manifest:', manifestAnimations);
-          
-          if (manifestAnimations._genderSpecific) {
-            console.log('👥 Gender-specific animations detected:', {
-              male: Object.keys(manifestAnimations._genderSpecific.male || {}),
-              female: Object.keys(manifestAnimations._genderSpecific.female || {}),
-              shared: Object.keys(manifestAnimations._genderSpecific.shared || {})
-            });
-          }
           return; // Don't try auto-discovery if manifest loaded successfully
         } catch (error) {
-          console.warn('⚠️ Manifest failed, falling back to auto-discovery:', error);
           // Fall through to auto-discovery
         }
       }
@@ -111,39 +100,23 @@ const SimpleTalkingAvatar = forwardRef(({
       // Option 1: Load from manifest file only
       if (animations.manifest && !animations.auto) {
         try {
-          console.log('🔄 Loading animations from manifest:', animations.manifest);
           const manifestAnimations = await loadAnimationsFromManifest(animations.manifest);
           setLoadedAnimations(manifestAnimations);
-          console.log('✅ Animations loaded and set:', manifestAnimations);
-          
-          // Log gender-specific groups if available
-          if (manifestAnimations._genderSpecific) {
-            console.log('👥 Gender-specific animations detected:', {
-              male: Object.keys(manifestAnimations._genderSpecific.male || {}),
-              female: Object.keys(manifestAnimations._genderSpecific.female || {}),
-              shared: Object.keys(manifestAnimations._genderSpecific.shared || {})
-            });
-          } else {
-            console.log('⚠️ No gender-specific animations found in manifest');
-          }
         } catch (error) {
-          console.error('❌ Failed to load animation manifest:', error);
+          console.error('Failed to load animation manifest:', error);
           setLoadedAnimations(animations);
         }
       }
       // Option 2: Auto-discover from folders (with manifest fallback)
       else if (animations.auto) {
         try {
-          console.log('🔄 Auto-discovering animations from folder:', animations.auto);
-          
           // First, try to load manifest as fallback
           let manifestAnimations = null;
           if (animations.manifest) {
             try {
               manifestAnimations = await loadAnimationsFromManifest(animations.manifest);
-              console.log('📦 Loaded manifest as fallback:', manifestAnimations);
             } catch (e) {
-              console.warn('⚠️ Could not load manifest fallback:', e);
+              // Silent fallback
             }
           }
           
@@ -169,7 +142,6 @@ const SimpleTalkingAvatar = forwardRef(({
             
             // If no animations discovered, use manifest fallback
             if (!hasAnimations && manifestAnimations) {
-              console.log('⚠️ No animations auto-discovered, using manifest fallback');
               setLoadedAnimations(manifestAnimations);
               return;
             }
@@ -227,7 +199,6 @@ const SimpleTalkingAvatar = forwardRef(({
             }
             
             setLoadedAnimations(organized);
-            console.log('✅ Auto-discovered animations:', organized);
           }
           // If auto is an object, treat keys as group names and values as folder paths
           else if (typeof animations.auto === 'object') {
@@ -235,21 +206,18 @@ const SimpleTalkingAvatar = forwardRef(({
             const hasAnimations = Object.values(discoveredAnimations).some(anims => Array.isArray(anims) && anims.length > 0);
             
             if (!hasAnimations && manifestAnimations) {
-              console.log('⚠️ No animations auto-discovered, using manifest fallback');
               setLoadedAnimations(manifestAnimations);
             } else {
               setLoadedAnimations(discoveredAnimations);
-              console.log('✅ Auto-discovered animations from folders:', discoveredAnimations);
             }
           }
         } catch (error) {
-          console.error('❌ Failed to auto-discover animations:', error);
+          console.error('Failed to auto-discover animations:', error);
           // Try manifest fallback
           if (animations.manifest) {
             try {
               const manifestAnimations = await loadAnimationsFromManifest(animations.manifest);
               setLoadedAnimations(manifestAnimations);
-              console.log('✅ Using manifest fallback after auto-discovery error');
             } catch (e) {
               setLoadedAnimations(animations);
             }
@@ -260,7 +228,6 @@ const SimpleTalkingAvatar = forwardRef(({
       }
       // Option 3: Use animations from props directly
       else {
-        console.log('📝 Using animations from props (no manifest or auto):', animations);
         setLoadedAnimations(animations);
       }
     };
@@ -343,12 +310,6 @@ const SimpleTalkingAvatar = forwardRef(({
 
       talkingHeadRef.current = new TalkingHead(containerRef.current, defaultOptions);
 
-      // Debug: Log avatar config to verify body type is passed
-      console.log('Avatar config being passed:', {
-        url: defaultAvatarConfig.url,
-        body: defaultAvatarConfig.body,
-        avatarMood: defaultAvatarConfig.avatarMood
-      });
 
       await talkingHeadRef.current.showAvatar(defaultAvatarConfig, (ev) => {
         if (ev.lengthComputable) {
@@ -357,10 +318,6 @@ const SimpleTalkingAvatar = forwardRef(({
         }
       });
 
-      // Debug: Verify avatar body was set correctly
-      if (talkingHeadRef.current?.avatar) {
-        console.log('Avatar body after initialization:', talkingHeadRef.current.avatar.body);
-      }
 
       setIsLoading(false);
       setIsReady(true);
@@ -409,7 +366,6 @@ const SimpleTalkingAvatar = forwardRef(({
         const audioCtx = talkingHeadRef.current.audioCtx || talkingHeadRef.current.audioContext;
         if (audioCtx && (audioCtx.state === 'suspended' || audioCtx.state === 'interrupted')) {
           await audioCtx.resume();
-          console.log('Audio context resumed');
         }
       } catch (err) {
         console.warn('Failed to resume audio context:', err);
@@ -420,7 +376,6 @@ const SimpleTalkingAvatar = forwardRef(({
   // Helper function to get random animation from a group (with gender support)
   const getRandomAnimation = useCallback((groupName) => {
     if (!loadedAnimations) {
-      console.warn('No animations loaded');
       return null;
     }
     
@@ -435,28 +390,19 @@ const SimpleTalkingAvatar = forwardRef(({
       // Try gender-specific first
       if (genderGroups && genderGroups[groupName]) {
         group = genderGroups[groupName];
-        console.log(`Using ${genderKey} animations for "${groupName}":`, group);
       } 
       // Fallback to shared gender-specific animations
       else if (loadedAnimations._genderSpecific.shared && loadedAnimations._genderSpecific.shared[groupName]) {
         group = loadedAnimations._genderSpecific.shared[groupName];
-        console.log(`Using shared animations for "${groupName}":`, group);
       }
     }
     
     // Fallback to root-level animations if gender-specific not found
     if (!group && loadedAnimations[groupName]) {
       group = loadedAnimations[groupName];
-      console.log(`Using root-level animations for "${groupName}":`, group);
     }
     
     if (!group) {
-      console.warn(`Animation group "${groupName}" not found. Available groups:`, Object.keys(loadedAnimations).filter(k => k !== '_genderSpecific'));
-      if (loadedAnimations._genderSpecific) {
-        const avatarGender = avatarBody?.toUpperCase() || 'F';
-        const genderKey = avatarGender === 'M' ? 'male' : 'female';
-        console.warn(`Gender-specific groups (${genderKey}):`, Object.keys(loadedAnimations._genderSpecific[genderKey] || {}));
-      }
       return null;
     }
     
@@ -471,20 +417,28 @@ const SimpleTalkingAvatar = forwardRef(({
       return group;
     }
     
-    console.warn(`Animation group "${groupName}" is not a valid format (expected array or string):`, group);
     return null;
   }, [loadedAnimations, avatarBody]);
+  
+  // Helper function to extract animation name from path
+  const getAnimationName = useCallback((animationPath) => {
+    if (!animationPath) return 'Unknown';
+    const filename = animationPath.split('/').pop();
+    return filename.replace('.fbx', '').replace(/[-_]/g, ' ');
+  }, []);
 
   // Helper function to play random animation from a group with smooth transitions
   const playRandomAnimation = useCallback((groupName, disablePositionLock = false, onFinished = null) => {
     if (!talkingHeadRef.current) {
-      console.warn('TalkingHead not initialized yet');
       return null;
     }
     
     const animationPath = getRandomAnimation(groupName);
     if (animationPath) {
       try {
+        const animationName = getAnimationName(animationPath);
+        console.log(`🎬 Playing animation: "${animationName}"`);
+        
         // Create callback that will play next animation if still speaking
         const animationFinishedCallback = () => {
           // If still speaking and same group, play next random animation
@@ -500,28 +454,23 @@ const SimpleTalkingAvatar = forwardRef(({
         
         // Play animation with callback - fade transitions are handled in playAnimation
         talkingHeadRef.current.playAnimation(animationPath, null, 10, 0, 0.01, disablePositionLock, animationFinishedCallback);
-        console.log(`✅ Playing random animation from "${groupName}" group:`, animationPath);
         
         return animationPath;
       } catch (error) {
-        console.error(`❌ Failed to play random animation from "${groupName}" group:`, error);
+        console.error(`Failed to play animation:`, error);
         return null;
       }
-    } else {
-      console.warn(`⚠️ No animation found for group "${groupName}"`);
     }
     return null;
-  }, [getRandomAnimation]);
+  }, [getRandomAnimation, getAnimationName]);
 
   // Speak text with proper callback handling
   const speakText = useCallback(async (textToSpeak, options = {}) => {
     if (!talkingHeadRef.current || !isReady) {
-      console.warn('Avatar not ready for speaking');
       return;
     }
 
     if (!textToSpeak || textToSpeak.trim() === '') {
-      console.warn('No text provided to speak');
       return;
     }
 
@@ -532,8 +481,6 @@ const SimpleTalkingAvatar = forwardRef(({
     // Check both autoAnimationGroup prop and options.animationGroup
     const animationGroup = options.animationGroup || autoAnimationGroup;
     if (animationGroup && !options.skipAnimation) {
-      console.log(`🎬 Attempting to play animation from group: "${animationGroup}"`);
-      console.log(`📊 Current avatarBody: "${avatarBody}", loadedAnimations:`, loadedAnimations);
       
       // Mark as speaking and track animation group for continuous playback
       isSpeakingRef.current = true;
@@ -541,7 +488,6 @@ const SimpleTalkingAvatar = forwardRef(({
       
       playRandomAnimation(animationGroup);
     } else {
-      console.log(`⏭️ Skipping animation (group: ${animationGroup}, skipAnimation: ${options.skipAnimation})`);
     }
 
     // Reset speech progress tracking

package/src/utils/animationLoader.js

@@ -11,28 +11,15 @@
  */
 export async function loadAnimationsFromManifest(manifestPath) {
   try {
-    console.log(`📥 Loading animation manifest from: ${manifestPath}`);
     const response = await fetch(manifestPath);
     if (!response.ok) {
       throw new Error(`Failed to fetch manifest: ${response.status} ${response.statusText}`);
     }
     const manifest = await response.json();
-    console.log('📦 Raw manifest loaded:', manifest);
-    
     const animations = manifest.animations || {};
-    console.log('✅ Processed animations object:', animations);
-    
-    if (animations._genderSpecific) {
-      console.log('👥 Gender-specific structure detected:', {
-        male: Object.keys(animations._genderSpecific.male || {}),
-        female: Object.keys(animations._genderSpecific.female || {}),
-        shared: Object.keys(animations._genderSpecific.shared || {})
-      });
-    }
-    
     return animations;
   } catch (error) {
-    console.error('❌ Failed to load animation manifest:', error);
+    console.error('Failed to load animation manifest:', error);
     return {};
   }
 }
@@ -148,7 +135,6 @@ export async function autoDiscoverAnimationsFromFolder(folderPath, avatarBody =
             .map(file => file.startsWith('/') ? file : `${normalizedPath}/${file}`);
           
           if (fbxFiles.length > 0) {
-            console.log(`✅ Auto-discovered ${fbxFiles.length} animations from ${endpoint}`);
             return fbxFiles;
           }
         }
@@ -182,7 +168,6 @@ export async function autoDiscoverAnimationsFromFolder(folderPath, avatarBody =
           .map(file => file.startsWith('/') ? file : `${genderFolder}/${file}`);
         
         if (fbxFiles.length > 0) {
-          console.log(`✅ Auto-discovered ${fbxFiles.length} animations from ${genderFolder}`);
           animations.push(...fbxFiles);
         }
       }
@@ -205,9 +190,6 @@ export async function autoDiscoverAnimationsFromFolder(folderPath, avatarBody =
     'idle1.fbx', 'idle2.fbx', 'idle_01.fbx', 'idle_02.fbx'
   ];
   
-  console.warn(`⚠️ Could not auto-discover animations from ${normalizedPath}. Consider using a manifest.json file or a server-side directory listing API.`);
-  console.info(`💡 Tip: Create a ${normalizedPath}/.list.json file with an array of FBX filenames, or use animations: { manifest: "/animations/manifest.json" }`);
-  
   return animations;
 }
 
@@ -228,9 +210,6 @@ export async function autoLoadAnimationsFromFolders(folderPaths, avatarBody = 'F
       const discoveredAnimations = await autoDiscoverAnimationsFromFolder(folderPath, avatarBody);
       if (discoveredAnimations.length > 0) {
         animations[groupName] = discoveredAnimations;
-        console.log(`✅ Auto-loaded ${discoveredAnimations.length} animations for group "${groupName}"`);
-      } else {
-        console.warn(`⚠️ No animations found in ${folderPath} for group "${groupName}"`);
       }
     } catch (error) {
       console.error(`❌ Failed to auto-load animations from ${folderPath}:`, error);