Init

1 files changed, 51 insertions, 0 deletions

diff --git a/themes/pehtheme/assets/js/insertoggle.js b/themes/pehtheme/assets/js/insertoggle.js
new file mode 100644
index 0000000..7cbaf4b
--- /dev/null
+++ b/themes/pehtheme/assets/js/insertoggle.js
@@ -0,0 +1,51 @@
+// TOGGLE BUTTON
+(function () {
+	// Get all elements with the "toggle-button" class
+    const toggleButtons = document.querySelectorAll(".toggle-button");
+
+    // Function to hide all elements except the target
+    function hideAllExcept(targetElement) {
+        document.querySelectorAll(".hidden").forEach((element) => {
+            if (element !== targetElement) {
+                element.classList.add("close"); // Hide the element
+                element.classList.remove("open"); // Close previously open elements
+            }
+        });
+    }
+
+    // Function to toggle the state of an element (open/close)
+    function toggleElement(targetElement) {
+        const isHidden = targetElement.classList.contains("close");
+        hideAllExcept(targetElement);
+        targetElement.classList.toggle("close", !isHidden);
+        targetElement.classList.toggle("open", isHidden);
+    }
+
+    toggleButtons.forEach((button) => {
+        button.addEventListener("click", function () {
+            const targetIds = this.getAttribute("data-target").split(" ");
+            targetIds.forEach((targetId) => {
+                const targetElement = document.getElementById(targetId);
+                if (targetElement) {
+                    toggleElement(targetElement);
+                }
+            });
+        });
+    });
+
+    // Add event listener to the document to close elements when a click occurs outside of open elements
+    document.addEventListener("click", function (event) {
+        const targetElements = Array.from(document.querySelectorAll(".open"));
+        const clickedOutsideAllTargets = targetElements.every((element) => {
+            return !element.contains(event.target) && !event.target.closest(".toggle-button");
+        });
+
+        if (clickedOutsideAllTargets) {
+            targetElements.forEach((element) => {
+                element.classList.remove("open"); // Close open elements
+                element.classList.add("close"); // Hide elements
+            });
+        }
+    });
+
+})();