add router event cancelling
This commit is contained in:
parent
48fa39ed64
commit
520040a6bf
@ -59,7 +59,7 @@ export class Engine {
|
|||||||
this.setupInteraction();
|
this.setupInteraction();
|
||||||
this.setupGraphStyle();
|
this.setupGraphStyle();
|
||||||
|
|
||||||
let path = router.last('retrieve')?.params?.path;
|
let path = router.recall('retrieve')?.params?.path;
|
||||||
setTimeout(() => router.emit('retrieve', { path }), 500);
|
setTimeout(() => router.emit('retrieve', { path }), 500);
|
||||||
|
|
||||||
return container;
|
return container;
|
||||||
|
|||||||
@ -184,7 +184,7 @@ export class Folder extends BaseNode {
|
|||||||
data-[active=true]:border-red-600 hover:border-neutral-800"
|
data-[active=true]:border-red-600 hover:border-neutral-800"
|
||||||
>
|
>
|
||||||
<a class="truncate md:text-base text-lg" href="/${node.path}"
|
<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>
|
>${node.name}</a>
|
||||||
</div>
|
</div>
|
||||||
`;
|
`;
|
||||||
@ -217,14 +217,13 @@ export class Folder extends BaseNode {
|
|||||||
return `
|
return `
|
||||||
<div x-data="{ active: null, navigate: false }"
|
<div x-data="{ active: null, navigate: false }"
|
||||||
x-init="let react = () => {
|
x-init="let react = () => {
|
||||||
let isFromNav = navigate;
|
|
||||||
let path = window.location.pathname;
|
let path = window.location.pathname;
|
||||||
|
|
||||||
active?.setAttribute('data-active', false);
|
active?.setAttribute('data-active', false);
|
||||||
active = $el.querySelector(\`[data-path="\${path}"]\`);
|
active = $el.querySelector(\`[data-path="\${path}"]\`);
|
||||||
active?.setAttribute('data-active', true);
|
active?.setAttribute('data-active', true);
|
||||||
|
|
||||||
if (isFromNav) return;
|
if (navigate) return navigate = false;
|
||||||
let node = active;
|
let node = active;
|
||||||
|
|
||||||
if (node) while ((node = node.parentElement) !== $el) {
|
if (node) while ((node = node.parentElement) !== $el) {
|
||||||
@ -238,10 +237,6 @@ export class Folder extends BaseNode {
|
|||||||
router.on('ready', () => {
|
router.on('ready', () => {
|
||||||
$nextTick(() => react());
|
$nextTick(() => react());
|
||||||
});
|
});
|
||||||
router.on('navigate', () => {
|
|
||||||
navigate = true;
|
|
||||||
$nextTick(() => navigate = false);
|
|
||||||
});
|
|
||||||
$nextTick(() => react())"
|
$nextTick(() => react())"
|
||||||
>${html}</div>
|
>${html}</div>
|
||||||
`;
|
`;
|
||||||
|
|||||||
@ -5,7 +5,7 @@ const Routes = {
|
|||||||
|
|
||||||
const Events = {
|
const Events = {
|
||||||
entries: { /* eventName: [callbacks], */ },
|
entries: { /* eventName: [callbacks], */ },
|
||||||
history: [ /* { eventName, params, }, */ ]
|
history: [ /* { eventName, params, }, */ ],
|
||||||
}
|
}
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
@ -47,11 +47,15 @@ export default {
|
|||||||
|
|
||||||
Events.entries[event]?.forEach(fn => fn(params));
|
Events.entries[event]?.forEach(fn => fn(params));
|
||||||
},
|
},
|
||||||
last(event) {
|
|
||||||
return Events.history.find(e => e.event === event);
|
|
||||||
},
|
|
||||||
on(event, callback) {
|
on(event, callback) {
|
||||||
if (! Events.entries[event]) Events.entries[event] = [];
|
if (! Events.entries[event]) Events.entries[event] = [];
|
||||||
Events.entries[event]?.push(callback);
|
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);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user