diff --git a/src/hooks/useTimer.ts b/src/hooks/useTimer.ts index 8a81c80..ad405ae 100644 --- a/src/hooks/useTimer.ts +++ b/src/hooks/useTimer.ts @@ -2,6 +2,7 @@ import { ref, computed, watch } from '@vue/composition-api' import { StopwatchState } from '@/types/StopwatchState' import { notify } from '@/utils/notification' import { useInterval } from './useInterval' +import { useWakeLock } from './useWakeLock' const format = (num: number) => { return num.toString().padStart(2, '0') @@ -15,6 +16,8 @@ const formatSeconds = (seconds: number) => { } export const useTimer = () => { + const { askWakeLockPermission, releaseWakeLock } = useWakeLock() + const timeState = ref('stopped') const seconds = ref(0) const { interval } = useInterval() @@ -33,6 +36,7 @@ export const useTimer = () => { }) const start = () => { + askWakeLockPermission() timeState.value = 'started' stopwatchId = setInterval(() => { @@ -56,6 +60,7 @@ export const useTimer = () => { } const pause = () => { + releaseWakeLock() timeState.value = 'stopped' if (stopwatchId) { clearInterval(stopwatchId) diff --git a/src/hooks/useWakeLock.ts b/src/hooks/useWakeLock.ts new file mode 100644 index 0000000..c106e53 --- /dev/null +++ b/src/hooks/useWakeLock.ts @@ -0,0 +1,40 @@ +interface WakeLock { + request(type: string): Promise +} + +type WakeLockType = 'screen' | null + +interface WakeLockSentinel { + release(): Promise + readonly WakeLocktype: WakeLockType +} + +interface NavigatorExtended extends Navigator { + readonly wakeLock: WakeLock +} + +export const useWakeLock = () => { + let wakeLock: WakeLockSentinel | null = null + + const askWakeLockPermission = async () => { + if (!('wakeLock' in navigator)) { + return + } + + try { + wakeLock = await (navigator as NavigatorExtended).wakeLock.request( + 'screen' + ) + } catch (err) { + console.error(`${err.name}, ${err.message}`) + } + } + const releaseWakeLock = () => { + wakeLock?.release() + } + + return { + askWakeLockPermission, + releaseWakeLock + } +}