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

Improve naming of functions and variables

Browse Source
This commit is contained in:
schroda
2025-02-05 15:14:59 +01:00
parent 155f58b92d
commit 34ebcc4f4c
1 changed files with 25 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
src/modules/reader/hooks/useReaderInfiniteScrollUpdateChapter.ts
View File

@@ -16,21 +16,21 @@ import {
import { READING_DIRECTION_TO_THEME_DIRECTION } from '@/modules/reader/constants/ReaderSettings.constants.tsx'; import { READING_DIRECTION_TO_THEME_DIRECTION } from '@/modules/reader/constants/ReaderSettings.constants.tsx';
import { getOptionForDirection } from '@/modules/theme/services/ThemeCreator.ts'; import { getOptionForDirection } from '@/modules/theme/services/ThemeCreator.ts';
interface ScrollingDirection { interface ElementIntersection {
backward: boolean; start: boolean;
forward: boolean; end: boolean;
} }
interface ScrollingDirectionInfo { interface ElementIntersectionInfo {
[ReadingMode.CONTINUOUS_VERTICAL]: ScrollingDirection; [ReadingMode.CONTINUOUS_VERTICAL]: ElementIntersection;
[ReadingMode.CONTINUOUS_HORIZONTAL]: ScrollingDirection; [ReadingMode.CONTINUOUS_HORIZONTAL]: ElementIntersection;
} }
const OPEN_CHAPTER_INTERSECTION_RATIO = 0.1; const OPEN_CHAPTER_INTERSECTION_RATIO = 0.1;
const getScrollingDirectionInfo = ( const getElementIntersectionInfo = (
readingDirection: ReadingDirection, readingDirection: ReadingDirection,
{ top, right, bottom, left }: DOMRect, { top, right, bottom, left }: DOMRect,
): ScrollingDirectionInfo => { ): ElementIntersectionInfo => {
const themeDirectionOfReadingDirection = READING_DIRECTION_TO_THEME_DIRECTION[readingDirection]; const themeDirectionOfReadingDirection = READING_DIRECTION_TO_THEME_DIRECTION[readingDirection];
const startOfViewportHorizontal = getOptionForDirection(0, window.innerWidth, themeDirectionOfReadingDirection); const startOfViewportHorizontal = getOptionForDirection(0, window.innerWidth, themeDirectionOfReadingDirection);
@@ -41,12 +41,12 @@ const getScrollingDirectionInfo = (
return { return {
[ReadingMode.CONTINUOUS_VERTICAL]: { [ReadingMode.CONTINUOUS_VERTICAL]: {
backward: bottom >= window.innerHeight, start: bottom >= window.innerHeight,
forward: top < 0, end: top < 0,
}, },
[ReadingMode.CONTINUOUS_HORIZONTAL]: { [ReadingMode.CONTINUOUS_HORIZONTAL]: {
backward: endOfElementHorizontal >= endOfViewportHorizontal, start: endOfElementHorizontal >= endOfViewportHorizontal,
forward: startOfElementHorizontal < startOfViewportHorizontal, end: startOfElementHorizontal < startOfViewportHorizontal,
}, },
}; };
}; };
@@ -55,23 +55,23 @@ const shouldHandleIntersectionEvent = (
{ {
[ReadingMode.CONTINUOUS_VERTICAL]: verticalInfo, [ReadingMode.CONTINUOUS_VERTICAL]: verticalInfo,
[ReadingMode.CONTINUOUS_HORIZONTAL]: horizontalInfo, [ReadingMode.CONTINUOUS_HORIZONTAL]: horizontalInfo,
}: ScrollingDirectionInfo, }: ElementIntersectionInfo,
readingMode: ReadingMode, readingMode: ReadingMode,
): boolean => { ): boolean => {
if (isContinuousVerticalReadingMode(readingMode)) { if (isContinuousVerticalReadingMode(readingMode)) {
return verticalInfo.backward || verticalInfo.forward; return verticalInfo.start || verticalInfo.end;
} }
return horizontalInfo.backward || horizontalInfo.forward; return horizontalInfo.start || horizontalInfo.end;
}; };
const getScrollDirection = ( const getElementIntersection = (
{ {
[ReadingMode.CONTINUOUS_VERTICAL]: verticalInfo, [ReadingMode.CONTINUOUS_VERTICAL]: verticalInfo,
[ReadingMode.CONTINUOUS_HORIZONTAL]: horizontalInfo, [ReadingMode.CONTINUOUS_HORIZONTAL]: horizontalInfo,
}: ScrollingDirectionInfo, }: ElementIntersectionInfo,
readingMode: ReadingMode, readingMode: ReadingMode,
): ScrollingDirection => { ): ElementIntersection => {
if (isContinuousVerticalReadingMode(readingMode)) { if (isContinuousVerticalReadingMode(readingMode)) {
return verticalInfo; return verticalInfo;
} }
@@ -111,26 +111,26 @@ export const useReaderInfiniteScrollUpdateChapter = (
const entry = entries[entries.length - 1]; const entry = entries[entries.length - 1];
const scrollingDirectionInfo = getScrollingDirectionInfo( const elementIntersectionInfo = getElementIntersectionInfo(
readingDirection, readingDirection,
entry.target.getBoundingClientRect(), entry.target.getBoundingClientRect(),
); );
const { backward: isScrollingBackward, forward: isScrollingForward } = getScrollDirection( const { start: isStartIntersecting, end: isEndIntersecting } = getElementIntersection(
scrollingDirectionInfo, elementIntersectionInfo,
readingMode, readingMode,
); );
const wasPageScrolledOutOfView = entry.intersectionRatio < OPEN_CHAPTER_INTERSECTION_RATIO; const wasPageScrolledOutOfView = entry.intersectionRatio < OPEN_CHAPTER_INTERSECTION_RATIO;
if (!shouldHandleIntersectionEvent(scrollingDirectionInfo, readingMode)) { if (!shouldHandleIntersectionEvent(elementIntersectionInfo, readingMode)) {
return; return;
} }
// the first page only opens the previous chapter in case it hasn't been loaded yet, otherwise, the last // the first page only opens the previous chapter in case it hasn't been loaded yet, otherwise, the last
// page handles setting the correct chapter // page handles setting the correct chapter
const initialOpenPreviousChapter = const initialOpenPreviousChapter =
pageType === 'first' && isScrollingBackward && !isChapterToOpenVisible; pageType === 'first' && isStartIntersecting && !isChapterToOpenVisible;
const openPreviousChapter = pageType === 'last' && !isCurrentChapter && isScrollingForward; const openPreviousChapter = pageType === 'last' && !isCurrentChapter && isEndIntersecting;
const openNextChapter = pageType === 'last' && isScrollingForward && wasPageScrolledOutOfView; const openNextChapter = pageType === 'last' && isEndIntersecting && wasPageScrolledOutOfView;
const openChapterToOpen = initialOpenPreviousChapter || openNextChapter; const openChapterToOpen = initialOpenPreviousChapter || openNextChapter;
if (openChapterToOpen) { if (openChapterToOpen) {