mirror of
https://github.com/zadam/trilium.git
synced 2025-10-19 06:38:59 +02:00
feat(collection/presentation): make cross-slide links work
This commit is contained in:
parent
bfa1c2a2dd
commit
27cc858b67
@ -140,6 +140,10 @@ function Presentation({ presentation, setApi } : { presentation: PresentationMod
|
||||
api.initialize().then(() => {
|
||||
setRevealApi(api);
|
||||
setApi(api);
|
||||
|
||||
if (containerRef.current) {
|
||||
rewireLinks(containerRef.current, api);
|
||||
}
|
||||
});
|
||||
|
||||
return () => {
|
||||
@ -177,7 +181,7 @@ function Presentation({ presentation, setApi } : { presentation: PresentationMod
|
||||
function Slide({ slide }: { slide: PresentationSlideBaseModel }) {
|
||||
return (
|
||||
<section
|
||||
id={slide.noteId}
|
||||
id={`slide-${slide.noteId}`}
|
||||
data-note-id={slide.noteId}
|
||||
data-background-color={slide.backgroundColor}
|
||||
data-background-gradient={slide.backgroundGradient}
|
||||
@ -190,3 +194,23 @@ function getNoteIdFromSlide(slide: HTMLElement | undefined) {
|
||||
if (!slide) return;
|
||||
return slide.dataset.noteId;
|
||||
}
|
||||
|
||||
function rewireLinks(container: HTMLElement, api: Reveal.Api) {
|
||||
const links = container.querySelectorAll<HTMLLinkElement>("a.reference-link");
|
||||
for (const link of links) {
|
||||
link.addEventListener("click", () => {
|
||||
/**
|
||||
* Reveal.js has built-in navigation by either index or ID. However, the ID-based navigation doesn't work because it tries to look
|
||||
* outside the shadom DOM (via document.getElementById).
|
||||
*/
|
||||
const url = new URL(link.href);
|
||||
if (!url.hash.startsWith("#/slide-")) return;
|
||||
const targetId = url.hash.substring(8);
|
||||
const slide = container.querySelector<HTMLElement>(`#slide-${targetId}`);
|
||||
if (!slide) return;
|
||||
|
||||
const { h, v, f } = api.getIndices(slide);
|
||||
api.slide(h, v, f);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
@ -65,7 +65,7 @@ async function processContent(note: FNote): Promise<DangerouslySetInnerHTML> {
|
||||
async function postProcessSlides(slides: (PresentationSlideModel | PresentationSlideBaseModel)[]) {
|
||||
for (const slide of slides) {
|
||||
if (slide.type !== "text") continue;
|
||||
slide.content.__html = slide.content.__html.replaceAll(/href="[^"]*#root[a-zA-Z0-9_\/]*\/([a-zA-Z0-9_]+)[^"]*"/g, `href="#/$1"`);
|
||||
slide.content.__html = slide.content.__html.replaceAll(/href="[^"]*#root[a-zA-Z0-9_\/]*\/([a-zA-Z0-9_]+)[^"]*"/g, `href="#/slide-$1"`);
|
||||
if ("verticalSlides" in slide && slide.verticalSlides) {
|
||||
postProcessSlides(slide.verticalSlides);
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user