hax/moodist
1
0
Fork 0
mirror of https://github.com/remvze/moodist.git synced 2025-12-17 08:54:13 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: replace the silence file

Browse source
This commit is contained in:
MAZE 2025-11-24 23:56:07 +03:30
parent 6ac65c1948
commit e160d26677
3 changed files with 12 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
public/sounds/silence.mp3
View file

Binary file not shown.

BIN
public/sounds/silence.wav Normal file
View file

Binary file not shown.

31
src/components/media-controls/media-session-track.tsx
View file

@ -1,4 +1,4 @@
import { useCallback, useEffect, useRef, useState } from 'react'; import { useCallback, useEffect, useRef } from 'react';
import { BrowserDetect } from '@/helpers/browser-detect'; import { BrowserDetect } from '@/helpers/browser-detect';
@ -15,23 +15,14 @@ const metadata: MediaMetadataInit = {
export function MediaSessionTrack() { export function MediaSessionTrack() {
const { isBrowser } = useSSR(); const { isBrowser } = useSSR();
const isDarkTheme = useDarkTheme(); const isDarkTheme = useDarkTheme();
const [isGenerated, setIsGenerated] = useState(false);
const isPlaying = useSoundStore(state => state.isPlaying); const isPlaying = useSoundStore(state => state.isPlaying);
const play = useSoundStore(state => state.play); const play = useSoundStore(state => state.play);
const pause = useSoundStore(state => state.pause); const pause = useSoundStore(state => state.pause);
const masterAudioSoundRef = useRef<HTMLAudioElement>(null); const masterAudioSoundRef = useRef<HTMLAudioElement>(null);
const artworkURL = isDarkTheme ? '/logo-dark.png' : '/logo-light.png'; const artworkURL = isDarkTheme ? '/logo-dark.png' : '/logo-light.png';
const generateSilence = useCallback(async () => {
if (!masterAudioSoundRef.current) return;
masterAudioSoundRef.current.src = '/sounds/silence.mp3';
setIsGenerated(true);
}, []);
useEffect(() => { useEffect(() => {
if (!isBrowser || !isPlaying || !isGenerated) return; if (!isBrowser || !isPlaying) return;
navigator.mediaSession.metadata = new MediaMetadata({ navigator.mediaSession.metadata = new MediaMetadata({
...metadata, ...metadata,
@ -43,11 +34,7 @@ export function MediaSessionTrack() {
}, },
], ],
}); });
}, [artworkURL, isBrowser, isDarkTheme, isGenerated, isPlaying]); }, [artworkURL, isBrowser, isDarkTheme, isPlaying]);
useEffect(() => {
generateSilence();
}, [generateSilence]);
const startMasterAudio = useCallback(async () => { const startMasterAudio = useCallback(async () => {
if (!masterAudioSoundRef.current) return; if (!masterAudioSoundRef.current) return;
@ -79,7 +66,6 @@ export function MediaSessionTrack() {
}, []); }, []);
useEffect(() => { useEffect(() => {
if (!isGenerated) return;
if (!masterAudioSoundRef.current) return; if (!masterAudioSoundRef.current) return;
if (isPlaying) { if (isPlaying) {
@ -87,7 +73,7 @@ export function MediaSessionTrack() {
} else { } else {
stopMasterAudio(); stopMasterAudio();
} }
}, [isGenerated, isPlaying, startMasterAudio, stopMasterAudio]); }, [isPlaying, startMasterAudio, stopMasterAudio]);
useEffect(() => { useEffect(() => {
const masterAudioSound = masterAudioSoundRef.current; const masterAudioSound = masterAudioSoundRef.current;
@ -101,5 +87,12 @@ export function MediaSessionTrack() {
}; };
}, []); }, []);
return <audio id="media-session-track" loop ref={masterAudioSoundRef} />; return (
<audio
id="media-session-track"
loop
ref={masterAudioSoundRef}
src="/sounds/silence.wav"
/>
);
} }