68 lines
2.4 KiB
JavaScript
68 lines
2.4 KiB
JavaScript
import { useLoader } from "@react-three/fiber";
|
|
import { TextureLoader } from "three";
|
|
import { DoubleSide } from "three";
|
|
import Chair from "./Chair.jsx";
|
|
|
|
export default function Desk({ position = [0, 0, 0], nameplateColor = "#52b6ff", onSelect }) {
|
|
const appleLogoTexture = useLoader(TextureLoader, "/apple-logo.png");
|
|
|
|
return (
|
|
<group
|
|
position={position}
|
|
onPointerDown={(event) => {
|
|
event.stopPropagation();
|
|
onSelect?.();
|
|
}}
|
|
>
|
|
<mesh position={[0, 0.72, -0.08]}>
|
|
<boxGeometry args={[2.1, 1.5, 2.1]} />
|
|
<meshBasicMaterial transparent opacity={0} />
|
|
</mesh>
|
|
<mesh castShadow receiveShadow position={[0, 0.78, 0]}>
|
|
<boxGeometry args={[1.9, 0.16, 1.15]} />
|
|
<meshStandardMaterial color="#b78256" roughness={0.86} />
|
|
</mesh>
|
|
{[
|
|
[-0.78, 0.38, -0.43],
|
|
[0.78, 0.38, -0.43],
|
|
[-0.78, 0.38, 0.43],
|
|
[0.78, 0.38, 0.43]
|
|
].map((leg, index) => (
|
|
<mesh key={index} castShadow receiveShadow position={leg}>
|
|
<boxGeometry args={[0.12, 0.76, 0.12]} />
|
|
<meshStandardMaterial color="#8e603b" roughness={0.9} />
|
|
</mesh>
|
|
))}
|
|
|
|
<group position={[0, 0.92, 0]} rotation={[0, Math.PI, 0]}>
|
|
<mesh castShadow receiveShadow position={[0, 0.02, 0.02]}>
|
|
<boxGeometry args={[0.64, 0.04, 0.42]} />
|
|
<meshStandardMaterial color="#c3c9d2" roughness={0.36} metalness={0.52} />
|
|
</mesh>
|
|
<group position={[0, 0.055, -0.19]} rotation={[-Math.PI / 2, 0, 0]}>
|
|
<mesh castShadow receiveShadow position={[0, 0, 0.2]}>
|
|
<boxGeometry args={[0.62, 0.03, 0.4]} />
|
|
<meshStandardMaterial color="#c8ced6" roughness={0.28} metalness={0.58} />
|
|
</mesh>
|
|
<mesh position={[0, 0.022, 0.2]} rotation={[-Math.PI / 2, 0, Math.PI]}>
|
|
<planeGeometry args={[0.18, 0.18]} />
|
|
<meshBasicMaterial
|
|
map={appleLogoTexture}
|
|
transparent
|
|
alphaTest={0.1}
|
|
side={DoubleSide}
|
|
toneMapped={false}
|
|
/>
|
|
</mesh>
|
|
</group>
|
|
</group>
|
|
|
|
<mesh castShadow receiveShadow position={[0.65, 0.9, 0.18]}>
|
|
<boxGeometry args={[0.26, 0.1, 0.26]} />
|
|
<meshStandardMaterial color={nameplateColor} roughness={0.55} />
|
|
</mesh>
|
|
<Chair position={[0, 0, -1.05]} />
|
|
</group>
|
|
);
|
|
}
|