« get me outta code hell

content, client: dynamically show/hide sidebar for search - hsmusic-wiki - HSMusic - static wiki software cataloguing collaborative creation
about summary refs log tree commit diff
path: root/src/content/dependencies
diff options
context:
space:
mode:
author(quasar) nebula <qznebula@protonmail.com>2024-05-30 22:13:42 -0300
committer(quasar) nebula <qznebula@protonmail.com>2024-05-31 12:11:59 -0300
commit2cb70a00041791a2c4a4ead65bd7b0251ced2ad2 (patch)
tree4603c88198196c6e444c0d6e718205d3781d4d28 /src/content/dependencies
parent550da60a1bfabdacd008edb047101347513a187c (diff)
content, client: dynamically show/hide sidebar for search
Diffstat (limited to 'src/content/dependencies')
-rw-r--r--src/content/dependencies/generatePageLayout.js53
1 files changed, 36 insertions, 17 deletions
diff --git a/src/content/dependencies/generatePageLayout.js b/src/content/dependencies/generatePageLayout.js
index e3bfa065..fd5df91d 100644
--- a/src/content/dependencies/generatePageLayout.js
+++ b/src/content/dependencies/generatePageLayout.js
@@ -5,6 +5,7 @@ export default {
   contentDependencies: [
     'generateColorStyleRules',
     'generateFooterLocalizationLinks',
+    'generatePageSidebar',
     'generateSearchSidebarBox',
     'generateStickyHeadingContainer',
     'transformContent',
@@ -44,6 +45,9 @@ export default {
     relations.stickyHeadingContainer =
       relation('generateStickyHeadingContainer');
 
+    relations.sidebar =
+      relation('generatePageSidebar');
+
     if (sprawl.enableSearch) {
       relations.searchBox =
         relation('generateSearchSidebarBox');
@@ -384,28 +388,43 @@ export default {
             slots.navContent),
         ]);
 
-    const getSidebar = (side, id) =>
-      (html.isBlank(slots[side])
-        ? html.blank()
-        : slots[side].slots({
-            attributes:
-              slots[side]
-                .getSlotValue('attributes')
-                .with({id}),
-          }));
+    const getSidebar = (side, id, needed) => {
+      const sidebar =
+        (html.isBlank(slots[side])
+          ? (needed
+              ? relations.sidebar.clone()
+              : html.blank())
+          : slots[side]);
+
+      if (html.isBlank(sidebar) && !needed) {
+        return sidebar;
+      }
+
+      return sidebar.slots({
+        attributes:
+          sidebar
+            .getSlotValue('attributes')
+            .with({id}),
+      });
+    }
+
+    const willShowSearch =
+      slots.showSearch && relations.searchBox;
 
     let showingSidebarLeft;
     let showingSidebarRight;
 
-    const leftSidebar = getSidebar('leftSidebar', 'sidebar-left');
-    const rightSidebar = getSidebar('rightSidebar', 'sidebar-right');
+    const leftSidebar = getSidebar('leftSidebar', 'sidebar-left', willShowSearch);
+    const rightSidebar = getSidebar('rightSidebar', 'sidebar-right', false);
+
+    if (willShowSearch) {
+      if (html.isBlank(leftSidebar)) {
+        leftSidebar.setSlot('initiallyHidden', true);
+        showingSidebarLeft = false;
+      }
 
-    if (
-      slots.showSearch &&
-      relations.searchBox &&
-      !html.isBlank(leftSidebar)
-    ) {
-      leftSidebar.setSlot('boxes',
+      leftSidebar.setSlot(
+        'boxes',
         html.tags([
           relations.searchBox,
           leftSidebar.getSlotValue('boxes'),