js tweaks

js/mobile_facets.js

@@ -1,17 +1,8 @@
-(function (Drupal) {
-  'use strict'; // Good practice for stricter JS parsing
-
-  document.addEventListener('DOMContentLoaded', function () {
-    // Select the parent container
-    const sidebar = document.querySelector('.region--sidebar');
-
-    // Check if the element exists
+(function (Drupal) {  // Select the parent container
+  const sidebar = document.querySelector('.region--sidebar');  // Check if the element exists
   if (sidebar) {
     // Get all direct children
-      const children = Array.from(sidebar.children);
-
-      if (children.length > 0) { // Optional: Skip if no children
-        // Create the wrapper div
+    const children = Array.from(sidebar.children);// Create the wrapper div
     const wrapper = document.createElement('div');
     wrapper.classList.add('facet-wrapper');
 
@@ -20,9 +11,14 @@
       wrapper.appendChild(child);
     });
 
-        // Append the wrapper back to the sidebar
-        sidebar.appendChild(wrapper);
-
+    // Append the wrapper back to the sidebar (replacing the original children)
+    sidebar.appendChild(wrapper);  }
+  // Select the parent container
+  //const sidebar = document.querySelector('.region--sidebar');  // Check if the element exists
+  if (sidebar) {
+    // Select the existing wrapper
+    const wrapper = sidebar.querySelector('.facet-wrapper');// Check if the wrapper exists
+    if (wrapper) {
       // Create the button element
       const button = document.createElement('button');
       button.id = 'toggle-facets';
@@ -30,17 +26,17 @@
 
       // Insert the button before the wrapper
       sidebar.insertBefore(button, wrapper);
-
-        // Wire up the toggle (now after elements exist)
-        const toggleButton = document.getElementById('toggle-facets');
-        if (toggleButton) { // Extra safety, though it should exist
-          toggleButton.addEventListener('click', function () {
-            const computedStyle = window.getComputedStyle(facetWrapper);
-            const isHidden = computedStyle.display === 'none';
-            facetWrapper.style.display = isHidden ? 'block' : 'none';
-          });
-        }
-      }
-    }
+    }  }
+  document.addEventListener("DOMContentLoaded", function () {
+    const toggleButton = document.getElementById("toggle-facets");
+    const facetWrapper = document.querySelector(
+      ".region--sidebar .facet-wrapper"
+    );if (toggleButton && facetWrapper) {
+      toggleButton.addEventListener("click", function () {
+        const isHidden =
+          facetWrapper.style.display === "none" || !facetWrapper.style.display; // Accounts for CSS default
+        facetWrapper.style.display = isHidden ? "block" : "none";
       });
+    }  });
 })(Drupal);
+