From 6d618518d55fe47e47a66a7ad8bab7924dd205f4 Mon Sep 17 00:00:00 2001 From: Jeremy Valentine <38669521+valentine195@users.noreply.github.com> Date: Tue, 30 Jan 2024 08:57:33 -0500 Subject: [PATCH] fix: Fixes issue with Open/Collapse Admonition commands --- src/callout/manager.ts | 49 ++++++++++++++++++++++++------------------ src/main.ts | 19 +++++++++------- 2 files changed, 39 insertions(+), 29 deletions(-) diff --git a/src/callout/manager.ts b/src/callout/manager.ts index 5df85e5..5ffd757 100644 --- a/src/callout/manager.ts +++ b/src/callout/manager.ts @@ -157,30 +157,37 @@ export default class CalloutManager extends Component { } } titleEl.onclick = (event: MouseEvent) => { - event.preventDefault(); + this.collapse(callout, event); + }; + } - function transitionEnd(evt: TransitionEvent) { - content.removeEventListener("transitionend", transitionEnd); - content.style.removeProperty("transition"); - } - content.addEventListener("transitionend", transitionEnd); - content.style.setProperty( - "transition", - "all 100ms cubic-bezier(.02, .01, .47, 1)" - ); - collapsed = callout.hasClass("is-collapsed"); - if (event.button == 0) { - for (const prop of this.heights) { - const heights = this.getComputedHeights(content); - content.style.setProperty( - prop, - collapsed ? heights[prop] : "0px" - ); - } + collapse(callout: HTMLElement, event?: MouseEvent) { + event?.preventDefault(); + const content = + callout.querySelector(".callout-content"); + + function transitionEnd(evt: TransitionEvent) { + content.removeEventListener("transitionend", transitionEnd); + content.style.removeProperty("transition"); + } + content.addEventListener("transitionend", transitionEnd); + content.style.setProperty( + "transition", + "all 100ms cubic-bezier(.02, .01, .47, 1)" + ); + let collapsed = callout.hasClass("is-collapsed"); - callout.toggleClass("is-collapsed", !collapsed); + if (!event || event.button == 0) { + const heights = this.getComputedHeights(content); + for (const prop of this.heights) { + content.style.setProperty( + prop, + collapsed ? heights[prop] : "0px" + ); } - }; + + callout.toggleClass("is-collapsed", !collapsed); + } } getComputedHeights(el: HTMLDivElement): Heights { diff --git a/src/main.ts b/src/main.ts index 2eee23f..cd39c26 100644 --- a/src/main.ts +++ b/src/main.ts @@ -177,12 +177,13 @@ export default class ObsidianAdmonition extends Plugin { this.app.workspace.getActiveViewOfType(MarkdownView); if (!view || !(view instanceof MarkdownView)) return; - let admonitions = view.contentEl.querySelectorAll( - "details[open].admonition-plugin" - ); + let admonitions = + view.contentEl.querySelectorAll( + ".callout.is-collapsible:not(.is-collapsed)" + ); for (let i = 0; i < admonitions.length; i++) { let admonition = admonitions[i]; - admonition.removeAttribute("open"); + this.calloutManager.collapse(admonition); } } }); @@ -201,12 +202,14 @@ export default class ObsidianAdmonition extends Plugin { this.app.workspace.getActiveViewOfType(MarkdownView); if (!view || !(view instanceof MarkdownView)) return; - let admonitions = view.contentEl.querySelectorAll( - "details:not([open]).admonition-plugin" - ); + let admonitions = + view.contentEl.querySelectorAll( + ".callout.is-collapsible.is-collapsed" + ); for (let i = 0; i < admonitions.length; i++) { let admonition = admonitions[i]; - admonition.setAttribute("open", "open"); + + this.calloutManager.collapse(admonition); } } });