diff --git a/app/timer.tsx b/app/timer.tsx index 0c8c0b6..082643e 100644 --- a/app/timer.tsx +++ b/app/timer.tsx @@ -6,6 +6,8 @@ import styled from '@emotion/native'; import TimerContent from '@/components/useCases/timer/view/TimerContent'; import FinishContent from '@/components/useCases/timer/view/FinishContent'; import { TimerBgColor } from '@/components/useCases/timer/business/type'; +import { Audio } from 'expo-av'; +import { Sound } from 'expo-av/build/Audio'; interface TimerProps { reps: number; @@ -22,6 +24,7 @@ export default function Timer() { const [isWorkPhase, setIsWorkPhase] = useState(true); const [isRunning, setIsRunning] = useState(false); const [isFinish, setIsFinish] = useState(false); + const [sound, setSound] = useState(); useEffect(() => { handleStart(); @@ -38,10 +41,12 @@ export default function Timer() { if (currentRep < reps) { if (isWorkPhase) { // If the work phase is over, move on to the rest phase + playSound() setIsWorkPhase(false); setTimeLeft(restTime); } else { // If the rest phase is complete, move on to the next work phase + playSound() setIsWorkPhase(true); setTimeLeft(workTime); setCurrentRep(currentRep + 1); @@ -64,6 +69,35 @@ export default function Timer() { setIsFinish(false); }; + async function configureAudio() { + await Audio.setAudioModeAsync({ + allowsRecordingIOS: false, + staysActiveInBackground: false, + playsInSilentModeIOS: true, + shouldDuckAndroid: true, + playThroughEarpieceAndroid: false, + }); + } + + useEffect(() => { + configureAudio(); + }, []); + + async function playSound() { + const { sound } = await Audio.Sound.createAsync(require('../assets/audios/boxingBell.mp3')); + setSound(sound); + + await sound.playAsync(); + } + + useEffect(() => { + return sound + ? () => { + sound.unloadAsync(); + } + : undefined; + }, [sound]); + const handleContine = () => { setIsRunning(true); }; diff --git a/assets/audios/boxingBell.mp3 b/assets/audios/boxingBell.mp3 new file mode 100644 index 0000000..a7f6668 Binary files /dev/null and b/assets/audios/boxingBell.mp3 differ diff --git a/assets/sounds/boxingBell.mp3 b/assets/sounds/boxingBell.mp3 new file mode 100644 index 0000000..a7f6668 Binary files /dev/null and b/assets/sounds/boxingBell.mp3 differ diff --git a/package-lock.json b/package-lock.json index 3e6099a..9268ca7 100644 --- a/package-lock.json +++ b/package-lock.json @@ -15,6 +15,7 @@ "@react-navigation/native": "^6.0.2", "@testing-library/react-native": "^12.7.2", "expo": "~51.0.28", + "expo-av": "~14.0.7", "expo-font": "~12.0.9", "expo-linking": "~6.3.1", "expo-router": "~3.5.23", @@ -11869,6 +11870,15 @@ "expo": "*" } }, + "node_modules/expo-av": { + "version": "14.0.7", + "resolved": "https://registry.npmjs.org/expo-av/-/expo-av-14.0.7.tgz", + "integrity": "sha512-FvKZxyy+2/qcCmp+e1GTK3s4zH8ZO1RfjpqNxh7ARlS1oH8HPtk1AyZAMo52tHz3yQ3UIqxQ2YbI9CFb4065lA==", + "license": "MIT", + "peerDependencies": { + "expo": "*" + } + }, "node_modules/expo-constants": { "version": "16.0.2", "resolved": "https://registry.npmjs.org/expo-constants/-/expo-constants-16.0.2.tgz", diff --git a/package.json b/package.json index dda2713..59cacdd 100644 --- a/package.json +++ b/package.json @@ -45,9 +45,9 @@ "react-native-reanimated": "~3.10.1", "react-native-safe-area-context": "4.10.5", "react-native-screens": "3.31.1", - "react-native-sound": "^0.11.2", "react-native-timer-picker": "^1.10.3", - "react-native-web": "~0.19.10" + "react-native-web": "~0.19.10", + "expo-av": "~14.0.7" }, "devDependencies": { "@babel/core": "^7.20.0",