From dcc9abd644201d8e08cf11d9f7da436d1671616d Mon Sep 17 00:00:00 2001
From: TheoryOfNekomata <allan.crisostomo@outlook.com>
Date: Mon, 14 Mar 2022 08:58:15 +0800
Subject: [PATCH] Fix scrolling behavior

Check if target scroll container does not need to scroll in order to
preserve scroll of other scroll container.
---
 src/pages/index.tsx | 16 ++++++++++++----
 1 file changed, 12 insertions(+), 4 deletions(-)

diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index a1ba258..fe5133d 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -322,8 +322,12 @@ const IndexPage: NextPage = () => {
 
     scrollRef.current = true;
     const target = e.currentTarget
-    worldScrollRef.current.scrollTop = Math.floor(target.scrollTop / (target.scrollHeight - target.offsetHeight) * (worldScrollRef.current.scrollHeight - worldScrollRef.current.offsetHeight));
-    worldScrollRef.current.scrollLeft = Math.floor(target.scrollLeft / (target.scrollWidth - target.offsetWidth) * (worldScrollRef.current.scrollWidth - worldScrollRef.current.offsetWidth));
+    if (target.scrollHeight > target.offsetHeight) {
+      worldScrollRef.current.scrollTop = Math.floor(target.scrollTop / (target.scrollHeight - target.offsetHeight) * (worldScrollRef.current.scrollHeight - worldScrollRef.current.offsetHeight));
+    }
+    if (target.scrollWidth > target.offsetWidth) {
+      worldScrollRef.current.scrollLeft = Math.floor(target.scrollLeft / (target.scrollWidth - target.offsetWidth) * (worldScrollRef.current.scrollWidth - worldScrollRef.current.offsetWidth));
+    }
   }
 
   const handleWorldScroll: UIEventHandler<HTMLDivElement> = (e) => {
@@ -338,8 +342,12 @@ const IndexPage: NextPage = () => {
 
     scrollRef.current = true;
     const target = e.currentTarget
-    baseMapScrollRef.current.scrollTop = Math.floor(target.scrollTop / (target.scrollHeight - target.offsetHeight) * (baseMapScrollRef.current.scrollHeight - baseMapScrollRef.current.offsetHeight));
-    baseMapScrollRef.current.scrollLeft = Math.floor(target.scrollLeft / (target.scrollWidth - target.offsetWidth) * (baseMapScrollRef.current.scrollWidth - baseMapScrollRef.current.offsetWidth));
+    if (target.scrollHeight > target.offsetHeight) {
+      baseMapScrollRef.current.scrollTop = Math.floor(target.scrollTop / (target.scrollHeight - target.offsetHeight) * (baseMapScrollRef.current.scrollHeight - baseMapScrollRef.current.offsetHeight));
+    }
+    if (target.scrollWidth > target.offsetWidth) {
+      baseMapScrollRef.current.scrollLeft = Math.floor(target.scrollLeft / (target.scrollWidth - target.offsetWidth) * (baseMapScrollRef.current.scrollWidth - baseMapScrollRef.current.offsetWidth));
+    }
   }
 
   useEffect(() => {