decrease reader's up and down arrows scrolling distance (#588)

* revert reader's up and down arrows behavior * add variant to scrolling shortcuts * remove comments for SCROLL_OFFSET & SCROLL_OFFSET_SLIGHT * Apply suggestions from code review see PR #588 Co-authored-by: schroda <[email protected]> * fix linting --------- Co-authored-by: schroda <[email protected]>
Suwayomi · Feb 1, 2024 · 7fb1dae · 7fb1dae
1 parent 3077824
commit 7fb1dae
Showing 1 changed file with 9 additions and 2 deletions.
diff --git a/src/components/reader/pager/VerticalPager.tsx b/src/components/reader/pager/VerticalPager.tsx
@@ -25,6 +25,7 @@ const findCurrentPageIndex = (wrapper: HTMLDivElement): number => {
 // TODO: make configurable?
 const SCROLL_SAFE_ZONE = 5; // px
 const SCROLL_OFFSET = 0.95;
+const SCROLL_OFFSET_SLIGHT = 0.25;
 const SCROLL_BEHAVIOR: ScrollBehavior = 'smooth';
 
 const isAtBottom = () => {
@@ -111,7 +112,7 @@ export function VerticalPager(props: IReaderProps) {
     }, [selfRef]);
 
     const go = useCallback(
-        (direction: 'up' | 'down') => {
+        (direction: 'up' | 'down', offset: number = SCROLL_OFFSET) => {
             if (direction === 'down' && isAtBottom()) {
                 nextChapter();
                 return;
@@ -123,7 +124,7 @@ export function VerticalPager(props: IReaderProps) {
             }
 
             window.scroll({
-                top: window.scrollY + window.innerHeight * SCROLL_OFFSET * (direction === 'up' ? -1 : 1),
+                top: window.scrollY + window.innerHeight * offset * (direction === 'up' ? -1 : 1),
                 behavior: SCROLL_BEHAVIOR,
             });
         },
@@ -138,11 +139,17 @@ export function VerticalPager(props: IReaderProps) {
                     go(e.shiftKey ? 'up' : 'down');
                     break;
                 case 'ArrowDown':
+                    e.preventDefault();
+                    go(e.shiftKey ? 'up' : 'down', SCROLL_OFFSET_SLIGHT);
+                    break;
                 case 'ArrowRight':
                     e.preventDefault();
                     go(e.shiftKey ? 'up' : 'down');
                     break;
                 case 'ArrowUp':
+                    e.preventDefault();
+                    go(e.shiftKey ? 'down' : 'up', SCROLL_OFFSET_SLIGHT);
+                    break;
                 case 'ArrowLeft':
                     e.preventDefault();
                     go(e.shiftKey ? 'down' : 'up');