Fix interior objects

This commit is contained in:
bmathews 2025-11-13 23:48:41 -08:00
parent 37738e4249
commit cb0f6b05c6
2 changed files with 53 additions and 32 deletions

View file

@ -7,8 +7,8 @@ import {
getRotation, getRotation,
getScale, getScale,
} from "@/src/mission"; } from "@/src/mission";
import { Suspense, useMemo } from "react"; import { memo, Suspense, useEffect, useMemo } from "react";
import { Material, Mesh } from "three"; import { Material, Mesh, MeshBasicMaterial } from "three";
import { setupColor } from "@/src/textureUtils"; import { setupColor } from "@/src/textureUtils";
const FALLBACK_URL = `${BASE_URL}/black.png`; const FALLBACK_URL = `${BASE_URL}/black.png`;
@ -31,7 +31,13 @@ function InteriorTexture({ material }: { material: Material }) {
const texture = useTexture(url, (texture) => setupColor(texture)); const texture = useTexture(url, (texture) => setupColor(texture));
return <meshStandardMaterial map={texture} />; useEffect(() => {
const asBasicMaterial = material as MeshBasicMaterial;
asBasicMaterial.map = texture;
asBasicMaterial.needsUpdate = true;
}, [material, texture]);
return <primitive object={material} attach="material" />;
} }
function InteriorMesh({ node }: { node: Mesh }) { function InteriorMesh({ node }: { node: Mesh }) {
@ -48,29 +54,37 @@ function InteriorMesh({ node }: { node: Mesh }) {
<meshStandardMaterial color="yellow" wireframe /> <meshStandardMaterial color="yellow" wireframe />
} }
> >
<InteriorTexture material={node.material} /> {Array.isArray(node.material) ? (
node.material.map((mat, index) => (
<InteriorTexture key={index} material={mat} />
))
) : (
<InteriorTexture material={node.material} />
)}
</Suspense> </Suspense>
) : null} ) : null}
</mesh> </mesh>
); );
} }
export function InteriorModel({ interiorFile }: { interiorFile: string }) { export const InteriorModel = memo(
const { nodes } = useInterior(interiorFile); ({ interiorFile }: { interiorFile: string }) => {
const { nodes } = useInterior(interiorFile);
return ( return (
<> <>
{Object.entries(nodes) {Object.entries(nodes)
// .filter( .filter(
// ([name, node]: [string, any]) => true ([name, node]: [string, any]) =>
// // !node.material || !node.material.name.match(/\.\d+$/) !node.material || !node.material.name.match(/\.\d+$/)
// ) )
.map(([name, node]: [string, any]) => ( .map(([name, node]: [string, any]) => (
<InteriorMesh key={name} node={node} /> <InteriorMesh key={name} node={node} />
))} ))}
</> </>
); );
} }
);
function InteriorPlaceholder() { function InteriorPlaceholder() {
return ( return (
@ -81,17 +95,23 @@ function InteriorPlaceholder() {
); );
} }
export function InteriorInstance({ object }: { object: ConsoleObject }) { export const InteriorInstance = memo(
const interiorFile = getProperty(object, "interiorFile").value; ({ object }: { object: ConsoleObject }) => {
const [z, y, x] = useMemo(() => getPosition(object), [object]); const interiorFile = getProperty(object, "interiorFile").value;
const [scaleX, scaleY, scaleZ] = useMemo(() => getScale(object), [object]); const [z, y, x] = useMemo(() => getPosition(object), [object]);
const q = useMemo(() => getRotation(object, true), [object]); const [scaleX, scaleY, scaleZ] = useMemo(() => getScale(object), [object]);
const q = useMemo(() => getRotation(object, true), [object]);
return ( return (
<group quaternion={q} position={[x, y, z]} scale={[scaleX, scaleY, scaleZ]}> <group
<Suspense fallback={<InteriorPlaceholder />}> quaternion={q}
<InteriorModel interiorFile={interiorFile} /> position={[x - 1024, y, z - 1024]}
</Suspense> scale={[-scaleX, scaleY, -scaleZ]}
</group> >
); <Suspense fallback={<InteriorPlaceholder />}>
} <InteriorModel interiorFile={interiorFile} />
</Suspense>
</group>
);
}
);

1
package-lock.json generated
View file

@ -1165,6 +1165,7 @@
"resolved": "https://registry.npmjs.org/@react-three/fiber/-/fiber-9.3.0.tgz", "resolved": "https://registry.npmjs.org/@react-three/fiber/-/fiber-9.3.0.tgz",
"integrity": "sha512-myPe3YL/C8+Eq939/4qIVEPBW/uxV0iiUbmjfwrs9sGKYDG8ib8Dz3Okq7BQt8P+0k4igedONbjXMQy84aDFmQ==", "integrity": "sha512-myPe3YL/C8+Eq939/4qIVEPBW/uxV0iiUbmjfwrs9sGKYDG8ib8Dz3Okq7BQt8P+0k4igedONbjXMQy84aDFmQ==",
"license": "MIT", "license": "MIT",
"peer": true,
"dependencies": { "dependencies": {
"@babel/runtime": "^7.17.8", "@babel/runtime": "^7.17.8",
"@types/react-reconciler": "^0.32.0", "@types/react-reconciler": "^0.32.0",