flo-bit.dev
[READ-ONLY] Mirror of https://github.com/flo-bit/one-hour-sushi.
flo-bit.dev/one-hour-sushi/
fix music
author
Florian
date
(May 24, 2025, 8:57 PM +0200)
commit
601a362e
601a362ef6249f471552062c9174b912726eca59
parent
e7695137
e769513791219bfdfe52510d321847b87d1d34b8
+24
-9
+7
package-lock.json
+7
package-lock.json
···
15
15
"@threlte/rapier": "^3.1.4",
16
16
"@threlte/studio": "^0.1.7",
17
17
"@types/three": "^0.176.0",
18
+
"howler": "^2.2.4",
18
19
"three": "^0.176.0"
19
20
},
20
21
"devDependencies": {
···
3171
3172
"engines": {
3172
3173
"node": ">=8"
3173
3174
}
3175
+
},
3176
+
"node_modules/howler": {
3177
+
"version": "2.2.4",
3178
+
"resolved": "https://registry.npmjs.org/howler/-/howler-2.2.4.tgz",
3179
+
"integrity": "sha512-iARIBPgcQrwtEr+tALF+rapJ8qSc+Set2GJQl7xT1MQzWaVkFebdJhR3alVlSiUf5U7nAANKuj3aWpwerocD5w==",
3180
+
"license": "MIT"
3174
3181
},
3175
3182
"node_modules/ignore": {
3176
3183
"version": "5.3.2",
+1
package.json
+1
package.json
+2
-9
src/lib/Scene.svelte
+2
-9
src/lib/Scene.svelte
···
1
1
<script>
2
-
import { T, useTask } from '@threlte/core';
3
-
import { interactivity, OrbitControls, Sky } from '@threlte/extras';
4
-
import { Debug } from '@threlte/rapier';
5
-
import { Spring } from 'svelte/motion';
2
+
import { T } from '@threlte/core';
3
+
import { interactivity, Sky } from '@threlte/extras';
6
4
import Particle from './Particle.svelte';
7
5
import Ground from './Ground.svelte';
8
6
import { game, ids } from './main.svelte';
9
-
import { Audio, AudioListener } from '@threlte/extras';
10
7
import { base } from '$app/paths';
11
8
import GltfModel from './GLTFModel.svelte';
12
9
···
20
17
</script>
21
18
22
19
<T.OrthographicCamera makeDefault zoom={100} position={[0, 0, 10]}>
23
-
<AudioListener />
24
20
</T.OrthographicCamera>
25
21
26
22
<!-- <T.PerspectiveCamera makeDefault fov={75} position={[0, 0, 10]}>
27
23
<OrbitControls />
28
24
</T.PerspectiveCamera> -->
29
-
30
-
<Audio autoplay loop src={base + '/audio/music.mp3'} />
31
-
32
25
<T.DirectionalLight position={[0, 10, 10]} castShadow />
33
26
34
27
<Ground />
+14
src/routes/+page.svelte
+14
src/routes/+page.svelte
···
4
4
import { Canvas } from '@threlte/core';
5
5
import { World } from '@threlte/rapier';
6
6
import { ACESFilmicToneMapping } from 'three';
7
+
8
+
import { Howl, Howler } from 'howler';
9
+
import { onMount } from 'svelte';
10
+
import { base } from '$app/paths';
11
+
12
+
onMount(() => {
13
+
const sound = new Howl({
14
+
src: [base + '/audio/music.mp3'],
15
+
loop: true,
16
+
volume: 0.5
17
+
});
18
+
19
+
sound.play();
20
+
});
7
21
</script>
8
22
9
23
<div class="h-screen w-screen">