From 3cb36d36bfd3eedd7b5f022c2efdab72a9cfbdb2 Mon Sep 17 00:00:00 2001
From: jordy <jordyvandertang@hotmail.com>
Date: Sun, 23 Apr 2023 09:58:32 +0200
Subject: [PATCH] address PR feedback

---
 src/main/resources/templates/multi-tool.html | 26 +++++++++++---------
 1 file changed, 15 insertions(+), 11 deletions(-)

diff --git a/src/main/resources/templates/multi-tool.html b/src/main/resources/templates/multi-tool.html
index 8665fc67..b4cae58d 100644
--- a/src/main/resources/templates/multi-tool.html
+++ b/src/main/resources/templates/multi-tool.html
@@ -67,7 +67,7 @@
         const pagesContainer = document.getElementById("pages-container");
         const pagesContainerWrapper = document.getElementById("pages-container-wrapper")
 
-        const pageDirection = getComputedStyle(document.body).direction;
+        const pageDirection = document.documentElement.getAttribute("lang-direction");
 
         var scrollDelta = 0; // variable to store the accumulated scroll delta
         var isScrolling = false; // variable to track if scroll is already in progress
@@ -106,7 +106,7 @@
          * 
          */
         const imageHighlighter = document.getElementById('image-highlighter');
-        imageHighlighter.onclick = (e) => {
+        imageHighlighter.onclick = () => {
             imageHighlighter.childNodes.forEach((child) => {
                 child.classList.add('remove');
                 setTimeout(() => {
@@ -115,6 +115,18 @@
             })
         }
 
+        const imageHighlightCallback = (highlightEvent) => {
+            var bigImg = document.createElement('img');
+            bigImg.onclick = (imageClickEvent) => {
+                // This prevents the highlighter's onClick from closing the image when clicking on the image
+                // instead of next to it.
+                imageClickEvent.preventDefault();
+                imageClickEvent.stopPropagation();
+            };
+            bigImg.src = highlightEvent.target.src;
+            imageHighlighter.appendChild(bigImg);
+        }
+
         /**
          * 
          * Methods for managing PDFs
@@ -227,15 +239,7 @@
                     /**
                      *  Making pages larger when clicking on them
                      */
-                    img.addEventListener('mousedown', (x) => {
-                        var bigImg = document.createElement('img');
-                        bigImg.onclick = (e) => {
-                            e.preventDefault();
-                            e.stopPropagation();
-                        };
-                        bigImg.src = imageSrc;
-                        imageHighlighter.appendChild(bigImg);
-                    })
+                    img.addEventListener('click',imageHighlightCallback)
                     
                     /**
                      *  Rendering the various buttons to manipulate and move pdf pages