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

Properly calculate auto scroll px amount

Browse Source 
"scrollBy" and "scrollTo" require a change of at least 1px, otherwise, nothing will happen
This commit is contained in:
schroda
2024-12-30 02:13:30 +01:00
parent ce49084a89
commit 00170c8e4a
1 changed files with 6 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/modules/core/hooks/useAutomaticScrolling.ts
View File

@@ -10,23 +10,19 @@ import { MutableRefObject, useCallback, useEffect, useMemo, useRef, useState } f
import { ScrollDirection } from '@/modules/core/Core.types.ts'; import { ScrollDirection } from '@/modules/core/Core.types.ts';
import { useResizeObserver } from '@/modules/core/hooks/useResizeObserver.tsx'; import { useResizeObserver } from '@/modules/core/hooks/useResizeObserver.tsx';
// "scrollBy" and "scrollTo" both require at least a change of 1px, otherwise, nothing happens
const MIN_SCROLL_AMOUNT_PX = 1.5; const MIN_SCROLL_AMOUNT_PX = 1.5;
const getScrollAmount = ( const getScrollAmount = (
amountPerMs: number, amountPerMs: number,
speedMs: number, speedMs: number,
isRTL: boolean = false, isRTL: boolean = false,
invert: boolean = false, invert: boolean = false,
): { amountPx: number; speedMs: number } => { ): number => {
const amountPx = amountPerMs * speedMs; const pxPerMs = Math.max(amountPerMs * speedMs, MIN_SCROLL_AMOUNT_PX);
const pxPerMsReadingMode = isRTL ? -pxPerMs : pxPerMs;
if (amountPx >= MIN_SCROLL_AMOUNT_PX) {
const pxPerMsReadingMode = isRTL ? -amountPx : amountPx;
const pxPerMsInverted = invert ? pxPerMsReadingMode * -1 : pxPerMsReadingMode; const pxPerMsInverted = invert ? pxPerMsReadingMode * -1 : pxPerMsReadingMode;
return { amountPx: pxPerMsInverted, speedMs }; return pxPerMsInverted;
}
return getScrollAmount(amountPerMs, speedMs + 1);
}; };
const getPxPerMs = (size: number, scrollAmountPercentage: number, scrollSpeedMs: number): number => const getPxPerMs = (size: number, scrollAmountPercentage: number, scrollSpeedMs: number): number =>