From 294925c926a03a933938e61652a507a985a898c4 Mon Sep 17 00:00:00 2001
From: Pagwin <pgp2024@pagwin.xyz>
Date: Thu, 24 Oct 2024 17:58:38 -0400
Subject: [PATCH] fixed issue with all code blocks being set to the same thing

---
 static/js/code_highlighting.mjs        | 28 ++++++++++++++------------
 static/js/code_highlighting_worker.mjs |  8 +++++---
 2 files changed, 20 insertions(+), 16 deletions(-)

diff --git a/static/js/code_highlighting.mjs b/static/js/code_highlighting.mjs
index bf3efde..fad01cb 100644
--- a/static/js/code_highlighting.mjs
+++ b/static/js/code_highlighting.mjs
@@ -3,34 +3,36 @@ async function setup(){
     // start fetching css sooner rather than latter
     const baseCssProm = fetch("https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/default.min.css").then(res=>res.text());
     // TODO: pick light and dark themes and specify their fetch location
-    const lightCssProm = fetch("").then(res=>res.text());
-    const darkCssProm = fetch("").then(res=>res.text());
+    //const lightCssProm = fetch("").then(res=>res.text());
+    //const darkCssProm = fetch("").then(res=>res.text());
 
     const code = document.querySelectorAll("pre.sourceCode code");
     const worker = new Worker('/static/js/code_highlighting_worker.mjs');
     worker.onmessage = (event) => { 
-        for(let c of code){
-            c.innerHTML = event.data; 
-        }
+        const [index, newTxt] = event.data;
+        code[index].innerHTML = newTxt;
+        //for(let c of code){
+        //    c.innerHTML = event.data; 
+        //}
     }
-    for(let c of code){
-        worker.postMessage(c.textContent);
+    for(let i = 0;i<code.length;i++){
+        worker.postMessage([i, code[i].textContent]);
     }
 
     // setting up the css for highlighting with previously fetched css
     const baseStylesheet = new CSSStyleSheet();
-    const lightThemeSheet = new CSSStyleSheet();
-    const darkThemeSheet = new CSSStyleSheet();
+    //const lightThemeSheet = new CSSStyleSheet();
+    //const darkThemeSheet = new CSSStyleSheet();
 
     //shenanigans done to avoid awaiting each promise sequentially
     await Promise.all([
         (async()=>{return await baseStylesheet.replace(await baseCssProm)})(),
-        (async()=>{return await lightThemeSheet.replace(await lightCssProm)})(),
-        (async()=>{return await darkThemeSheet.replace(await darkCssProm)})(),
+        //(async()=>{return await lightThemeSheet.replace(await lightCssProm)})(),
+        //(async()=>{return await darkThemeSheet.replace(await darkCssProm)})(),
     ]);
     document.adoptedStyleSheets.push(baseStylesheet);
-    document.adoptedStyleSheets.push(lightThemeSheet);
-    document.adoptedStyleSheets.push(darkThemeSheet);
+    //document.adoptedStyleSheets.push(lightThemeSheet);
+    //document.adoptedStyleSheets.push(darkThemeSheet);
 
 }
 addEventListener('load', setup);
diff --git a/static/js/code_highlighting_worker.mjs b/static/js/code_highlighting_worker.mjs
index aa4fb6d..d8f35b8 100644
--- a/static/js/code_highlighting_worker.mjs
+++ b/static/js/code_highlighting_worker.mjs
@@ -1,5 +1,7 @@
 onmessage = (event) => {
-  importScripts('https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js');
-  const result = self.hljs.highlightAuto(event.data);
-  postMessage(result.value);
+    importScripts('https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js');
+    
+    const [index, txt] = event.data;
+    const result = self.hljs.highlightAuto(txt);
+    postMessage([index, result.value]);
 };