From 29e1b3be764aaa628fa7c24b734e9612b26b0e99 Mon Sep 17 00:00:00 2001
From: Alexander Bocken <alexander@bocken.org>
Date: Wed, 8 Nov 2023 20:28:13 +0100
Subject: [PATCH] remove scrollers without results on search

---
 src/lib/components/MediaScroller.svelte |  4 ++--
 src/lib/components/Search.svelte        | 21 +++++++++++++++++++--
 2 files changed, 21 insertions(+), 4 deletions(-)

diff --git a/src/lib/components/MediaScroller.svelte b/src/lib/components/MediaScroller.svelte
index 6224960..537fd7d 100644
--- a/src/lib/components/MediaScroller.svelte
+++ b/src/lib/components/MediaScroller.svelte
@@ -11,7 +11,7 @@ export let title
   gap: 2rem;
   padding: 3rem;
 }
-.wrapper{
+.media_scroller_wrapper{
   background-color: var(--nord2);
 }
 h2{
@@ -23,7 +23,7 @@ h2{
 
 
 </style>
-<div class=wrapper>
+<div class=media_scroller_wrapper>
 {#if title}
 	<h2>{title}</h2>
 {/if}
diff --git a/src/lib/components/Search.svelte b/src/lib/components/Search.svelte
index 1a27085..4510dba 100644
--- a/src/lib/components/Search.svelte
+++ b/src/lib/components/Search.svelte
@@ -14,6 +14,8 @@ onMount(() => {
     		const searchTerms = searchText.split(" ");
     		const hasFilter = searchText.length > 0;
 
+		let scrollers_with_results = [];
+		let scrollers = [];
     		// for each recipe hide all but matched
     		recipes.forEach(recipe => {
       			const searchString = `${recipe.textContent} ${recipe.dataset.tags}`.toLowerCase().normalize('NFD').replace(/\p{Diacritic}/gu, "");
@@ -21,7 +23,19 @@ onMount(() => {
 
       			recipe.style.display = (isMatch ? 'flex' : 'none');
       			recipe.classList.toggle("matched-recipe", hasFilter && isMatch);
-    		})
+			if(!scrollers.includes(recipe.parentNode)){
+				scrollers.push(recipe.parentNode)
+			}
+			if(!scrollers_with_results.includes(recipe.parentNode) && isMatch){
+				scrollers_with_results.push(recipe.parentNode)
+			}
+		})
+		scrollers_with_results.forEach( scroller => {
+			scroller.parentNode.style.display= 'block'
+		})
+		scrollers.filter(item => !scrollers_with_results.includes(item)).forEach( scroller => {
+			scroller.parentNode.style.display= 'none'
+		})
 		}
 
 	search.addEventListener("input", () => {
@@ -33,7 +47,10 @@ onMount(() => {
     		recipes.forEach(recipe => {
       			recipe.style.display = 'flex';
       			recipe.classList.remove("matched-recipe");
-    		})
+		})
+		document.querySelectorAll(".media_scroller_wrapper").forEach( scroller => {
+			scroller.style.display= 'block'
+		})
   	})
 
 	let paramString = window.location.href.split('?')[1];