diff --git a/src/app/niko/scene-components/ambient-sound.tsx b/src/app/niko/scene-components/ambient-sound.tsx new file mode 100644 index 0000000..27e9b2f --- /dev/null +++ b/src/app/niko/scene-components/ambient-sound.tsx @@ -0,0 +1,43 @@ +import { useEffect, useRef } from 'react' + +interface AmbientSoundProps { + url: string + volume?: number +} + +export function AmbientSound({ url, volume = 0.5 }: AmbientSoundProps) { + const audioRef = useRef(null) + + useEffect(() => { + const audio = new Audio(url) + audio.loop = true + audio.volume = volume + audioRef.current = audio + + const startAudio = () => { + audio.play().catch((err) => { + console.warn('Autoplay blocked. Waiting for user interaction.', err) + }) + } + + startAudio() + + window.addEventListener('click', startAudio, { once: true }) + window.addEventListener('keydown', startAudio, { once: true }) + + return () => { + window.removeEventListener('click', startAudio) + window.removeEventListener('keydown', startAudio) + audio.pause() + audioRef.current = null + } + }, [url]) + + useEffect(() => { + if (audioRef.current) { + audioRef.current.volume = volume + } + }, [volume]) + + return null +} \ No newline at end of file