Hide overlay on page/scroll change

This commit is contained in:
schroda
2024-12-11 21:04:44 +01:00
parent 8b67c2d6a9
commit 8ca0af8d02
4 changed files with 33 additions and 5 deletions

View File

@@ -6,7 +6,7 @@
* file, You can obtain one at https://mozilla.org/MPL/2.0/.
*/
import { MutableRefObject, useCallback, useMemo } from 'react';
import { ContextType, MutableRefObject, useCallback, useMemo } from 'react';
import { Direction, useTheme } from '@mui/material/styles';
import { userReaderStatePagesContext } from '@/modules/reader/contexts/state/ReaderStatePagesContext.tsx';
import { getNextIndexFromPage, getNextPageIndex, getPage } from '@/modules/reader/utils/ReaderProgressBar.utils.tsx';
@@ -26,7 +26,7 @@ import {
READING_DIRECTION_TO_THEME_DIRECTION,
} from '@/modules/reader/constants/ReaderSettings.constants.tsx';
import { isEndOfPageInViewport, isPageInViewport } from '@/modules/reader/utils/ReaderPager.utils.tsx';
import { useReaderOverlayContext } from '@/modules/reader/contexts/ReaderOverlayContext.tsx';
import { ReaderOverlayContext, useReaderOverlayContext } from '@/modules/reader/contexts/ReaderOverlayContext.tsx';
import { useReaderTapZoneContext } from '@/modules/reader/contexts/ReaderTapZoneContext.tsx';
import { TapZoneRegionType } from '@/modules/reader/types/TapZoneLayout.types.ts';
import { ReaderTapZoneService } from '@/modules/reader/services/ReaderTapZoneService.ts';
@@ -78,6 +78,7 @@ export class ReaderControls {
themeDirection: Direction,
element: HTMLElement,
openChapter: ReturnType<(typeof ReaderControls)['useOpenChapter']>,
setIsOverlayVisible: ContextType<typeof ReaderOverlayContext>['setIsVisible'],
scrollAmountPercentage: number = ReaderScrollAmount.LARGE,
): void {
if (!element) {
@@ -105,6 +106,8 @@ export class ReaderControls {
const getNewScrollPosition = (currentPos: number, elementSize: number) =>
currentPos + elementSize * scrollAmount * scrollDirection;
setIsOverlayVisible(false);
switch (direction) {
case ScrollDirection.X:
if (isAtStartXForDirection && offset === ScrollOffset.BACKWARD && isContinuousReadingModeActive) {
@@ -171,6 +174,7 @@ export class ReaderControls {
const { currentPageIndex, setPageToScrollToIndex, pages, transitionPageMode, setTransitionPageMode } =
userReaderStatePagesContext();
const { previousChapter, nextChapter } = useReaderStateChaptersContext();
const { setIsVisible: setIsOverlayVisible } = useReaderOverlayContext();
const { readingDirection, readingMode } = ReaderService.useSettings();
const openChapter = ReaderControls.useOpenChapter();
@@ -199,6 +203,8 @@ export class ReaderControls {
forceDirection,
);
setIsOverlayVisible(false);
const shouldOpenPreviousChapter =
isFirstPage && isATransitionPageVisible && convertedPage === 'previous' && !!previousChapter;
if (shouldOpenPreviousChapter) {
@@ -406,6 +412,7 @@ export class ReaderControls {
themeDirection,
scrollElement,
openChapter,
setIsOverlayVisible,
);
} else {
openPage('previous', 'ltr');
@@ -421,6 +428,7 @@ export class ReaderControls {
themeDirection,
scrollElement,
openChapter,
setIsOverlayVisible,
);
} else {
openPage('next', 'ltr');