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

fix: change audio volume

Browse source
This commit is contained in:
MAZE 2024-09-03 17:06:05 +03:30
parent a64b30d047
commit 4f5fe7d042
2 changed files with 16 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
src/contexts/sound.tsx
View file

@ -4,6 +4,7 @@ import { Howler } from 'howler';
// Define the context's interface
interface SoundContextType {
connectBufferSource: (bufferSource: AudioBufferSourceNode) => void;
updateVolume: (volume: number) => void; // Add a function to update the volume
}
// Create the SoundContext with an empty initial value
@ -57,16 +58,18 @@ export const SoundProvider: React.FC<SoundProviderProps> = ({ children }) => {
const connectBufferSource = (bufferSource: AudioBufferSourceNode) => {
if (dest) {
bufferSource.connect(dest);
}
};
// Start playing the audio once the first buffer connects
if (audioTag && audioTag.paused) {
audioTag.play().catch(() => console.error('Failed to play audio'));
}
// Function to update the volume of the audio tag
const updateVolume = (volume: number) => {
if (audioTag) {
audioTag.volume = volume;
}
};
return (
<SoundContext.Provider value={{ connectBufferSource }}>
<SoundContext.Provider value={{ connectBufferSource, updateVolume }}>
{children}
</SoundContext.Provider>
);

13
src/hooks/use-sound.ts
View file

@ -35,7 +35,7 @@ export function useSound(
const setIsLoading = useLoadingStore(state => state.set);
const { isBrowser } = useSSR();
const { connectBufferSource } = useSoundContext(); // Access SoundContext
const { connectBufferSource, updateVolume } = useSoundContext(); // Access SoundContext
const sound = useMemo<Howl | null>(() => {
let sound: Howl | null = null;
@ -51,7 +51,6 @@ export function useSound(
// @ts-ignore
const source = sound!._sounds[0]._node.bufferSource;
if (source) {
console.log('DOOOOPE');
connectBufferSource(source);
}
},
@ -77,8 +76,11 @@ export function useSound(
}, [sound, options.loop]);
useEffect(() => {
if (sound) sound.volume(options.volume ?? 0.5);
}, [sound, options.volume]);
if (sound) {
sound.volume(options.volume ?? 0.5);
updateVolume(options.volume ?? 0.5); // Update the volume of the audio tag
}
}, [sound, options.volume, updateVolume]);
const play = useCallback(
(cb?: () => void) => {
@ -113,9 +115,10 @@ export function useSound(
setTimeout(() => {
pause();
sound?.volume(options.volume || 0.5);
updateVolume(options.volume || 0.5); // Ensure the volume is reset after fade-out
}, duration);
},
[options.volume, sound, pause],
[options.volume, sound, pause, updateVolume],
);
useEffect(() => {