feat: animator

src/components/3d/AnimatedModel.tsx

@@ -66,48 +66,14 @@ export function AnimatedModel({
   children,
 }: AnimatedModelProps): React.JSX.Element {
   const groupRef = useRef<THREE.Group>(null);
+
+  void groupRef;
   const { scene, animations } = useGLTF(modelPath);
-  const { actions, names, mixer } = useAnimations(animations, groupRef);
+  const { actions, names, mixer } = useAnimations(animations, scene);
+
   const [currentAnim, setCurrentAnim] = useState(defaultAnimation);
   const [isReady, setIsReady] = useState(false);
 
-  // DEBUG: Analyser la structure du modèle
-  useEffect(() => {
-    console.log("=== DEBUG ANIMATED MODEL ===");
-    console.log("modelPath:", modelPath);
-    console.log("scene:", scene);
-    console.log("scene.children.length:", scene.children.length);
-    console.log(
-      "scene.children types:",
-      scene.children.map((c) => c.type),
-    );
-
-    let foundMesh = false;
-    let foundSkeleton = false;
-
-    scene.traverse((child: THREE.Object3D) => {
-      if (child.type === "SkinnedMesh") {
-        console.log("✅ Found SkinnedMesh:", child.name);
-        console.log("  visible:", child.visible);
-        console.log("  skeleton:", (child as THREE.SkinnedMesh).skeleton);
-        foundMesh = true;
-      }
-      if (child.type === "Mesh") {
-        console.log("✅ Found Mesh:", child.name);
-        console.log("  visible:", child.visible);
-        foundMesh = true;
-      }
-      if (child.type === "Skeleton") {
-        console.log("✅ Found Skeleton:", child);
-        foundSkeleton = true;
-      }
-    });
-
-    if (!foundMesh) console.log("❌ AUCUN MESH TROUVÉ!");
-    if (!foundSkeleton) console.log("❌ AUCUN SKELETON TROUVÉ!");
-    console.log("=========================");
-  }, [scene, modelPath]);
-
   useEffect(() => {
     if (mixer) {
       mixer.timeScale = speed;
@@ -179,35 +145,30 @@ export function AnimatedModel({
 
   useEffect(() => {
     if (autoPlay && names.length > 0) {
-      // Essayer d'abord l'animation par défaut, sinon la première disponible
+      console.log(`[AnimatedModel] Available animations: ${names.join(", ")}`);
+
       let defaultAction = actions[defaultAnimation as string];
 
-      // Si l'animation par défaut n'existe pas, utiliser la première disponible
       if (!defaultAction && names.length > 0) {
         console.log(
-          `Animation "${defaultAnimation}" non trouvée, utilisation de:`,
-          names[0],
+          `[AnimatedModel] "${defaultAnimation}" not found, using: ${names[0]}`,
         );
         defaultAction = actions[names[0] as string];
       }
 
       if (defaultAction) {
-        console.log("Lecture de l'animation:", defaultAction.getClip().name);
         defaultAction.play();
         setIsReady(true);
         setCurrentAnim(defaultAction.getClip().name);
         onLoaded?.();
       } else {
-        console.log("Aucune animation disponible dans les actions");
+        console.log("[AnimatedModel] No available animation in actions");
       }
     } else if (names.length === 0) {
-      console.log("Aucune animation trouvée dans le modèle");
+      console.log("[AnimatedModel] No animation found in model");
     }
   }, [actions, defaultAnimation, names, autoPlay, onLoaded]);
 
-  const parsedScale =
-    typeof scale === "number" ? ([scale, scale, scale] as Vector3Tuple) : scale;
-
   const contextValue: AnimatedModelContextValue = {
     play,
     stop,
@@ -218,17 +179,23 @@ export function AnimatedModel({
     names,
   };
 
+  // Apply transforms to scene directly
+  useEffect(() => {
+    scene.position.set(...position);
+    scene.rotation.set(
+      (rotation[0] * Math.PI) / 180,
+      (rotation[1] * Math.PI) / 180,
+      (rotation[2] * Math.PI) / 180,
+    );
+    const s =
+      typeof scale === "number" ? [scale, scale, scale] : (scale ?? [1, 1, 1]);
+    scene.scale.set(s[0] ?? 1, s[1] ?? 1, s[2] ?? 1);
+  }, [scene, position, rotation, scale]);
+
   return (
     <AnimatedModelContext.Provider value={contextValue}>
-      <group
-        ref={groupRef}
-        position={position}
-        rotation={rotation}
-        scale={parsedScale}
-      >
-        <primitive object={scene.clone()} />
-        {children}
-      </group>
+      <primitive object={scene} />
+      {children}
     </AnimatedModelContext.Provider>
   );
 }