Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-04-20 02:22:09 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor: subtitle offset logic

Browse source
This commit is contained in:
kKaskak 2024-02-29 15:33:42 +02:00
parent abe42467ad
commit f86272a123
1 changed files with 16 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
src/routes/Player/Player.js
View file

@ -46,6 +46,8 @@ const Player = ({ urlParams, queryParams }) => {
});
const [immersed, setImmersed] = React.useState(true);
const [userOffset, setUserOffset] = React.useState(video.state.subtitlesOffset);
const [offsetUpdatedNotImmersed, setOffsetUpdatedNotImmersed] = React.useState(false);
const setImmersedDebounced = React.useCallback(debounce(setImmersed, 3000), []);
const [, , , toggleFullscreen] = useFullscreen();
@ -189,7 +191,11 @@ const Player = ({ urlParams, queryParams }) => {
}, [updateSettings]);
const onSubtitlesOffsetChanged = React.useCallback((offset) => {
setUserOffset(offset);
updateSettings({ subtitlesOffset: offset });
if (!immersed) {
setOffsetUpdatedNotImmersed(true);
}
}, [updateSettings]);
const onDismissNextVideoPopup = React.useCallback(() => {
@ -462,16 +468,19 @@ const Player = ({ urlParams, queryParams }) => {
}, []);
React.useEffect(() => {
let controlBarLayerHeight = Math.round((controlBarRef?.current?.offsetHeight / window?.innerHeight) * 100);
const controlBarLayerHeight = Math.round((controlBarRef?.current?.offsetHeight / window?.innerHeight) * 100);
if(video.state.subtitlesOffset < controlBarLayerHeight / 2) {
if (immersed) controlBarLayerHeight = 0;
updateSettings({ subtitlesOffset: video.state.subtitlesOffset + controlBarLayerHeight });
if (!immersed) {
if (!offsetUpdatedNotImmersed) {
if (video.state.subtitlesOffset < controlBarLayerHeight) {
updateSettings({ subtitlesOffset: controlBarLayerHeight });
}
}
} else {
controlBarLayerHeight = Math.round((controlBarRef?.current?.offsetHeight / window?.innerHeight) * 100);
updateSettings({ subtitlesOffset: video.state.subtitlesOffset - controlBarLayerHeight });
updateSettings({ subtitlesOffset: userOffset });
setOffsetUpdatedNotImmersed(false);
}
}, [immersed]);
}, [immersed, video.state.subtitlesOffset]);
React.useLayoutEffect(() => {
const onKeyDown = (event) => {