Issue 5635 - Implement website-default navbar component

static/js/navbar.js

Index: static/js/navbar.js
===================================================================
new file mode 100644
--- /dev/null
+++ b/static/js/navbar.js
@@ -0,0 +1,33 @@
+/*******************************************************************************
+ * Navbar Component

[juliandoucette, 2017/11/06 12:36:43]

BUG: You can't collapse the navbar if you expanded it while the window was
resized down and then resized back up.

[ire, 2017/11/08 17:14:46]

I can't seem to reproduce this. If the navbar is opened and you resize the
window up, it shows as normal. Could you give me some more information?

[juliandoucette, 2017/11/09 14:34:51]

Just re-tested. This only applied to the table layout. Sorry for the confusion.

+ ******************************************************************************/
+
+document.addEventListener("DOMContentLoaded", function()
+{
+
+  function Navbar(navbar)
+  {
+    this.navbar = navbar;
+
+    this.navbar
+        .querySelector(".toggle-navbar-collapse button")
+        .addEventListener("click", this._onClick.bind(this), false);
+  }
+
+  Navbar.prototype.toggleCollapse = function()
+  {
+    this.navbar.classList.toggle("expanded");
+  };
+
+  Navbar.prototype._onClick = function()
+  {
+    this.toggleCollapse();
+  };
+
+  var navbars = document.getElementsByClassName("navbar");
+  for (var i = 0; i < navbars.length; i++)
+  {
+    new Navbar(navbars[i]);
+  }
+
+}, false);