diff --git a/src/App/Audio.tsx b/src/App/Audio.tsx index 6d5ff5b..87f4549 100644 --- a/src/App/Audio.tsx +++ b/src/App/Audio.tsx @@ -1,9 +1,17 @@ import React, { useCallback, useEffect, useRef } from 'react'; +import { useEventListener } from 'hooks'; import { useAudioService } from 'services/audio'; const Audio = () => { - const { source, playing, nextSong, loading, setLoading } = useAudioService(); + const { + source, + playing, + nextSong, + prevSong, + loading, + setLoading + } = useAudioService(); const audioRef = useRef(null); const handlePlay = useCallback(async () => { @@ -18,6 +26,16 @@ const Audio = () => { } }, []); + const handleBackClick = useCallback(() => { + if (source && audioRef.current) { + if (audioRef.current.currentTime < 3) { + prevSong(); + } else { + audioRef.current.currentTime = 0; + } + } + }, [prevSong, source]); + const handleLoadStart = useCallback(() => { setLoading(true); }, [setLoading]); @@ -34,6 +52,8 @@ const Audio = () => { } }, [handlePause, handlePlay, loading, playing]); + useEventListener("backclick", handleBackClick); + return source ? (