73 lines
1.6 KiB
TypeScript
73 lines
1.6 KiB
TypeScript
"use client"
|
|
|
|
import { useCallback, useEffect, useRef } from "react"
|
|
|
|
let isSupported = false
|
|
|
|
if ("wakeLock" in navigator) {
|
|
isSupported = true
|
|
}
|
|
|
|
interface Options {
|
|
reacquireOnPageVisible?: boolean
|
|
onRequest?: () => void
|
|
onRelease?: () => void
|
|
}
|
|
|
|
/**
|
|
* Uses the Wake Lock API to keep the screen from dimming or locking.
|
|
* https://developer.mozilla.org/en-US/docs/Web/API/Screen_Wake_Lock_API
|
|
*/
|
|
export default function useWakeLock({
|
|
reacquireOnPageVisible = false,
|
|
onRequest = () => undefined,
|
|
onRelease = () => undefined,
|
|
}: Options = {}) {
|
|
const wakeLock = useRef<WakeLockSentinel | null>(null)
|
|
|
|
const request = useCallback(async () => {
|
|
if (!isSupported) {
|
|
return
|
|
}
|
|
|
|
try {
|
|
wakeLock.current = await navigator.wakeLock.request("screen")
|
|
|
|
onRequest()
|
|
|
|
wakeLock.current.onrelease = () => {
|
|
onRelease()
|
|
}
|
|
} catch (_err) {
|
|
// ignore
|
|
}
|
|
}, [onRelease, onRequest])
|
|
|
|
const release = useCallback(() => {
|
|
if (!isSupported) {
|
|
return
|
|
}
|
|
wakeLock.current?.release().then(() => {
|
|
wakeLock.current = null
|
|
})
|
|
}, [])
|
|
|
|
useEffect(() => {
|
|
const handleVisibilityChange = () => {
|
|
if (wakeLock.current !== null && document.visibilityState === "visible") {
|
|
request()
|
|
}
|
|
}
|
|
|
|
if (reacquireOnPageVisible) {
|
|
document.addEventListener("visibilitychange", handleVisibilityChange)
|
|
}
|
|
|
|
return () => {
|
|
document.removeEventListener("visibilitychange", handleVisibilityChange)
|
|
}
|
|
}, [reacquireOnPageVisible, request])
|
|
|
|
return { isSupported, request, release }
|
|
}
|