39 lines
1.7 KiB
JavaScript
39 lines
1.7 KiB
JavaScript
// setup web worker to avoid causing issues for the rendering thread
|
|
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 code = document.querySelectorAll("pre.sourceCode code");
|
|
const worker = new Worker('/static/js/code_highlighting_worker.mjs');
|
|
worker.onmessage = (event) => {
|
|
const [index, newTxt] = event.data;
|
|
code[index].innerHTML = newTxt;
|
|
//for(let c of code){
|
|
// c.innerHTML = event.data;
|
|
//}
|
|
}
|
|
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();
|
|
|
|
//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)})(),
|
|
]);
|
|
document.adoptedStyleSheets.push(baseStylesheet);
|
|
//document.adoptedStyleSheets.push(lightThemeSheet);
|
|
//document.adoptedStyleSheets.push(darkThemeSheet);
|
|
|
|
}
|
|
addEventListener('load', setup);
|
|
if(document.readyState == "complete") await setup();
|