From ed66484715cdcbc9fc761624072a3f2f1dcb4749 Mon Sep 17 00:00:00 2001
From: andev0 <fejalex@gmail.com>
Date: Sat, 31 Aug 2024 21:50:56 +0200
Subject: [PATCH] Don't show slots connecting cancelling while not connecting

---
 dist/index.html     | 14 +++++++-------
 src/MouseHandler.ts |  6 ++++++
 2 files changed, 13 insertions(+), 7 deletions(-)

diff --git a/dist/index.html b/dist/index.html
index 5c6c53d..2a05349 100644
--- a/dist/index.html
+++ b/dist/index.html
@@ -44,12 +44,12 @@
                 <p id="ratio-display">Zoom: 1.0x</p>
             </div>
             <div class="row">
+                <div class="button hidden" id="cancel-linking" title="Cancel connecting nodes">
+                    <svg class="unlink_icon-placeholder"></svg>
+                </div>
                 <div class="button" id="open-help" title="Help">
                     <svg class="question-mark_icon-placeholder"></svg>
                 </div>
-                <div class="button" id="cancel-linking" title="Cancel connecting nodes">
-                    <svg class="unlink_icon-placeholder"></svg>
-                </div>
                 <div class="button toggle off" id="grid-toggle" title="Toggle grid">
                     <svg class="off grid_icon-placeholder"></svg>
                     <svg class="on disable-grid_icon-placeholder"></svg>
@@ -473,6 +473,10 @@ <h2 class="title">Help <span class="background">&nbsp;&nbsp;&nbsp;&nbsp;(⩾﹏
 
     <div id="canvas-context-menu-container" class="context-menu-container hidden">
         <div class="context-menu">
+            <div class="option hidden" id="cancel-linking-option">
+                <svg class="unlink_icon-placeholder"></svg>
+                <div class="text">Cancel connecting nodes</div>
+            </div>
             <div class="option" id="create-node-option">
                 <svg class="plus_icon-placeholder"></svg>
                 <div class="text">Create node</div>
@@ -497,10 +501,6 @@ <h2 class="title">Help <span class="background">&nbsp;&nbsp;&nbsp;&nbsp;(⩾﹏
                     <div class="text">Enable grid</div>
                 </div>
             </div>
-            <div class="option" id="cancel-linking-option">
-                <svg class="unlink_icon-placeholder"></svg>
-                <div class="text">Cancel connecting nodes</div>
-            </div>
             <div class="option" id="show-help-option">
                 <svg class="question-mark_icon-placeholder"></svg>
                 <div class="text">Show help</div>
diff --git a/src/MouseHandler.ts b/src/MouseHandler.ts
index 78f8d8a..83e1190 100644
--- a/src/MouseHandler.ts
+++ b/src/MouseHandler.ts
@@ -96,6 +96,9 @@ export class MouseHandler
             this.slotConnectingCurve = undefined;
             this.mouseStatus = MouseHandler.MouseStatus.Free;
             Settings.instance.connectingResource = undefined;
+
+            document.querySelector(".controls #cancel-linking")!.classList.add("hidden");
+            document.querySelector("#canvas-context-menu-container #cancel-linking-option")!.classList.add("hidden");
         }
     }
 
@@ -231,6 +234,9 @@ export class MouseHandler
         this.slotConnectingLine.setAttribute("d", path);
 
         this.viewport.appendChild(this.slotConnectingLine);
+
+        document.querySelector(".controls #cancel-linking")!.classList.remove("hidden");
+        document.querySelector("#canvas-context-menu-container #cancel-linking-option")!.classList.remove("hidden");
     }
 
     public startDraggingNode(node: SankeyNode, position: Point)