Footnote handling, package updates

Author: localhost433

notes/courses/LING-UA-1/index.json

@@ -1,22 +1,22 @@
 [
     {
         "slug": "01-intro",
-        "title": "What is Language",
+        "title": "01    - What is Language",
         "date": "2025-05-19"
     },
     {
         "slug": "02-03-phonetics",
-        "title": "Phonetics",
+        "title": "02/03 - Phonetics",
         "date": "2025-05-20/21"
     },
     {
         "slug": "04-05-phonology",
-        "title": "Phonology",
+        "title": "04/05 - Phonology",
         "date": "2025-05-22/27"
     },
     {
         "slug": "06-07-morphology",
-        "title": "Morphology",
+        "title": "06/07 - Morphology",
         "date": "2025-05-28/29"
     }
 ]

notes/js/note.js

@@ -49,6 +49,21 @@ fetch(`/notes/courses/${course}/${noteSlug}.md`)
         const { meta, body } = parseFrontMatter(md);
         document.title = meta.title || noteSlug;
 
+        const footnotes = [];
+
+        const bodyWithoutDefs = body.replace(
+            /^\s*\[([^\]]+)\]:\s*(.+)$/gm,
+            (_, num, text) => {
+                footnotes.push({ num, text: text.trim() });
+                return '';
+            }
+        )
+
+        const bodyWithRefs = bodyWithoutDefs.replace(
+            /\[\^(d+)\]/g,
+            (_, num) => `<sup id="fnref${num}"><a href="#fn${num}">${num}</a></sup>`
+        );
+
         const back = document.getElementById("back-to-course");
         back.href = `course.html?id=${encodeURIComponent(course)}`;
 
@@ -59,7 +74,7 @@ fetch(`/notes/courses/${course}/${noteSlug}.md`)
         headingData.length = 0;
         for (let k in slugCounts) delete slugCounts[k];
 
-        const dirty = marked.parse(body);
+        const dirty = marked.parse(bodyWithRefs);
         const sanitize = window.DOMPurify?.sanitize || (s => s);
         const contentDiv = document.createElement("div");
         contentDiv.innerHTML = sanitize(dirty);
@@ -108,6 +123,24 @@ fetch(`/notes/courses/${course}/${noteSlug}.md`)
             container.insertBefore(tocNav, contentDiv);
         }
 
+        if (footnotes.length) {
+            const fnSec = document.createElement("section");
+            fnSec.className = "footnotes";
+            const hr = document.createElement("hr");
+            fnSec.appendChild(hr);
+
+            const ol = document.createElement("ol");
+            footnotes.forEach(({ num, text }) => {
+                const li = document.createElement("li");
+                li.id = `fn${num}`;
+                const fnHtml = sanitize(marked.parseInline(text));
+                li.innerHTML = fnHtml;
+                ol.appendChild(li);
+            });
+            fnSec.appendChild(ol);
+            container.appendChild(fnSec);
+        }
+
         contentDiv.querySelectorAll('table').forEach(table => {
             const wrapper = document.createElement('div');
             wrapper.className = 'table-wrapper';