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

[Improvment] Drag scrolling inertia calculation no longer locked to 60hz (#1003)

Browse Source 
* feat/make-drag-scroll-not-locked-to-60

* fixup-addresing comments
This commit is contained in:
bornav
2025-08-24 20:46:32 +02:00
committed by GitHub
parent 870174632b
commit f851c04932
1 changed files with 13 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/base/hooks/useMouseDragScroll.tsx
View File

@@ -37,7 +37,7 @@ export const useMouseDragScroll = (
const previousClickPosY = useRef<Positions>([0, 0, 0]); const previousClickPosY = useRef<Positions>([0, 0, 0]);
const previousClickTime = useRef<ClickTimes>([0, 0, 0]); const previousClickTime = useRef<ClickTimes>([0, 0, 0]);
const scrollAtT0 = useRef<[ScrollLeft: number, ScrollTop: number]>([0, 0]); const scrollAtT0 = useRef<[ScrollLeft: number, ScrollTop: number]>([0, 0]);
const inertiaTimeInterval = useRef<NodeJS.Timeout>(undefined); const inertiaTimeInterval = useRef<number>(undefined);
useEffect(() => { useEffect(() => {
const element = ref?.current; const element = ref?.current;
@@ -68,7 +68,12 @@ export const useMouseDragScroll = (
const handleScrollX = scrollDirection !== ScrollDirection.Y; const handleScrollX = scrollDirection !== ScrollDirection.Y;
const handleScrollY = scrollDirection !== ScrollDirection.X; const handleScrollY = scrollDirection !== ScrollDirection.X;
const clearInertiaInterval = () => clearInterval(inertiaTimeInterval.current); const clearInertiaInterval = () => {
if (inertiaTimeInterval.current !== undefined) {
cancelAnimationFrame(inertiaTimeInterval.current);
inertiaTimeInterval.current = undefined;
}
};
const inertiaMove = () => { const inertiaMove = () => {
const calcVelocity = (positions: Positions, clickTimes: ClickTimes, size: number): number => const calcVelocity = (positions: Positions, clickTimes: ClickTimes, size: number): number =>
@@ -194,7 +199,12 @@ export const useMouseDragScroll = (
}, 0); }, 0);
scrollAtT0.current = [element.scrollLeft, element.scrollTop]; scrollAtT0.current = [element.scrollLeft, element.scrollTop];
inertiaTimeInterval.current = setInterval(inertiaMove, 16);
const inertiaLoop = () => {
inertiaMove();
inertiaTimeInterval.current = requestAnimationFrame(inertiaLoop);
};
inertiaTimeInterval.current = requestAnimationFrame(inertiaLoop);
}; };
const handleMouseDown = (e: MouseEvent) => { const handleMouseDown = (e: MouseEvent) => {