Add logic to load MetroJS for examples that do not do so themselves.

poef · Aug 23, 2024 · dfc21ff · dfc21ff
1 parent 62e1cd0
commit dfc21ff
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 4 deletions.
diff --git a/docs/examples/example-helper.css b/docs/examples/example-helper.css
@@ -21,7 +21,7 @@ main script::before {
   content: '<script>';
 }
 
-main script[src]::before {
+main script[src]:not([data-js="loaded"])::before {
   content: '<script src="' attr(src) '">';
 }
 

diff --git a/docs/examples/example-helper.js b/docs/examples/example-helper.js
@@ -1,13 +1,22 @@
-function addElements(container, elements) {
+function addElements(container, elements, metroLoaded = false) {
+  if (metroLoaded === false && elements.length === 1 && elements[0].tagName === 'SCRIPT' && ! elements[0].src) {
+    metroLoaded = true
+    const script = document.createElement('script')
+    script.src = 'https://cdn.jsdelivr.net/npm/@muze-nl/metro/dist/everything.js'
+    script.setAttribute('data-js', 'loaded')
+    elements.unshift(script)
+
+  }
+
   const currentElement = elements.shift()
 
   if (currentElement !== undefined) {
     container.appendChild(currentElement)
 
     if (currentElement.tagName === 'SCRIPT' && currentElement.src) {
-      currentElement.addEventListener('load', () => addElements(container, elements))
+      currentElement.addEventListener('load', () => addElements(container, elements, metroLoaded))
     } else {
-      addElements(container, elements)
+      addElements(container, elements, metroLoaded)
     }
   }
 }
@@ -18,6 +27,12 @@ function createHTML(text) {
 
   const fragment = range.createContextualFragment(text)
 
+  fragment.childNodes.forEach(element => {
+    if (element.nodeType === 3 && element.textContent.trim() === '') {
+      element.remove()
+    }
+  })
+
   fragment.childNodes.forEach(element => {
     console.info('element', element.nodeName, element)
     elements.push(element)