@stowkit/three-loader 0.1.34 → 0.1.39

package/dist/stowkit-three-loader.js

@@ -610,11 +610,19 @@ class StowKitPack {
             materialData.push({ name, schemaId, propertyCount, properties: [] });
             metadataOffset += 196;
         }
-        // Skip Node array and node_mesh_indices (not needed for rendering)
-        // Node struct: transform[16 floats] + name[64 bytes] + mesh_index[4 bytes] + parent_index[4 bytes] = 116 bytes
+        // Parse Node array to calculate total mesh indices
+        // Node struct: name[64] + parent_index[4] + position[12] + rotation[16] + scale[12] + mesh_count[4] + first_mesh_index[4] = 116 bytes
         const NODE_STRIDE = 116;
+        let totalMeshIndices = 0;
+        for (let n = 0; n < nodeCount; n++) {
+            const nodeOffset = metadataOffset + n * NODE_STRIDE;
+            // mesh_count is at offset 64 + 4 + 12 + 16 + 12 = 108 within Node struct
+            const meshCount = metaView.getUint32(nodeOffset + 108, true);
+            totalMeshIndices += meshCount;
+        }
         metadataOffset += nodeCount * NODE_STRIDE;
-        metadataOffset += nodeCount * 4;
+        // Skip node_mesh_indices array (totalMeshIndices entries, not nodeCount!)
+        metadataOffset += totalMeshIndices * 4;
         // Parse material properties
         const PROPERTY_STRIDE = 144;
         for (let i = 0; i < materialCount; i++) {
@@ -692,7 +700,8 @@ class StowKitPack {
             const bone = bones[i];
             const bindPose = bindPoses[i];
             const parentIndex = parentIndices[i];
-            if (parentIndex < 0) {
+            if (parentIndex < 0 || parentIndex >= bindPoses.length) {
+                // Root bone or invalid parent - use bind pose directly
                 const pos = new THREE__namespace.Vector3();
                 const quat = new THREE__namespace.Quaternion();
                 const scale = new THREE__namespace.Vector3();
@@ -722,7 +731,9 @@ class StowKitPack {
             const material = new THREE__namespace.MeshStandardMaterial({
                 side: THREE__namespace.DoubleSide,
                 name: mat.name || `Material_${i}`,
-                color: new THREE__namespace.Color(0.8, 0.8, 0.8) // Default gray
+                color: new THREE__namespace.Color(0.8, 0.8, 0.8), // Default gray
+                metalness: 0.5,
+                roughness: 0.5
             });
             // Apply non-texture properties
             for (const prop of mat.properties) {
@@ -789,6 +800,8 @@ class StowKitPack {
         skinnedMesh.bind(skeleton, skinnedMesh.matrixWorld);
         skinnedMesh.normalizeSkinWeights();
         skinnedMesh.updateMatrixWorld(true);
+        // Ensure frustum culling doesn't hide the mesh if bounds are wrong
+        skinnedMesh.frustumCulled = false;
         const container = new THREE__namespace.Group();
         container.name = stringId || 'SkinnedMesh';
         container.add(boneContainer);
@@ -995,22 +1008,99 @@ class StowKitPack {
      */
     async loadAnimation(skinnedMeshGroup, animationPath) {
         const clip = await this.loadAnimationClip(animationPath);
+        const retargetedClip = this.retargetAnimationClip(clip, skinnedMeshGroup);
         const mixer = new THREE__namespace.AnimationMixer(skinnedMeshGroup);
-        const action = mixer.clipAction(clip);
+        const action = mixer.clipAction(retargetedClip);
         action.setLoop(THREE__namespace.LoopRepeat, Infinity);
         action.play();
-        return { mixer, action, clip };
+        return { mixer, action, clip: retargetedClip };
     }
     /**
      * Load and play animation by index
      */
     async loadAnimationByIndex(skinnedMeshGroup, animationIndex) {
         const clip = await this.loadAnimationClipByIndex(animationIndex);
+        const retargetedClip = this.retargetAnimationClip(clip, skinnedMeshGroup);
         const mixer = new THREE__namespace.AnimationMixer(skinnedMeshGroup);
-        const action = mixer.clipAction(clip);
+        const action = mixer.clipAction(retargetedClip);
         action.setLoop(THREE__namespace.LoopRepeat, Infinity);
         action.play();
-        return { mixer, action, clip };
+        return { mixer, action, clip: retargetedClip };
+    }
+    /**
+     * Retarget animation clip to match skeleton bone names
+     */
+    retargetAnimationClip(clip, skinnedMeshGroup) {
+        // Collect all bone names from the skeleton
+        const skeletonBoneNames = new Set();
+        skinnedMeshGroup.traverse((child) => {
+            if (child.isBone) {
+                skeletonBoneNames.add(child.name);
+            }
+        });
+        // Build a mapping from animation bone names to skeleton bone names
+        // Try to match by suffix (e.g., "CharacterRig_MainHipJ" -> "MainHipJ")
+        const boneNameMap = new Map();
+        for (const track of clip.tracks) {
+            const trackParts = track.name.split('.');
+            const animBoneName = trackParts[0];
+            if (skeletonBoneNames.has(animBoneName)) {
+                // Exact match - no remapping needed
+                continue;
+            }
+            // Try to find a match by suffix
+            for (const skelBoneName of skeletonBoneNames) {
+                // Check if animation bone name ends with skeleton bone name
+                // e.g., "CharacterRig_MainHipJ" contains "MainHipJ"
+                if (animBoneName.endsWith(skelBoneName) ||
+                    animBoneName.endsWith('_' + skelBoneName) ||
+                    skelBoneName.endsWith(animBoneName) ||
+                    skelBoneName.endsWith('_' + animBoneName)) {
+                    boneNameMap.set(animBoneName, skelBoneName);
+                    break;
+                }
+                // Also try matching without common prefixes
+                const animSuffix = animBoneName.replace(/^.*_/, '');
+                const skelSuffix = skelBoneName.replace(/^.*_/, '');
+                if (animSuffix === skelSuffix && animSuffix.length > 2) {
+                    boneNameMap.set(animBoneName, skelBoneName);
+                    break;
+                }
+            }
+        }
+        // If no remapping needed, return original clip
+        if (boneNameMap.size === 0) {
+            return clip;
+        }
+        console.log(`[StowKit] Retargeting animation: ${boneNameMap.size} bones remapped`);
+        // Create new tracks with remapped names
+        const newTracks = [];
+        for (const track of clip.tracks) {
+            const trackParts = track.name.split('.');
+            const animBoneName = trackParts[0];
+            const property = trackParts.slice(1).join('.');
+            const mappedBoneName = boneNameMap.get(animBoneName) || animBoneName;
+            const newTrackName = `${mappedBoneName}.${property}`;
+            // Clone the track with the new name
+            // Use generic KeyframeTrack constructor to avoid type issues with specific track types
+            const times = track.times;
+            const values = track.values;
+            let newTrack;
+            if (track instanceof THREE__namespace.VectorKeyframeTrack) {
+                newTrack = new THREE__namespace.VectorKeyframeTrack(newTrackName, times, values);
+            }
+            else if (track instanceof THREE__namespace.QuaternionKeyframeTrack) {
+                newTrack = new THREE__namespace.QuaternionKeyframeTrack(newTrackName, times, values);
+            }
+            else if (track instanceof THREE__namespace.NumberKeyframeTrack) {
+                newTrack = new THREE__namespace.NumberKeyframeTrack(newTrackName, times, values);
+            }
+            else {
+                newTrack = new THREE__namespace.KeyframeTrack(newTrackName, times, values);
+            }
+            newTracks.push(newTrack);
+        }
+        return new THREE__namespace.AnimationClip(clip.name, clip.duration, newTracks);
     }
     /**
      * Load animation clip by index
@@ -1192,6 +1282,8 @@ class StowKitPack {
             URL.revokeObjectURL(url);
             reader.PerfLogger.log(`[Perf] ✓ Texture "${textureName}": 0ms (IndexedDB cache)`);
             const texture = new THREE__namespace.CompressedTexture([{ data: cached.data, width: cached.width, height: cached.height }], cached.width, cached.height, cached.format, THREE__namespace.UnsignedByteType);
+            // All textures default to sRGB. Data textures are set to linear in applyTextureToMaterial.
+            texture.colorSpace = THREE__namespace.SRGBColorSpace;
             texture.needsUpdate = true;
             return texture;
         }
@@ -1199,6 +1291,9 @@ class StowKitPack {
             const texture = await new Promise((resolve, reject) => {
                 this.ktx2Loader.load(url, (texture) => {
                     URL.revokeObjectURL(url);
+                    // All textures default to sRGB. Data textures (normal, metallic, roughness)
+                    // are set back to linear in applyTextureToMaterial.
+                    texture.colorSpace = THREE__namespace.SRGBColorSpace;
                     texture.needsUpdate = true;
                     resolve(texture);
                 }, undefined, (error) => {
@@ -1232,18 +1327,26 @@ class StowKitPack {
         const propNameLower = propertyName.toLowerCase();
         if (propNameLower === 'maintex' || propNameLower.includes('diffuse') ||
             propNameLower.includes('albedo') || propNameLower.includes('base')) {
+            // Color texture - keep sRGB (default)
             material.map = texture;
         }
         else if (propNameLower.includes('normal')) {
+            // Data texture - use linear
+            texture.colorSpace = THREE__namespace.LinearSRGBColorSpace;
             material.normalMap = texture;
         }
         else if (propNameLower.includes('metallic')) {
+            // Data texture - use linear
+            texture.colorSpace = THREE__namespace.LinearSRGBColorSpace;
             material.metalnessMap = texture;
         }
         else if (propNameLower.includes('roughness')) {
+            // Data texture - use linear
+            texture.colorSpace = THREE__namespace.LinearSRGBColorSpace;
             material.roughnessMap = texture;
         }
         else {
+            // Default to color texture - keep sRGB
             material.map = texture;
         }
         material.needsUpdate = true;