From af80391cd352d23a96b0941bb358fc3288bc987d Mon Sep 17 00:00:00 2001
From: Afiq Hamzah <afiq.hamzah@pkb.net.my>
Date: Sun, 28 Apr 2024 09:15:49 +0800
Subject: [PATCH] Add automatically close menu whenever theres is a click or
 scroll event whenever app is in mobile resolution

---
 resources/assets/js/app.js                  |  1 +
 resources/assets/js/helper/autocloseMenu.js | 19 +++++++++++++++++++
 2 files changed, 20 insertions(+)
 create mode 100644 resources/assets/js/helper/autocloseMenu.js

diff --git a/resources/assets/js/app.js b/resources/assets/js/app.js
index 9f3fe8b..50ebfbc 100644
--- a/resources/assets/js/app.js
+++ b/resources/assets/js/app.js
@@ -1,4 +1,5 @@
 require('./bootstrap.js');
+require('./helper/autocloseMenu.js');
 //window.VueRouter = require('vue-router').default;
 //import VueRouter from 'vue-router';
 import Util from './util.js';
diff --git a/resources/assets/js/helper/autocloseMenu.js b/resources/assets/js/helper/autocloseMenu.js
new file mode 100644
index 0000000..dd8b431
--- /dev/null
+++ b/resources/assets/js/helper/autocloseMenu.js
@@ -0,0 +1,19 @@
+
+if (window.innerWidth <= 768) {
+    window.addEventListener('click', function (event) {
+        const navbarCollapse = document.getElementById('myNavbar');
+
+        if (!event.target.matches('.navbar-toggler')) {
+            navbarCollapse.classList.remove('in');
+        }
+
+    });
+
+    // Close navbar when scrolling
+    window.addEventListener('scroll', function () {
+        const navbarCollapse = document.getElementById('myNavbar');
+
+        navbarCollapse.classList.remove('in');
+
+    });
+}