Render js for discourse into a separate file to be loaded by the forum

vvvv · Jan 29, 2025 · 0938326 · 0938326
1 parent fd6f4d3
commit 0938326
Show file tree

Hide file tree

Showing 4 changed files with 34 additions and 4 deletions.
diff --git a/assets/js/discourse-header.js b/assets/js/discourse-header.js
@@ -0,0 +1,26 @@
+window.addEventListener ("load",() => {
+    const navbar = document.getElementById("vvvv-navbar")
+    const hamburgerButton = document.getElementById("vvvv-hamburgerButton")
+    const menu = document.getElementById("vvvv-menu")
+
+    hamburgerButton.addEventListener("click", ()=>{
+        menu.classList.toggle("visible")
+    })
+
+    setHeaderVar();
+
+    window.onscroll = function() {
+        setHeaderVar();
+
+        if (menu.classList.contains ("visible"))
+        {
+          menu.classList.remove ("visible")
+        }
+    }
+
+    function setHeaderVar()
+    {          
+        const headerBottom = Math.max(navbar.getBoundingClientRect().bottom, 0);
+        document.documentElement.style.setProperty("--header-bottom", `${headerBottom}px`);
+    }
+}, true)
diff --git a/assets/js/header.js b/assets/js/header.js
@@ -1,8 +1,8 @@
-window.onload = function() {
+window.addEventListener ("load", ()=> {
   const hamburgerButton = document.getElementById("vvvv-hamburgerButton")
   const menu = document.getElementById("vvvv-menu")
 
   hamburgerButton.addEventListener("click", ()=>{
     menu.classList.toggle("visible")
   })
-};
+}, true);
diff --git a/layouts/headers/headers.html b/layouts/headers/headers.html
@@ -7,6 +7,8 @@
         <link rel="stylesheet" href="{{ $CSS.RelPermalink | absLangURL }}" type="text/css">
         {{- $JS := resources.Get "js/header.js" | js.Build | minify }}
         <script type="text/javascript" src="{{ $JS.RelPermalink | absLangURL }}"></script>
+        {{- $DiscourseJS := resources.Get "js/discourse-header.js" | js.Build | minify }}
+        <script type="text/javascript" src="{{ $DiscourseJS.RelPermalink | absLangURL }}"></script>
    </head>
 <body> 
     {{ "<!-- COPY FOR FORUM-->" | safeHTML }}

diff --git a/layouts/partials/js.html b/layouts/partials/js.html
@@ -8,8 +8,10 @@
 
 
 {{ "<!-- Custom Theme JavaScript -->" | safeHTML }}
-{{- $jsfiles := resources.Match "js/*" -}}
-{{- $jsfiles := $jsfiles | resources.Concat "js/vvvv.js" | js.Build | minify -}}
+{{- $creativejs := resources.Get "js/creative.js" -}}
+{{- $downloadjs := resources.Get "js/download.js" -}}
+{{- $headerjs := resources.Get "js/header.js" -}}
+{{- $jsfiles := slice $creativejs $downloadjs $headerjs | resources.Concat "js/vvvv.js" | js.Build | minify -}}
 <script type="text/javascript" src="{{ $jsfiles.RelPermalink | relURL }}" defer></script>
 
 {{ "<!-- DSGVO Video Blocker -->" | safeHTML }}