make navBar(header) presist active depending on which page user's on

4 files changed, 47 insertions, 42 deletions

diff --git a/src/js/includeheader.js b/src/js/includeheader.js
new file mode 100644
index 00000000..5ac7d067
--- /dev/null
+++ b/src/js/includeheader.js
@@ -0,0 +1,47 @@
+function includeHeader() {
+  var z, i, elmnt, file, xhttp;
+  // loop through a collection of all HTML elements
+  z = document.getElementsByTagName("*");
+  for (i = 0; i < z.length; i++) {
+    elmnt = z[i];
+    // search for elements with a certain attribute
+    file = elmnt.getAttribute("include-header");
+    if (file) {
+      // make an HTTP request using the attribute value as the file name
+      xhttp = new XMLHttpRequest();
+      xhttp.onreadystatechange = function() {
+        if (this.readyState == 4) {
+          if (this.status == 200) {
+            elmnt.innerHTML = this.responseText;
+            setActiveLink(); // Set the active link after including the HTML
+          }
+          if (this.status == 404) {
+            elmnt.innerHTML = "Page not found.";
+          }
+          // remove the attribute and call this function once more
+          elmnt.removeAttribute("include-header");
+          includeHeader();
+        }
+      };
+      xhttp.open("GET", file, true);
+      xhttp.send();
+      // exit the function
+      return;
+    }
+  }
+}
+
+// Set the active link based on the current page
+function setActiveLink() {
+  var currentPath = window.location.pathname;
+  var navLinks = document.getElementsByClassName("navBar")[0].getElementsByTagName("a");
+  for (var i = 0; i < navLinks.length; i++) {
+    var link = navLinks[i];
+    var href = link.getAttribute("href");
+    if (href === currentPath) {
+      link.classList.add("active");
+    } else {
+      link.classList.remove("active");
+    }
+  }
+}
diff --git a/src/js/includehtml.js b/src/js/includehtml.js
deleted file mode 100644
index 7b00285f..00000000
--- a/src/js/includehtml.js
+++ /dev/null
@@ -1,28 +0,0 @@
-function includeHTML() {
-  var z, i, elmnt, file, xhttp;
-  /*loop through a collection of all HTML elements:*/
-  z = document.getElementsByTagName("*");
-  for (i = 0; i < z.length; i++) {
-    elmnt = z[i];
-    /*search for elements with a certain atrribute:*/
-    file = elmnt.getAttribute("include-html");
-    if (file) {
-      /*make an HTTP request using the attribute value as the file name:*/
-      xhttp = new XMLHttpRequest();
-      xhttp.onreadystatechange = function() {
-        if (this.readyState == 4) {
-          if (this.status == 200) {elmnt.innerHTML = this.responseText;}
-          if (this.status == 404) {elmnt.innerHTML = "Page not found.";}
-          /*remove the attribute, and call this function once more:*/
-          elmnt.removeAttribute("include-html");
-          includeHTML();
-        }
-      }      
-      xhttp.open("GET", file, true);
-      xhttp.send();
-      /*exit the function:*/
-      return;
-    }
-  }
-};
-
diff --git a/src/js/login.js b/src/js/login.js
deleted file mode 100644
index ce4c0803..00000000
--- a/src/js/login.js
+++ /dev/null
@@ -1,4 +0,0 @@
-function test() {
-    console.log(document.getElementById("username").value);
-    console.log(document.getElementById("password").value);
-}
\ No newline at end of file
diff --git a/src/js/register.js b/src/js/register.js
deleted file mode 100644
index 11f85852..00000000
--- a/src/js/register.js
+++ /dev/null
@@ -1,10 +0,0 @@
-function createAccount() {
-    if (document.getElementById("password").value == document.getElementById("verify-password").value) {
-        let username = document.getElementById("username").value;
-        let password = document.getElementById("password").value;
-        console.log(username);
-        console.log(password);
-    } else {
-        console.log("password does not match");
-    }
-}