From 074ac0b725122ba04fb7f7158b98839ae87697d9 Mon Sep 17 00:00:00 2001 From: Zack Rauen Date: Thu, 28 Sep 2023 20:59:17 -0400 Subject: [PATCH] Make swagger load from trilium directly --- src/scripts/index.ts | 19 ++++--- src/scripts/modules/expanders.ts | 84 ++++++++++++++++--------------- src/templates/page.ejs | 86 ++++++++++++++++++++------------ 3 files changed, 109 insertions(+), 80 deletions(-) diff --git a/src/scripts/index.ts b/src/scripts/index.ts index cc1ce5158..6164f04fc 100644 --- a/src/scripts/index.ts +++ b/src/scripts/index.ts @@ -56,12 +56,19 @@ function $try unknown>(func: T, ...args: Paramete // Now layout changes // $try(buildBreadcrumbs); // $try(buildSidenav); + +// TODO: Determine the difficulty of adding this in +// trilium directly using JSDOM. $try(setupToC); // Finally, other features +// TODO: how difficult this would be to implement via +// templates or trilium $try(highlight); // $try(injectSwagger, ETAPI_REF_NOTE_ID); +// "Standard" Modules I would recommend the new share +// theme have $try(setupExpanders); $try(setupMobileMenu); $try(setupSearch); @@ -69,14 +76,10 @@ $try(setupThemeSelector); // $try(makeMobileMenu); /** - * This was removed because both the title change and the opengraph - * additions are now handled by a traefik plugin that rewrites - * the body of the http request, that way the change does not - * require client-side JS. This is important for sites wishing - * to display that information. + * This no longer uses a traefik plugin and instead a custom + * template being served through Trilium. * - * TODO: Determine how reasonable it would be to move more - * of these modules over to a traefik rewrite plugin. This gives - * a better experience to end users, SEO, etc. + * TODO: Figure out some good attributes to use to populate + * this inside the template to make it more dynamic */ // $try(addOpenGraphMeta); diff --git a/src/scripts/modules/expanders.ts b/src/scripts/modules/expanders.ts index 5c835c2a0..ebcb2ba77 100644 --- a/src/scripts/modules/expanders.ts +++ b/src/scripts/modules/expanders.ts @@ -1,53 +1,59 @@ -function anchorToId(anchor: HTMLAnchorElement) { - return anchor.href.replace("./", ""); -} +// function anchorToId(anchor: HTMLAnchorElement) { +// return anchor.href.replace("./", ""); +// } +// +// const stored = localStorage.getItem("expanded") ?? "[]"; +// let parsed: string[]; +// try { +// parsed = JSON.parse(stored) as string[]; +// } +// catch (e) { +// parsed = []; +// } +// const state = new Set(parsed); +// const submenus = Array.from(document.querySelectorAll("#menu .submenu-item")); +// for (const sub of submenus) { +// try { +// if (state.has(anchorToId(sub.children[0] as HTMLAnchorElement))) sub.classList.add("expanded"); +// } +// catch (e) { +// // TODO: create logger +// console.warn("Could not restore expanded state"); // eslint-disable-line no-console +// console.error(e); // eslint-disable-line no-console +// } +// } -const stored = localStorage.getItem("expanded") ?? "[]"; -let parsed: string[]; -try { - parsed = JSON.parse(stored) as string[]; -} -catch (e) { - parsed = []; -} -const state = new Set(parsed); -const submenus = Array.from(document.querySelectorAll("#menu .submenu-item")); -for (const sub of submenus) { - try { - if (state.has(anchorToId(sub.children[0] as HTMLAnchorElement))) sub.classList.add("expanded"); - } - catch (e) { - // TODO: create logger - console.warn("Could not restore expanded state"); // eslint-disable-line no-console - console.error(e); // eslint-disable-line no-console +// TODO: Swap this system to use type-book for full-link category + +// In case a linked article lead to a new tree +const activeLink = document.querySelector("#menu a.active"); +if (activeLink) { + let parent = activeLink.parentElement; + const mainMenu = document.getElementById("#menu"); + while (parent && parent !== mainMenu) { + if (parent.matches(".submenu-item") && !parent.classList.contains("expanded")) { + parent.classList.add("expanded"); + } + parent = parent.parentElement; } } export default function setupExpanders() { - const expanders = Array.from(document.querySelectorAll("#menu .collapse-button")); + const expanders = Array.from(document.querySelectorAll("#menu .submenu-item")); for (const ex of expanders) { ex.addEventListener("click", e => { + if ((e.target as Element).closest(".submenu-item,.item") !== ex) return; e.preventDefault(); e.stopPropagation(); // ex.parentElement.parentElement.classList.toggle("expanded"); - ex.closest(".submenu-item")?.classList.toggle("expanded"); - const id = anchorToId(ex.closest("a")!); - if (state.has(id)) state.delete(id); - else state.add(id); - localStorage.setItem("expanded", JSON.stringify([...state])); + ex.classList.toggle("expanded"); + // const id = anchorToId(ex.closest("a")!); + // if (state.has(id)) state.delete(id); + // else state.add(id); + // // TODO: be able to remove all submenus of currently collapsed + // localStorage.setItem("expanded", JSON.stringify([...state])); }); } - // In case a linked article lead to a new tree - const activeLink = document.querySelector("#menu a.active"); - if (activeLink) { - let parent = activeLink.parentElement; - const mainMenu = document.getElementById("#menu"); - while (parent && parent !== mainMenu) { - if (parent.matches(".submenu-item") && !parent.classList.contains("expanded")) { - parent.classList.add("expanded"); - } - parent = parent.parentElement; - } - } + } \ No newline at end of file diff --git a/src/templates/page.ejs b/src/templates/page.ejs index fcf619044..b702131ac 100644 --- a/src/templates/page.ejs +++ b/src/templates/page.ejs @@ -18,13 +18,35 @@ <% } %> <% if (note.hasLabel("shareSwagger")) { %> - - + + @@ -43,6 +65,7 @@ <% } %> <%- header %> <%= note.title %><% if (note.noteId !== subRoot.noteId) { %> - <%= subRoot.title %><% } %> + @@ -107,40 +130,37 @@ const themeClass = currentTheme === "light" ? " theme-light" : " theme-dark";
-
- +
- <% if (note.hasLabel("pageUrl")) { %> -
This note was originally clipped from "><%= note.getLabelValue("pageUrl") %>
- <% } %> - - -
-

<%= note.title %>

- <% if (isEmpty && !note.hasVisibleChildren()) { %> -

This note has no content.

- <% } else { %> - <%- content %> - <% } %> -
- - <% if (note.hasVisibleChildren()) { %> - - <% } else %> -
+ +
    + <% + const action = note.type === "book" ? "getChildNotes" : "getVisibleChildNotes"; + for (const childNote of note[action]()) { + %> +
  • + <%= childNote.title %> +
    • + <% } %> +
+ + <% } else %> +