TelegramPWA/src/components/middle/message/hooks/useVideoAutoPause.ts
2021-11-27 17:43:59 +01:00

42 lines
1.3 KiB
TypeScript

import { useCallback, useRef } from '../../../../lib/teact/teact';
import { fastRaf } from '../../../../util/schedulers';
import safePlay from '../../../../util/safePlay';
import useBackgroundMode from '../../../../hooks/useBackgroundMode';
import useHeavyAnimationCheck from '../../../../hooks/useHeavyAnimationCheck';
export default function useVideoAutoPause(playerRef: { current: HTMLVideoElement | null }, canPlay: boolean) {
const wasPlaying = useRef(playerRef.current?.paused);
const canPlayRef = useRef();
canPlayRef.current = canPlay;
const freezePlaying = useCallback(() => {
if (!playerRef.current) {
return;
}
wasPlaying.current = !playerRef.current.paused;
if (wasPlaying.current) {
playerRef.current.pause();
}
}, [playerRef]);
const unfreezePlaying = useCallback(() => {
if (
playerRef.current && wasPlaying.current && canPlayRef.current
// At this point HTMLVideoElement can be unmounted from the DOM
&& document.body.contains(playerRef.current)
) {
safePlay(playerRef.current);
}
}, [playerRef]);
const unfreezePlayingOnRaf = useCallback(() => {
fastRaf(unfreezePlaying);
}, [unfreezePlaying]);
useBackgroundMode(freezePlaying, unfreezePlayingOnRaf);
useHeavyAnimationCheck(freezePlaying, unfreezePlaying);
}