Issue 5385 - Create Site Header Component for Help Center

static/js/main.js

 (function(){
   document.addEventListener("DOMContentLoaded", function()
   {
-    document.getElementById('toggle-searchform').addEventListener('click', function(e) {
-      e.preventDefault();
-      document.getElementById('site-search').classList.toggle('open');

[juliandoucette, 2017/07/14 14:11:29]

I don't remember if we agreed upon browser requirements for this website
already, but one might argue that we should support the same browsers as ABP if
we are developing a help center for ABP.

- https://adblockplus.org/requirements
- http://caniuse.com/#search=classList

Let's have a talk with Ollie about the future of IE8 support before we do
anything too crazy though :D

[ire, 2017/07/17 09:25:54]

It was my impression the support was ie 9 and up as is in the browserlist. Sure
let's chat with Ollie to decide.

-    }, false);
+
+    // Change html class name from "no-js" to "js"
+    document.documentElement.className = "js";
+
+    // Toggle Navbar Collapse
+    function toggleNavbarCollapse()
+    {
+      var navbarCollapseEls = this.parentElement.getElementsByClassName("navbar-collapse");
+      for (var i = 0; i < navbarCollapseEls.length; i++)
+      {
+        navbarCollapseEls[i]
+          .classList.toggle("open")
+      }
+    }
+
+    var toggleNavbarCollapseEls = document.getElementsByClassName("toggle-navbar-collapse");
+    for (var i = 0; i < toggleNavbarCollapseEls.length; i++)
+    {
+      toggleNavbarCollapseEls[i]
+        .addEventListener("click", toggleNavbarCollapse, false);
+    }
+
   }, false);
 }());