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/12/01 16:30:43]

Perhaps this should *just* be a collapse component?

[ire, 2017/12/08 10:42:21]

I think that depends on what we end up extending in the future. We may want to
add more features to the Navbar component, in which case it makes sense to keep
the toggling here. Or we may want other elements to have the toggle feature, in
which case your suggestion would make sense. I think we should change this when
one of these scenarios becomes true. 

+ ******************************************************************************/
+
+document.addEventListener("DOMContentLoaded", function()
+{
+
+  function Navbar(navbar)
+  {
+    this.navbar = navbar;
+
+    this.navbar
+        .querySelector(".toggle-navbar-collapse")
+        .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);