From 520040a6bfda8d6ad9d18b7b0decf4758d980720 Mon Sep 17 00:00:00 2001
From: Break27 <buzybreakerbear@gmail.com>
Date: Sat, 21 Sep 2024 14:50:52 +0800
Subject: [PATCH] add router event cancelling

---
 src/scripts/graph.js  |  2 +-
 src/scripts/object.js |  9 ++-------
 src/scripts/router.js | 12 ++++++++----
 3 files changed, 11 insertions(+), 12 deletions(-)

diff --git a/src/scripts/graph.js b/src/scripts/graph.js
index 45b91cc..1158bf2 100644
--- a/src/scripts/graph.js
+++ b/src/scripts/graph.js
@@ -59,7 +59,7 @@ export class Engine {
         this.setupInteraction();
         this.setupGraphStyle();
 
-        let path = router.last('retrieve')?.params?.path;
+        let path = router.recall('retrieve')?.params?.path;
         setTimeout(() => router.emit('retrieve', { path }), 500);
 
         return container;
diff --git a/src/scripts/object.js b/src/scripts/object.js
index 318cf72..39b4d46 100644
--- a/src/scripts/object.js
+++ b/src/scripts/object.js
@@ -184,7 +184,7 @@ export class Folder extends BaseNode {
                           data-[active=true]:border-red-600 hover:border-neutral-800"
               >
                 <a class="truncate md:text-base text-lg" href="/${node.path}"
-                   @click="router.emit('navigate'); router.from($event)"
+                   @click="navigate = true; router.from($event)"
                 >${node.name}</a>
               </div>
             `;
@@ -217,14 +217,13 @@ export class Folder extends BaseNode {
         return `
           <div x-data="{ active: null, navigate: false }"
                x-init="let react = () => {
-                           let isFromNav = navigate;
                            let path = window.location.pathname;
 
                            active?.setAttribute('data-active', false);
                            active = $el.querySelector(\`[data-path=&quot;\${path}&quot;]\`);
                            active?.setAttribute('data-active', true);
 
-                           if (isFromNav) return;
+                           if (navigate) return navigate = false;
                            let node = active;
 
                            if (node) while ((node = node.parentElement) !== $el) {
@@ -238,10 +237,6 @@ export class Folder extends BaseNode {
                        router.on('ready', () => {
                            $nextTick(() => react());
                        });
-                       router.on('navigate', () => {
-                           navigate = true;
-                           $nextTick(() => navigate = false);
-                       });
                        $nextTick(() => react())"
           >${html}</div>
         `;
diff --git a/src/scripts/router.js b/src/scripts/router.js
index d61d227..da3ec38 100644
--- a/src/scripts/router.js
+++ b/src/scripts/router.js
@@ -5,7 +5,7 @@ const Routes = {
 
 const Events = {
     entries: { /* eventName: [callbacks], */ },
-    history: [ /* { eventName, params, }, */ ]
+    history: [ /* { eventName, params, }, */ ],
 }
 
 export default {
@@ -47,11 +47,15 @@ export default {
 
         Events.entries[event]?.forEach(fn => fn(params));
     },
-    last(event) {
-        return Events.history.find(e => e.event === event);
-    },
     on(event, callback) {
         if (! Events.entries[event]) Events.entries[event] = [];
         Events.entries[event]?.push(callback);
+    },
+    recall(event) {
+        return Events.history.find(e => e.event === event);
+    },
+    cancel(event) {
+        let callbacks = Events.entries[event]?.splice(0, 50);
+        this.on(event, () => Events.entries[event] = callbacks);
     }
 }