From 804ec0144fa053b447a23769aeb44d2e6d1694c0 Mon Sep 17 00:00:00 2001
From: Praful Bhawsar <prtsh32@gmail.com>
Date: Wed, 31 Jan 2024 13:12:58 -0500
Subject: [PATCH] Bug fixes

---
 drawCanvas.js | 31 ++++++++++++++++++++++++-------
 main.js       | 11 ++++++++++-
 style.css     |  1 +
 3 files changed, 35 insertions(+), 8 deletions(-)

diff --git a/drawCanvas.js b/drawCanvas.js
index 7acf8e2..960c4e3 100644
--- a/drawCanvas.js
+++ b/drawCanvas.js
@@ -468,7 +468,6 @@ function drawCoresOnCanvasForTravelingAlgorithm() {
         if (!e.shift) {
           overlay.element.style.cursor = "grabbing"
           overlay.update(overlay.location.plus(delta))
-
         } else {
           overlay.element.style.cursor = "nwse-resize"
           let {width, height} = overlay.bounds
@@ -479,11 +478,13 @@ function drawCoresOnCanvasForTravelingAlgorithm() {
         }
         
         overlay.drawHTML(overlay.element.parentElement, window.viewer.viewport)
-
+        
         const deltaPosInImageCoords = window.viewer.viewport.viewportToImageCoordinates(delta)
         if (index !== -1) {
           window.sortedCoresData[index].x += deltaPosInImageCoords.x
           window.sortedCoresData[index].y += deltaPosInImageCoords.y
+          document.getElementById("editXInput").value = window.sortedCoresData[index].x
+          document.getElementById("editYInput").value =  window.sortedCoresData[index].y
         
           connectAdjacentCores(window.sortedCoresData[index], true)
         }
@@ -930,10 +931,21 @@ function drawCoresOnCanvasForTravelingAlgorithm() {
     });
   }
 
-  document
-    .getElementById("osdViewerAddCoreBtn")
-    .addEventListener("click", function (e) {
-      const addCoreBtn = document.getElementById("osdViewerAddCoreBtn")
+  const addCoreHandler = (e) => {
+
+    const addCoreBtn = document.getElementById("osdViewerAddCoreBtn")
+    if (addCoreBtn.classList.contains("active")) {
+      addCoreBtn.classList.remove("active")
+      window.viewer.canvas.style.cursor = "auto"
+      window.viewer.removeAllHandlers("canvas-drag")
+      window.viewer.removeAllHandlers("canvas-drag-end")
+    } else {
+      document.addEventListener("keydown", (e) => {
+        e.preventDefault()
+        if (e.key === 'Escape') {
+          addCoreHandler()
+        }
+      })
       addCoreBtn.classList.add("active")
       window.viewer.canvas.style.cursor = "crosshair"
 
@@ -980,8 +992,13 @@ function drawCoresOnCanvasForTravelingAlgorithm() {
         updateSidebar(core);
         positionSidebarNextToCore(e.originalEvent);
       })
+    }
     
-    });
+  }
+
+  document
+    .getElementById("osdViewerAddCoreBtn")
+    .addEventListener("click", addCoreHandler)
  
   // document
   //   .getElementById("addCoreButton")
diff --git a/main.js b/main.js
index 2ee731f..f701a9e 100644
--- a/main.js
+++ b/main.js
@@ -577,6 +577,9 @@ function bindEventListeners() {
     button.addEventListener("click", function () {
       const sidebar = this.closest(".edit-sidebar");
       sidebar.style.display = "none"; // You can toggle visibility or minimize the sidebar as required
+      window.viewer.currentOverlays.forEach(o => {
+        o.element.classList.remove("selected")
+      })
     });
   });
 
@@ -745,7 +748,7 @@ const initSegmentation = async () => {
       }
       document.getElementById("osdViewer").style.width = `${window.loadedImg.getAttribute("width")}px`
       document.getElementById("osdViewer").style.height = `${window.loadedImg.getAttribute("height")}px`
-
+      window.viewer?.destroy()
       window.viewer = OpenSeadragon({
         id: "osdViewer",
         visibilityRatio: 1,
@@ -861,6 +864,12 @@ const initSegmentation = async () => {
     });
 };
 
+document.querySelectorAll("input[type='number']").forEach(e => {
+  e.onwheel = (e) => {
+    e.preventDefault()
+  }
+})
+
 function moveToCarouselItem(direction) {
   var current = document.querySelector(".carousel-item.active");
   var items = document.querySelectorAll(".carousel-item");
diff --git a/style.css b/style.css
index 6a24225..0c5b263 100644
--- a/style.css
+++ b/style.css
@@ -145,6 +145,7 @@ nav ul li a:hover {
   background-color: #f9f9f9;
   color: #555;
 }
+
 /* Spacing around sections */
 .hyperparameters, .file-upload-container, .tabcontent, .instructions-container {
   margin-bottom: 20px; /* Consistent bottom spacing */