Cutlery/Kyoo
1
0
Fork 0
mirror of https://github.com/zoriya/Kyoo.git synced 2025-05-24 02:02:36 -04:00
Code Issues Packages Projects Releases Wiki Activity

Fix fullscreen handling

Browse Source
This commit is contained in:
Zoe Roux 2022-12-23 00:20:03 +09:00
parent 7315d5f5a1
commit b0eb8c3b42
1 changed files with 26 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
front/packages/ui/src/player/state.tsx
View File

@ -53,7 +53,9 @@ const publicProgressAtom = atom(0);
export const volumeAtom = atom(100);
export const mutedAtom = atom(false);
export const [_, fullscreenAtom] = bakedAtom(false, async (_, set, value, baker) => {
export const [privateFullscreen, fullscreenAtom] = bakedAtom(
false,
async (_, set, value, baker) => {
try {
if (value) {
await document.body.requestFullscreen();
@ -65,7 +67,8 @@ export const [_, fullscreenAtom] = bakedAtom(false, async (_, set, value, baker)
screen.orientation.unlock();
}
} catch {}
});
},
);
let hls: Hls | null = null;
@ -77,7 +80,7 @@ export const Video = ({
// const [playMode, setPlayMode] = useAtom(playModeAtom);
const ref = useRef<NativeVideo | null>(null);
const [isPlaying, setPlay] = useAtom(playAtom);
const isPlaying = useAtomValue(playAtom);
const setLoad = useSetAtom(loadAtom);
useLayoutEffect(() => {
@ -95,6 +98,15 @@ export const Video = ({
const volume = useAtomValue(volumeAtom);
const isMuted = useAtomValue(mutedAtom);
const setFullscreen = useSetAtom(privateFullscreen);
useEffect(() => {
const handler = () => {
setFullscreen(document.fullscreenElement != null);
};
document.addEventListener("fullscreenchange", handler);
return () => document.removeEventListener("fullscreenchange", handler);
});
// useEffect(() => {
// setPlayMode(PlayMode.Direct);
// }, [links, setPlayMode]);