dragonwocky/notion-enhancer
1
0
Fork 0
mirror of https://github.com/notion-enhancer/notion-enhancer.git synced 2025-04-11 15:59:03 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(outliner): render tex equations nicely

Browse Source
This commit is contained in:
dragonwocky 2024-02-05 12:42:23 +11:00
parent beb5873788
commit 6bfe1d8b07
Signed by: dragonwocky
GPG Key ID: 7998D08F7D7BD7A8
2 changed files with 30 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
src/extensions/outliner/client.mjs
View File

@ -11,6 +11,10 @@ export default async (api, db) => {
const { html, debounce, addMutationListener, addPanelView } = api, const { html, debounce, addMutationListener, addPanelView } = api,
behavior = (await db.get("smoothScrolling")) ? "smooth" : "auto", behavior = (await db.get("smoothScrolling")) ? "smooth" : "auto",
scroller = ".notion-frame > .notion-scroller", scroller = ".notion-frame > .notion-scroller",
equation = ".notion-text-equation-token",
annotation = (await db.get("equationRendering"))
? ".katex-html"
: ".katex-mathml annotation",
page = ".notion-page-content", page = ".notion-page-content",
headings = [ headings = [
".notion-header-block", ".notion-header-block",
@ -69,18 +73,30 @@ export default async (api, db) => {
for (let i = 0; i < headings.length; i++) for (let i = 0; i < headings.length; i++)
if ($heading.matches(headings[i])) return i + 1; if ($heading.matches(headings[i])) return i + 1;
}, },
getHeadingTitle = ($heading) => {
if (!$heading.innerText) return "Untitled";
let title = "";
for (const node of $heading.querySelector("h2, h3, h4").childNodes) {
if (node.nodeType === 3) title += node.textContent;
else if (node.matches(equation)) {
// https://github.com/notion-enhancer/repo/issues/39
const $katex = node.querySelector(annotation);
title += $katex.textContent;
} else title += node.innerText;
}
return title;
},
updateHeadings = debounce(() => { updateHeadings = debounce(() => {
$toc.innerHTML = ""; $toc.innerHTML = "";
if (!$page) return; if (!$page) return;
const $frag = document.createDocumentFragment(); const $frag = document.createDocumentFragment();
for (const $heading of getHeadings()) { for (const $heading of getHeadings()) {
const title = $heading.innerText, const $h = html`<${Heading}
indent = getHeadingLevel($heading); indent=${getHeadingLevel($heading)}
if (!title) continue; onclick=${() => {
const $h = html`<${Heading} indent=${indent} onclick=${() => { const $scroller = document.querySelector(scroller);
const $scroller = document.querySelector(scroller); $scroller.scrollTo({ top: $heading.offsetTop - 24, behavior });
$scroller.scrollTo({ top: $heading.offsetTop - 24, behavior }); }}>${getHeadingTitle($heading)}</p>`;
}}>${title}</p>`;
$frag.append($h); $frag.append($h);
} }
$toc.append($frag); $toc.append($frag);
@ -89,4 +105,5 @@ export default async (api, db) => {
const semanticHeadings = '[class$="header-block"] :is(h2, h3, h4)'; const semanticHeadings = '[class$="header-block"] :is(h2, h3, h4)';
addMutationListener(`${page} ${semanticHeadings}`, updateHeadings); addMutationListener(`${page} ${semanticHeadings}`, updateHeadings);
addMutationListener(`${page}, ${scroller}`, updatePage, false); addMutationListener(`${page}, ${scroller}`, updatePage, false);
updatePage();
}; };

6
src/extensions/outliner/mod.json
View File

@ -23,6 +23,12 @@
"key": "smoothScrolling", "key": "smoothScrolling",
"description": "Animates scrolling to a heading smoothly. Disable this to jump to a heading instantly when clicking it in the Outliner's table of contents.", "description": "Animates scrolling to a heading smoothly. Disable this to jump to a heading instantly when clicking it in the Outliner's table of contents.",
"value": true "value": true
},
{
"type": "toggle",
"key": "equationRendering",
"description": "Attempts to render special symbols from inline equations in headings. Note that position- and size-based formatting will be lost when displaying equations in the Outliner's table of contents. Disable this to display the raw TeX equation instead.",
"value": true
} }
], ],
"clientScripts": ["client.mjs"] "clientScripts": ["client.mjs"]