From 5117609be4c40c6da77605605384f33807461053 Mon Sep 17 00:00:00 2001
From: Helen Chong <119173961+helenclx@users.noreply.github.com>
Date: Sat, 8 Jun 2024 00:36:30 +0800
Subject: [PATCH] Refactor navigation toggle function

---
 src/_includes/global/navbar.njk | 25 ++++++++++++++++---------
 1 file changed, 16 insertions(+), 9 deletions(-)

diff --git a/src/_includes/global/navbar.njk b/src/_includes/global/navbar.njk
index fcaf8630..a000d69c 100644
--- a/src/_includes/global/navbar.njk
+++ b/src/_includes/global/navbar.njk
@@ -91,15 +91,22 @@
 <script defer>
     const navbarToggle = document.querySelector('.navbar__toggle');
     const navbarLinks = document.querySelector(".navbar__links");
+    const navbarLinkItems = document.querySelectorAll(".navbar__links li a");
 
-    navbarToggle.addEventListener('click', () => {
-        const showClass = "navbar__links--show";
-        navbarLinks.classList.toggle(showClass);
+    const openNavigation = () => {
+        navbarLinks.classList.add("navbar__links--show");
+        navbarToggle.ariaExpanded = "true";
+    };
 
-        if (navbarToggle.ariaExpanded === "false") {
-            navbarToggle.ariaExpanded = "true";
-        } else {
-            navbarToggle.ariaExpanded = "false";
-        }
-    });
+    const closeNavigation = () => {
+        navbarLinks.classList.remove("navbar__links--show");
+        navbarToggle.ariaExpanded = "false";
+    };
+
+    const toggleNavigation = () => {
+        const open = navbarToggle.getAttribute("aria-expanded");
+        open === "false" ? openNavigation() : closeNavigation();
+    }
+
+    navbarToggle.addEventListener('click', toggleNavigation);
 </script>
\ No newline at end of file