js tweaks

js/mobile_facets.js

@@ -1,46 +1,42 @@
-(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
-    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 wrapper = document.createElement('div');
-        wrapper.classList.add('facet-wrapper');
-
-        // Move each child into the wrapper
-        children.forEach(child => {
-          wrapper.appendChild(child);
-        });
-
-        // Append the wrapper back to the sidebar
-        sidebar.appendChild(wrapper);
-
-        // Create the button element
-        const button = document.createElement('button');
-        button.id = 'toggle-facets';
-        button.textContent = 'Search the Collection';
-
-        // 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';
-          });
-        }
-      }
-    }
-  });
+(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);// Create the wrapper div
+    const wrapper = document.createElement('div');
+    wrapper.classList.add('facet-wrapper');
+
+    // Move each child into the wrapper
+    children.forEach(child => {
+      wrapper.appendChild(child);
+    });
+
+    // 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';
+      button.textContent = 'Search the Collection';
+
+      // Insert the button before the wrapper
+      sidebar.insertBefore(button, wrapper);
+    }  }
+  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);
+