51 lines
1.3 KiB
TypeScript
51 lines
1.3 KiB
TypeScript
/**
|
|
* Wake Lock hook for background playback on mobile
|
|
* v0.801: Prevents screen from sleeping while audio is playing
|
|
*/
|
|
import { useEffect, useRef } from 'react';
|
|
|
|
export function useWakeLock(isPlaying: boolean): void {
|
|
const lockRef = useRef<WakeLockSentinel | null>(null);
|
|
|
|
useEffect(() => {
|
|
if (!('wakeLock' in navigator)) return;
|
|
|
|
const requestLock = async () => {
|
|
try {
|
|
const lock = await (navigator as Navigator & { wakeLock: { request: (type: 'screen') => Promise<WakeLockSentinel> } }).wakeLock.request('screen');
|
|
lockRef.current = lock;
|
|
lock.addEventListener('release', () => {
|
|
lockRef.current = null;
|
|
});
|
|
} catch {
|
|
/* WakeLock denied (battery saver, etc.) */
|
|
}
|
|
};
|
|
|
|
const releaseLock = () => {
|
|
lockRef.current?.release().catch(() => {});
|
|
lockRef.current = null;
|
|
};
|
|
|
|
if (isPlaying) {
|
|
requestLock();
|
|
} else {
|
|
releaseLock();
|
|
}
|
|
|
|
const handleVisibilityChange = () => {
|
|
if (document.visibilityState === 'visible' && isPlaying) {
|
|
requestLock();
|
|
} else {
|
|
releaseLock();
|
|
}
|
|
};
|
|
|
|
document.addEventListener('visibilitychange', handleVisibilityChange);
|
|
|
|
return () => {
|
|
document.removeEventListener('visibilitychange', handleVisibilityChange);
|
|
releaseLock();
|
|
};
|
|
}, [isPlaying]);
|
|
}
|