initial commit

public/csspageweaver/plugins/inlineNotes/inlineNotes.js

@@ -0,0 +1,140 @@
+/**
+ * @name Inline Notes
+ * @author Julien Bidoret
+ * @author Julie Blanc <contact@julie-blanc.fr>
+ * @see { @link https://gitlab.com/csspageweaver/plugins/inlineNotes }
+ */
+
+import { Handler } from '/csspageweaver/lib/paged.esm.js';
+
+export default class inlineNotes extends Handler {
+
+  constructor(chunker, polisher, caller) {
+    super(chunker, polisher, caller);
+    this.input = cssPageWeaver.features.inlineNotes.parameters?.input || ".footnote-ref"; // ← CSS selector of the call element 
+    this.containerNotes = cssPageWeaver.features.inlineNotes.parameters?.containerNotes || "#footnotes"; // ← CSS selector of the container of the footnote
+    this.newClass = cssPageWeaver.features.inlineNotes.parameters?.newClass || "inline-note"; // ← Class of the span create for the note
+  }
+
+  beforeParsed(content) {
+
+   // ---- HUGO SPECIFIC // Correction des ids et href 'fn:' en 'fn-' ----
+   // 1. Tous les éléments avec un id commençant par "fn:"
+   content.querySelectorAll('[id^="fn:"]').forEach(el => {
+      el.id = el.id.replace(/:/g, '-');
+   });
+
+   // 2. Tous les éléments avec un id commençant par "fnref:"
+   content.querySelectorAll('[id^="fnref:"]').forEach(el => {
+      el.id = el.id.replace(/:/g, '-');
+   });
+
+   // 3. Tous les éléments avec un href commençant par "#fn:"
+   content.querySelectorAll('[href^="#fn:"]').forEach(el => {
+      el.href = el.href.replace(/:/g, '-');
+   });
+
+   // 4. Tous les éléments avec un href commençant par "#fnref:"
+   content.querySelectorAll('[href^="#fnref:"]').forEach(el => {
+      el.href = el.href.replace(/:/g, '-');
+   });
+
+   // 5. (optionnel) Tous les 'for' dans labels, si jamais (pas typique)
+   content.querySelectorAll('[for^="fn:"]').forEach(el => {
+      el.htmlFor = el.htmlFor.replace(/:/g, '-');
+   });
+
+
+
+    inlineNotesHandler({
+        content: content,
+        input: this.input,
+        containerNotes: this.containerNotes,
+        type: this.newClass
+    });
+
+  }
+}
+
+
+
+function inlineNotesHandler(params){
+
+  let content = params.content;
+  let input = params.input;
+  let type = params.type;
+  let container = params.containerNotes;
+  
+  createNotes(content, input, type, container);
+
+   // let noteContainer = content.querySelector(params.containerNotes);
+   // if(noteContainer){
+   //    noteContainer.remove();
+   // }
+
+}
+
+
+function getBlocks(element){
+   return element.querySelectorAll('div,p,blockquote,section,article,h1,h2,h3,h4,h5,h6,figure');
+}
+
+// get only inline-level tags
+function unwrapBlockChildren(element) {
+   let blocks = getBlocks(element);
+   
+   blocks.forEach(block => {
+       block.insertAdjacentHTML("beforebegin", block.innerHTML);
+       block.remove();
+   });
+   let remainingblocks = getBlocks(element);
+   if(remainingblocks.length) unwrapBlockChildren(element);
+   return element;
+}
+
+
+function createNotes(content, input, type, container){
+
+   let containers = content.querySelectorAll(container);
+
+   containers.forEach(function (container, index) {
+      let section = container.parentNode;
+   
+      let calls = section.querySelectorAll(input);
+      calls.forEach( (call, index) => {
+    
+         let href = call.getAttribute('href');
+         let hashIndex = href.indexOf('#');
+         let selector = href.slice(hashIndex);
+
+         let note = section.querySelector(selector);
+         if (!note) {
+            console.warn('Note non trouvée pour', selector);
+            return;
+         }
+
+         let back = note.querySelector(".footnote-back");
+         if(back){
+            back.remove();
+         }
+
+
+         
+         let inline_note = document.createElement('span');
+         inline_note.className = type;
+         let num = index + 1;
+         inline_note.dataset.counterNote = num;
+         inline_note.dataset.chapter = section.id;
+
+         inline_note.innerHTML = unwrapBlockChildren(note).innerHTML;
+         call.after(inline_note);
+         
+         call.parentElement.removeChild(call);
+
+
+      })
+
+      container.remove();
+   });
+
+}