ChoChoX/suwayomi-material-you-webui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Simplify scroll page into view inline alignment determination

Browse Source
This commit is contained in:
schroda
2025-11-17 01:37:32 +01:00
parent 50a6b72716
commit 36477d1c95
3 changed files with 1 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/features/reader/viewer/ReaderViewer.tsx
View File

@@ -234,7 +234,6 @@ const BaseReaderViewer = ({
useReaderHandlePageSelection( useReaderHandlePageSelection(
pageToScrollToIndex, pageToScrollToIndex,
currentPageIndex,
pages, pages,
totalPages, totalPages,
setPageToScrollToIndex, setPageToScrollToIndex,

6
src/features/reader/viewer/hooks/useReaderHandlePageSelection.ts
View File

@@ -12,11 +12,9 @@ import { ReaderStatePages, ReadingDirection } from '@/features/reader/Reader.typ
import { getNextIndexFromPage, getPage } from '@/features/reader/overlay/progress-bar/ReaderProgressBar.utils.tsx'; import { getNextIndexFromPage, getPage } from '@/features/reader/overlay/progress-bar/ReaderProgressBar.utils.tsx';
import { getScrollIntoViewInlineOption } from '@/features/reader/viewer/pager/ReaderPager.utils.tsx'; import { getScrollIntoViewInlineOption } from '@/features/reader/viewer/pager/ReaderPager.utils.tsx';
import { ReaderControls } from '@/features/reader/services/ReaderControls.ts'; import { ReaderControls } from '@/features/reader/services/ReaderControls.ts';
import { DirectionOffset } from '@/base/Base.types.ts';
export const useReaderHandlePageSelection = ( export const useReaderHandlePageSelection = (
pageToScrollToIndex: ReaderStatePages['pageToScrollToIndex'], pageToScrollToIndex: ReaderStatePages['pageToScrollToIndex'],
currentPageIndex: number,
pages: ReaderStatePages['pages'], pages: ReaderStatePages['pages'],
totalPages: number, totalPages: number,
setPageToScrollToIndex: ReaderStatePages['setPageToScrollToIndex'], setPageToScrollToIndex: ReaderStatePages['setPageToScrollToIndex'],
@@ -34,13 +32,11 @@ export const useReaderHandlePageSelection = (
const pageToScrollTo = getPage(pageToScrollToIndex, pages); const pageToScrollTo = getPage(pageToScrollToIndex, pages);
if (isContinuousReadingModeActive) { if (isContinuousReadingModeActive) {
const directionOffset =
pageToScrollToIndex > currentPageIndex ? DirectionOffset.PREVIOUS : DirectionOffset.NEXT;
const imageRef = imageRefs.current[pageToScrollTo.pagesIndex]; const imageRef = imageRefs.current[pageToScrollTo.pagesIndex];
imageRef?.scrollIntoView({ imageRef?.scrollIntoView({
block: 'start', block: 'start',
inline: getScrollIntoViewInlineOption(directionOffset, themeDirection, readingDirection), inline: getScrollIntoViewInlineOption(themeDirection, readingDirection),
}); });
} }

10
src/features/reader/viewer/pager/ReaderPager.utils.tsx
View File

@@ -33,7 +33,6 @@ import { getOptionForDirection } from '@/features/theme/services/ThemeCreator.ts
import { READING_DIRECTION_TO_THEME_DIRECTION } from '@/features/reader/settings/ReaderSettings.constants.tsx'; import { READING_DIRECTION_TO_THEME_DIRECTION } from '@/features/reader/settings/ReaderSettings.constants.tsx';
import { coerceIn } from '@/lib/HelperFunctions.ts'; import { coerceIn } from '@/lib/HelperFunctions.ts';
import { NavbarContextType } from '@/features/navigation-bar/NavigationBar.types.ts'; import { NavbarContextType } from '@/features/navigation-bar/NavigationBar.types.ts';
import { DirectionOffset } from '@/base/Base.types.ts';
type CSSObject = ReturnType<Theme['applyStyles']>; type CSSObject = ReturnType<Theme['applyStyles']>;
@@ -588,24 +587,15 @@ export const isATransitionPageVisible = (activeMode: ReaderTransitionPageMode, r
activeMode !== ReaderTransitionPageMode.NONE || isContinuousReadingMode(readingMode); activeMode !== ReaderTransitionPageMode.NONE || isContinuousReadingMode(readingMode);
export const getScrollIntoViewInlineOption = ( export const getScrollIntoViewInlineOption = (
offset: DirectionOffset,
themeDirection: Direction, themeDirection: Direction,
readingDirection: ReadingDirection, readingDirection: ReadingDirection,
): ScrollIntoViewOptions['inline'] => { ): ScrollIntoViewOptions['inline'] => {
const themeDirectionForReadingDirection = READING_DIRECTION_TO_THEME_DIRECTION[readingDirection]; const themeDirectionForReadingDirection = READING_DIRECTION_TO_THEME_DIRECTION[readingDirection];
if (themeDirection === 'ltr') { if (themeDirection === 'ltr') {
if (offset === DirectionOffset.PREVIOUS) {
return getOptionForDirection('start', 'end', themeDirectionForReadingDirection);
}
return getOptionForDirection('start', 'end', themeDirectionForReadingDirection); return getOptionForDirection('start', 'end', themeDirectionForReadingDirection);
} }
if (offset === DirectionOffset.PREVIOUS) {
return getOptionForDirection('end', 'start', themeDirectionForReadingDirection);
}
return getOptionForDirection('end', 'start', themeDirectionForReadingDirection); return getOptionForDirection('end', 'start', themeDirectionForReadingDirection);
}; };