flo-bit.dev
[READ-ONLY] Mirror of https://github.com/flo-bit/room. tiny 3d rooms saved locally or in your bluesky account, svelte/threlte
flo-bit.dev/room/
2.4 kB
90 lines
1<!--
2Auto-generated by: https://github.com/threlte/threlte/tree/main/packages/gltf
3Command: npx @threlte/gltf@3.0.0 static/models/kenney-furniture-kit/doorway.glb -t -s
4-->
5
6<script lang="ts">
7 import type * as THREE from 'three'
8
9 import type { Snippet } from 'svelte'
10 import { T, type Props } from '@threlte/core'
11 import { useGltf } from '@threlte/extras'
12 import { base } from '$app/paths';
13
14 let {
15 fallback,
16 error,
17 children,
18 ref = $bindable(),
19 colors,
20 opacity,
21 ...props
22 }: Props<THREE.Group> & {
23 ref?: THREE.Group
24 children?: Snippet<[{ ref: THREE.Group }]>
25 fallback?: Snippet
26 error?: Snippet<[{ error: Error }]>
27 colors?: (number | string)[];
28 opacity?: number;
29 } = $props();
30
31 type GLTFResult = {
32 nodes: {
33 ['doorway(Clone)']: THREE.Mesh
34 Mesh_door: THREE.Mesh
35 Mesh_door_1: THREE.Mesh
36 }
37 materials: {
38 wood: THREE.MeshStandardMaterial
39 metal: THREE.MeshStandardMaterial
40 }
41 }
42
43 const gltf = useGltf<GLTFResult>(base + '/models/kenney-furniture-kit/doorway.glb');
44</script>
45
46<T.Group
47 bind:ref
48 dispose={false}
49 {...props}
50>
51 {#await gltf}
52 {@render fallback?.()}
53 {:then gltf}
54 <T.Mesh
55 castShadow
56 receiveShadow
57 geometry={gltf.nodes['doorway(Clone)'].geometry}
58 material={gltf.materials.wood.clone()}
59 material.color={colors?.[1] ?? gltf.materials.wood.color}
60 material.opacity={opacity ?? gltf.materials.wood.opacity}
61 material.transparent={opacity !== undefined}
62 position={[-0.23, 0.0, 0.0]}
63 >
64 <T.Group position={[0.03, 0, -0.04]}>
65 <T.Mesh
66 castShadow
67 receiveShadow
68 geometry={gltf.nodes.Mesh_door.geometry}
69 material={gltf.materials.wood.clone()}
70 material.color={colors?.[0] ?? gltf.materials.wood.color}
71 material.opacity={opacity ?? gltf.materials.wood.opacity}
72 material.transparent={opacity !== undefined}
73 />
74 <T.Mesh
75 castShadow
76 receiveShadow
77 geometry={gltf.nodes.Mesh_door_1.geometry}
78 material={gltf.materials.metal.clone()}
79 material.color={colors?.[2] ?? gltf.materials.metal.color}
80 material.opacity={opacity ?? gltf.materials.metal.opacity}
81 material.transparent={opacity !== undefined}
82 />
83 </T.Group>
84 </T.Mesh>
85 {:catch err}
86 {@render error?.({ error: err })}
87 {/await}
88
89 {@render children?.({ ref })}
90</T.Group>