From 3267d6074019679dc9afc99e38de9da8855fee50 Mon Sep 17 00:00:00 2001
From: Sebi <sebastian@flick.solutions>
Date: Tue, 11 Jun 2024 15:19:12 +0200
Subject: [PATCH] introduce functional textzeugen-selector

---
 src/lib/components/TextzeugenSelector.svelte  | 14 +++++++++
 src/routes/+page.svelte                       | 29 ++++++-------------
 .../[[sigla]]/[[thirties]]/[[verse]]/+page.js |  2 --
 .../[[thirties]]/[[verse]]/+page.svelte       |  2 --
 4 files changed, 23 insertions(+), 24 deletions(-)
 create mode 100644 src/lib/components/TextzeugenSelector.svelte

diff --git a/src/lib/components/TextzeugenSelector.svelte b/src/lib/components/TextzeugenSelector.svelte
new file mode 100644
index 0000000..9f8079f
--- /dev/null
+++ b/src/lib/components/TextzeugenSelector.svelte
@@ -0,0 +1,14 @@
+<script>
+	import { codices, fragments } from '$lib/sigla.json';
+
+	export let value = '';
+</script>
+
+<label>
+	Textzeugen: <select class="select my-2" bind:value>
+		<option value="">Textzeuge 1</option>
+		{#each [...codices, ...fragments] as { sigil, handle }}
+			<option value={handle}>{sigil}</option>
+		{/each}
+	</select>
+</label>
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 9b8ef51..d4b8ac6 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -1,5 +1,6 @@
 <script>
 	import VerseSelector from '$lib/components/VerseSelector.svelte';
+	import TextzeugenSelector from '$lib/components/TextzeugenSelector.svelte';
 	import Devilstable from './Devilstable.svelte';
 
 	/** @type {import('./$types').PageData} */
@@ -7,6 +8,11 @@
 	$: ({ tableData } = data);
 	let tableWidth = 0;
 	let tableHeight = 0;
+
+	/**
+	 * @type { String[] }
+	 */
+	let selectedSigla = ['', ''];
 </script>
 
 <div class="container mx-auto grid grid-cols-[repeat(auto-fit,minmax(366px,1fr))] gap-6">
@@ -57,30 +63,13 @@
 			Handschriften V oder V') oder das Kürzel "Ep" (für den Epilog in den Handschriften V und V'),
 			danach die Zahl des Verses.
 		</p>
-
 		<div>
 			<div class="flex gap-1 my-3">
-				<label>
-					Textzeugen: <select class="select my-2">
-						<option value="1">Textzeuge 1</option>
-						<option value="2">G</option>
-						<option value="3">D</option>
-						<option value="4">m</option>
-						<option value="5">Fr</option>
-					</select>
-				</label>
-				<label>
-					Textzeugen: <select class="select my-2">
-						<option value="1">Textzeuge 1</option>
-						<option value="2">G</option>
-						<option value="3">D</option>
-						<option value="4">m</option>
-						<option value="5">Fr</option>
-					</select>
-				</label>
+				<TextzeugenSelector bind:value={selectedSigla[0]} />
+				<TextzeugenSelector bind:value={selectedSigla[1]} />
 			</div>
 			<div class="flex max-w-full items-baseline gap-1 my-3">
-				<VerseSelector targetPath="/textzeugen" />
+				<VerseSelector targetPath={`/textzeugen/${selectedSigla.join('-')}`} />
 			</div>
 		</div>
 	</section>
diff --git a/src/routes/textzeugen/[[sigla]]/[[thirties]]/[[verse]]/+page.js b/src/routes/textzeugen/[[sigla]]/[[thirties]]/[[verse]]/+page.js
index ed90367..cd0d3c8 100644
--- a/src/routes/textzeugen/[[sigla]]/[[thirties]]/[[verse]]/+page.js
+++ b/src/routes/textzeugen/[[sigla]]/[[thirties]]/[[verse]]/+page.js
@@ -1,5 +1,3 @@
-import { base } from '$app/paths';
-import { generateEntries } from '$lib/functions';
 import { api } from '$lib/constants';
 
 /** @type {import('./$types').PageLoad} */
diff --git a/src/routes/textzeugen/[[sigla]]/[[thirties]]/[[verse]]/+page.svelte b/src/routes/textzeugen/[[sigla]]/[[thirties]]/[[verse]]/+page.svelte
index 7b7fe16..1f1d885 100644
--- a/src/routes/textzeugen/[[sigla]]/[[thirties]]/[[verse]]/+page.svelte
+++ b/src/routes/textzeugen/[[sigla]]/[[thirties]]/[[verse]]/+page.svelte
@@ -148,8 +148,6 @@
 			</section>
 		</section>
 	{/each}
-{:else}
-	<p>Keine Textzeugen ausgewählt</p>
 {/if}
 
 <style>