introduce functional textzeugen-selector

DHBern · Jun 11, 2024 · 3267d60 · 3267d60
1 parent 7b151e9
commit 3267d60
Show file tree

Hide file tree

Showing 4 changed files with 23 additions and 24 deletions.
diff --git a/src/lib/components/TextzeugenSelector.svelte 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
@@ -1,12 +1,18 @@
 <script>
 	import VerseSelector from '$lib/components/VerseSelector.svelte';
+	import TextzeugenSelector from '$lib/components/TextzeugenSelector.svelte';
 	import Devilstable from './Devilstable.svelte';
 
 	/** @type {import('./$types').PageData} */
 	export let data;
 	$: ({ 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
@@ -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
@@ -148,8 +148,6 @@
 			</section>
 		</section>
 	{/each}
-{:else}
-	<p>Keine Textzeugen ausgewählt</p>
 {/if}
 
 <style>