From 9f0499aba4f74028a8080de228733d695b00ceb4 Mon Sep 17 00:00:00 2001
From: rdrew <rdrew@upei.ca>
Date: Mon, 27 Jul 2026 14:16:16 -0300
Subject: [PATCH] mirador modding

---
 js/checkbox.js     |  9 ------
 js/mirador-mods.js | 68 ++++++++++++++++++++++++++++++++--------------
 2 files changed, 48 insertions(+), 29 deletions(-)

diff --git a/js/checkbox.js b/js/checkbox.js
index 739d3fa..2114e28 100755
--- a/js/checkbox.js
+++ b/js/checkbox.js
@@ -13,12 +13,3 @@
   Drupal.theme.checkbox = () =>
     '<input type="checkbox" class="form-checkbox form-boolean form-boolean--type-checkbox"/>';
 })(Drupal);
-
-jQuery( window ).on( "load", function() {
-	console.log( "window loaded" );
-	//jQuery(".mirador80").remove();
-	//jQuery(".mirador104").click();
-//	jQuery('.mirador104 button.MuiButtonBase-root.MuiIconButton-root').trigger('click');
-
-});
-
diff --git a/js/mirador-mods.js b/js/mirador-mods.js
index 4063649..db5f7b4 100755
--- a/js/mirador-mods.js
+++ b/js/mirador-mods.js
@@ -1,25 +1,54 @@
-//This code waits for the viewer to load with the search panel open, then it closes the search 'companion window'
-//leaving the search icon visible. This combo is not available in the configs
-window.addEventListener("load", () => {
-    const tryInit = (attempts = 0) => {
-        const searchPanel = document.querySelector("div.mirador31");
-        const searchPanelToggle = document.querySelector("button.mirador34");
+/**
+ * @file
+ * Custom behavior to swap the sidebar toggle icon for a search icon.
+ */
 
-        if (!searchPanel || !searchPanelToggle) {
-            if (attempts < 20) setTimeout(() => tryInit(attempts + 1), 250);
-            return;
-        }
+(function (Drupal, once) {
+  Drupal.behaviors.customSearchIconSwap = {
+    attach: function (context, settings) {
+      // Use 'once' to ensure we only run this once per element.
+      // We target the specific Material UI icon inside the 'Toggle sidebar' button.
+      const elements = once(
+        "search-icon-swap",
+        'button[aria-label="Toggle sidebar"] svg.MuiSvgIcon-root',
+        context
+      );
 
-        searchPanel.style.display = "none";
-        searchPanel.style.visibility = "hidden";
-        searchPanelToggle.setAttribute("aria-expanded", "false");
-        searchPanelToggle.setAttribute("aria-label", "Expand sidebar");
-        searchPanelToggle.setAttribute("title", "Expand sidebar");
-        searchPanelToggle.click();
-    };
+      elements.forEach(function (svg) {
+        const path = svg.querySelector("path");
+        const searchPathData =
+          "M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z";
 
-    tryInit();
-});
+        if (path) {
+          path.setAttribute("d", searchPathData);
+        }
+      });
+    },
+  };
+})(Drupal, once);
+
+//This code waits for the viewer to load with the search panel open, then it closes the search 'companion window'
+//leaving the search icon visible. This combo is not available in the configs
+// window.addEventListener("load", () => {
+//     const tryInit = (attempts = 0) => {
+//         const searchPanel = document.querySelector("div.mirador31");
+//         const searchPanelToggle = document.querySelector("button.mirador34");
+//
+//         if (!searchPanel || !searchPanelToggle) {
+//             if (attempts < 20) setTimeout(() => tryInit(attempts + 1), 250);
+//             return;
+//         }
+//
+//         searchPanel.style.display = "none";
+//         searchPanel.style.visibility = "hidden";
+//         searchPanelToggle.setAttribute("aria-expanded", "false");
+//         searchPanelToggle.setAttribute("aria-label", "Expand sidebar");
+//         searchPanelToggle.setAttribute("title", "Expand sidebar");
+//         searchPanelToggle.click();
+//     };
+//
+//     tryInit();
+// });
 
 /*
 window.addEventListener("load", (event) => {
@@ -43,4 +72,3 @@ window.addEventListener("load", (event) => {
 	searchPanelToggle.click();
 });
 */
-