From 7910dc4cf88f71d39e557afeedfcdab8dc930284 Mon Sep 17 00:00:00 2001 From: Torpenn Date: Sun, 13 Oct 2024 21:32:28 +0200 Subject: [PATCH] feat: add keep screen awake when timer is running --- app/timer.tsx | 22 ++++++++++++++++------ package-lock.json | 11 +---------- package.json | 3 ++- 3 files changed, 19 insertions(+), 17 deletions(-) diff --git a/app/timer.tsx b/app/timer.tsx index 082643e..813f6cb 100644 --- a/app/timer.tsx +++ b/app/timer.tsx @@ -1,5 +1,5 @@ import { useEffect, useState } from 'react'; -import { useRoute } from '@react-navigation/native'; +import { useRoute, useNavigation } from '@react-navigation/native'; import { View } from '@/components/shared/Themed'; import styled from '@emotion/native'; @@ -8,6 +8,7 @@ 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'; +import { activateKeepAwakeAsync, deactivateKeepAwake } from 'expo-keep-awake'; interface TimerProps { reps: number; @@ -16,9 +17,10 @@ interface TimerProps { } export default function Timer() { + const navigation = useNavigation(); const route = useRoute(); - const { reps, restTime, workTime } = route.params as TimerProps; + const { reps, restTime, workTime } = route.params as TimerProps; const [currentRep, setCurrentRep] = useState(0); const [timeLeft, setTimeLeft] = useState(0); const [isWorkPhase, setIsWorkPhase] = useState(true); @@ -27,9 +29,20 @@ export default function Timer() { const [sound, setSound] = useState(); useEffect(() => { + configureAudio(); handleStart(); + activateKeepAwakeAsync(); }, []); + // when the user exits the screen, desactivate the keepAwake + useEffect(() => { + const unsubscribe = navigation.addListener('beforeRemove', (_) => { + deactivateKeepAwake(); + }); + + return unsubscribe; + }, [navigation]); + useEffect(() => { let timer: NodeJS.Timeout; @@ -53,6 +66,7 @@ export default function Timer() { } } else { // Done + playSound(); setIsRunning(false); setIsFinish(true); } @@ -79,10 +93,6 @@ export default function Timer() { }); } - useEffect(() => { - configureAudio(); - }, []); - async function playSound() { const { sound } = await Audio.Sound.createAsync(require('../assets/audios/boxingBell.mp3')); setSound(sound); diff --git a/package-lock.json b/package-lock.json index 9268ca7..decaddc 100644 --- a/package-lock.json +++ b/package-lock.json @@ -17,6 +17,7 @@ "expo": "~51.0.28", "expo-av": "~14.0.7", "expo-font": "~12.0.9", + "expo-keep-awake": "~13.0.2", "expo-linking": "~6.3.1", "expo-router": "~3.5.23", "expo-splash-screen": "~0.27.5", @@ -30,7 +31,6 @@ "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" }, @@ -19637,15 +19637,6 @@ "react-native": "*" } }, - "node_modules/react-native-sound": { - "version": "0.11.2", - "resolved": "https://registry.npmjs.org/react-native-sound/-/react-native-sound-0.11.2.tgz", - "integrity": "sha512-LmGc8lgOK3qecYMVQpyHvww/C+wgT6sWeMpVbOe4NCRGC2yKd4fo4U0KBUo9PO7AqKESO3I/2GZg1/C0+bwiiA==", - "license": "MIT", - "peerDependencies": { - "react-native": ">=0.8.0" - } - }, "node_modules/react-native-timer-picker": { "version": "1.10.3", "resolved": "https://registry.npmjs.org/react-native-timer-picker/-/react-native-timer-picker-1.10.3.tgz", diff --git a/package.json b/package.json index 59cacdd..fe7d5a1 100644 --- a/package.json +++ b/package.json @@ -47,7 +47,8 @@ "react-native-screens": "3.31.1", "react-native-timer-picker": "^1.10.3", "react-native-web": "~0.19.10", - "expo-av": "~14.0.7" + "expo-av": "~14.0.7", + "expo-keep-awake": "~13.0.2" }, "devDependencies": { "@babel/core": "^7.20.0",