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:
@@ -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;
|
||||||
|
|
||||||
|
|||||||
@@ -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);
|
||||||
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user