From cb8f4669e8b86961ccf8a1cc85860db3be01318f Mon Sep 17 00:00:00 2001
From: chrox <chrox.huang@gmail.com>
Date: Mon, 25 Nov 2024 18:00:10 +0100
Subject: [PATCH] Fix single click turns pages on all views

---
 .../src/app/reader/components/FoliateViewer.tsx     | 10 +++++-----
 .../src/app/reader/utils/iframeEventHandlers.ts     | 13 +++++++++----
 2 files changed, 14 insertions(+), 9 deletions(-)

diff --git a/apps/readest-app/src/app/reader/components/FoliateViewer.tsx b/apps/readest-app/src/app/reader/components/FoliateViewer.tsx
index 07a6e5db..f61b8501 100644
--- a/apps/readest-app/src/app/reader/components/FoliateViewer.tsx
+++ b/apps/readest-app/src/app/reader/components/FoliateViewer.tsx
@@ -82,16 +82,16 @@ const FoliateViewer: React.FC<{
     if (detail.doc) {
       if (!detail.doc.isEventListenersAdded) {
         detail.doc.isEventListenersAdded = true;
-        detail.doc.addEventListener('keydown', handleKeydown);
-        detail.doc.addEventListener('mousedown', handleMousedown);
-        detail.doc.addEventListener('mouseup', handleMouseup);
-        detail.doc.addEventListener('click', handleClick);
+        detail.doc.addEventListener('keydown', handleKeydown.bind(null, bookKey));
+        detail.doc.addEventListener('mousedown', handleMousedown.bind(null, bookKey));
+        detail.doc.addEventListener('mouseup', handleMouseup.bind(null, bookKey));
+        detail.doc.addEventListener('click', handleClick.bind(null, bookKey));
       }
     }
   };
 
   const handleClickTurnPage = (msg: MessageEvent) => {
-    if (msg.data && msg.data.type === 'iframe-single-click') {
+    if (msg.data && msg.data.type === 'iframe-single-click' && msg.data.bookKey === bookKey) {
       const viewElement = containerRef.current;
       if (viewElement) {
         const rect = viewElement.getBoundingClientRect();
diff --git a/apps/readest-app/src/app/reader/utils/iframeEventHandlers.ts b/apps/readest-app/src/app/reader/utils/iframeEventHandlers.ts
index b09e4bf6..ade3707f 100644
--- a/apps/readest-app/src/app/reader/utils/iframeEventHandlers.ts
+++ b/apps/readest-app/src/app/reader/utils/iframeEventHandlers.ts
@@ -3,13 +3,14 @@ const longHoldThreshold = 500;
 let lastClickTime = 0;
 let longHoldTimeout: ReturnType<typeof setTimeout> | null = null;
 
-export const handleKeydown = (event: KeyboardEvent) => {
+export const handleKeydown = (bookKey: string, event: KeyboardEvent) => {
   if (['Backspace', 'ArrowDown', 'ArrowUp'].includes(event.key)) {
     event.preventDefault();
   }
   window.postMessage(
     {
       type: 'iframe-keydown',
+      bookKey,
       key: event.key,
       code: event.code,
       ctrlKey: event.ctrlKey,
@@ -21,13 +22,14 @@ export const handleKeydown = (event: KeyboardEvent) => {
   );
 };
 
-export const handleMousedown = (event: MouseEvent) => {
+export const handleMousedown = (bookKey: string, event: MouseEvent) => {
   longHoldTimeout = setTimeout(() => {
     longHoldTimeout = null;
   }, longHoldThreshold);
   window.postMessage(
     {
       type: 'iframe-mousedown',
+      bookKey,
       screenX: event.screenX,
       screenY: event.screenY,
       clientX: event.clientX,
@@ -39,10 +41,11 @@ export const handleMousedown = (event: MouseEvent) => {
   );
 };
 
-export const handleMouseup = (event: MouseEvent) => {
+export const handleMouseup = (bookKey: string, event: MouseEvent) => {
   window.postMessage(
     {
       type: 'iframe-mouseup',
+      bookKey,
       screenX: event.screenX,
       screenY: event.screenY,
       clientX: event.clientX,
@@ -54,7 +57,7 @@ export const handleMouseup = (event: MouseEvent) => {
   );
 };
 
-export const handleClick = (event: MouseEvent) => {
+export const handleClick = (bookKey: string, event: MouseEvent) => {
   const now = Date.now();
 
   if (now - lastClickTime < doubleClickThreshold) {
@@ -62,6 +65,7 @@ export const handleClick = (event: MouseEvent) => {
     window.postMessage(
       {
         type: 'iframe-double-click',
+        bookKey,
         screenX: event.screenX,
         screenY: event.screenY,
         clientX: event.clientX,
@@ -93,6 +97,7 @@ export const handleClick = (event: MouseEvent) => {
       window.postMessage(
         {
           type: 'iframe-single-click',
+          bookKey,
           screenX: event.screenX,
           screenY: event.screenY,
           clientX: event.clientX,