Scroll to start of page on page change

Resets the scroll position for single/double page mode to the start of the opened page on a page change.
This commit is contained in:
schroda
2024-12-25 02:59:53 +01:00
parent d67d6f7d28
commit ae89a42ac4
2 changed files with 22 additions and 0 deletions

View File

@@ -37,6 +37,7 @@ import {
createPagesData, createPagesData,
getDoublePageModePages, getDoublePageModePages,
getScrollIntoViewInlineOption, getScrollIntoViewInlineOption,
getScrollToXForReadingDirection,
isSpreadPage, isSpreadPage,
} from '@/modules/reader/utils/ReaderPager.utils.tsx'; } from '@/modules/reader/utils/ReaderPager.utils.tsx';
import { useReaderScrollbarContext } from '@/modules/reader/contexts/ReaderScrollbarContext.tsx'; import { useReaderScrollbarContext } from '@/modules/reader/contexts/ReaderScrollbarContext.tsx';
@@ -227,6 +228,13 @@ const BaseReaderViewer = forwardRef(
}); });
} }
if (!isContinuousReadingModeActive) {
scrollElementRef.current?.scrollTo(
getScrollToXForReadingDirection(scrollElementRef.current, themeDirection, readingDirection),
0,
);
}
const newPageIndex = getNextIndexFromPage(pageToScrollTo); const newPageIndex = getNextIndexFromPage(pageToScrollTo);
const isLastPage = newPageIndex === totalPages - 1; const isLastPage = newPageIndex === totalPages - 1;

View File

@@ -507,3 +507,17 @@ export const getScrollIntoViewInlineOption = (
return getOptionForDirection('end', 'start', themeDirectionForReadingDirection); return getOptionForDirection('end', 'start', themeDirectionForReadingDirection);
}; };
export const getScrollToXForReadingDirection = (
element: HTMLElement,
themeDirection: Direction,
readingDirection: ReadingDirection,
): number => {
const themeDirectionForReadingDirection = READING_DIRECTION_TO_THEME_DIRECTION[readingDirection];
if (themeDirection === 'ltr') {
return getOptionForDirection(0, element.scrollWidth, themeDirectionForReadingDirection);
}
return getOptionForDirection(-element.scrollWidth, 0, themeDirectionForReadingDirection);
};