FIX: better loading time of /reihen

2026-02-04 10:35:30 +00:00 · 2026-01-24 16:59:19 +01:00
parent 9e49aeb3d1
commit 5d75934c37
12 changed files with 272 additions and 188 deletions
--- a/views/routes/components/_reihe.gohtml
+++ b/views/routes/components/_reihe.gohtml
@@ -33,7 +33,7 @@
 				<i class="ri-links-line"></i> Link
 			</a>
 			{{- if (IsAdminOrEditor $request.user) -}}
-			<a href="/reihe/{{ $r.MusenalmID }}/edit/" class="no-underline rounded bg-stone-100 px-1.5">
+			<a href="/reihe/{{ $r.MusenalmID }}/edit" class="no-underline rounded bg-stone-100 px-1.5">
 				<i class="ri-edit-line"></i>
 				Bearbeiten
 			</a>
--- a/views/routes/ort/edit/body.gohtml
+++ b/views/routes/ort/edit/body.gohtml
@@ -29,7 +29,6 @@
 							<i class="ri-eye-line"></i> Orte
 						</a>
 					</div>
-					&middot;
 				</div>
 			{{- end -}}
 		</div>
@@ -45,7 +44,7 @@
 							<tool-tip position="top" class="!inline">
 								<div class="data-tip">{{ $model.result.Prev.Name }}</div>
 								<a
-									href="/ort/{{ $model.result.Prev.Id }}/edit/"
+									href="/ort/{{ $model.result.Prev.Id }}/edit"
 									class="text-gray-700 hover:text-slate-950 no-underline">
 									<i class="ri-arrow-left-s-line"></i>
 								</a>
@@ -62,7 +61,7 @@
 							<tool-tip position="top" class="!inline">
 								<div class="data-tip">{{ $model.result.Next.Name }}</div>
 								<a
-									href="/ort/{{ $model.result.Next.Id }}/edit/"
+									href="/ort/{{ $model.result.Next.Id }}/edit"
 									class="text-gray-700 hover:text-slate-950 no-underline">
 									<i class="ri-arrow-right-s-line"></i>
 								</a>
--- a/views/routes/orte/body.gohtml
+++ b/views/routes/orte/body.gohtml
@@ -32,7 +32,7 @@
 								</div>
 							{{- end -}}
 							{{- if (IsAdminOrEditor $model.request.user) -}}
-								<a href="/ort/{{ $place.Id }}/edit/" class="text-sm font-bold text-gray-700 hover:text-slate-950 no-underline">
+								<a href="/ort/{{ $place.Id }}/edit" class="text-sm font-bold text-gray-700 hover:text-slate-950 no-underline">
 									<i class="ri-edit-line"></i> Bearbeiten
 								</a>
 							{{- end -}}
--- a/views/routes/person/edit/body.gohtml
+++ b/views/routes/person/edit/body.gohtml
@@ -25,7 +25,6 @@
 							<i class="ri-eye-line"></i> Anschauen
 						</a>
 					</div>
-					&middot;
 				</div>
 			{{- end -}}
 		</div>
--- a/views/routes/reihe/body.gohtml
+++ b/views/routes/reihe/body.gohtml
@@ -48,7 +48,7 @@
 		<div class="font-sans">
 			&middot;&nbsp;
 			<i class="ri-edit-line"></i>
-			<a href="/reihe/{{ $r.MusenalmID }}/edit/">Bearbeiten</a>
+			<a href="/reihe/{{ $r.MusenalmID }}/edit">Bearbeiten</a>
 		</div>
 	{{- end -}}
 	</div>
--- a/views/routes/reihe/edit/body.gohtml
+++ b/views/routes/reihe/edit/body.gohtml
@@ -25,7 +25,6 @@
 							<i class="ri-eye-line"></i> Anschauen
 						</a>
 					</div>
-					&middot;
 				</div>
 			{{- end -}}
 		</div>
@@ -41,7 +40,7 @@
 							<tool-tip position="top" class="!inline">
 								<div class="data-tip">{{ $model.result.Prev.Title }}</div>
 								<a
-									href="/reihe/{{ $model.result.Prev.MusenalmID }}/edit/"
+									href="/reihe/{{ $model.result.Prev.MusenalmID }}/edit"
 									class="text-gray-700 hover:text-slate-950 no-underline">
 									<i class="ri-arrow-left-s-line"></i>
 								</a>
@@ -58,7 +57,7 @@
 							<tool-tip position="top" class="!inline">
 								<div class="data-tip">{{ $model.result.Next.Title }}</div>
 								<a
-									href="/reihe/{{ $model.result.Next.MusenalmID }}/edit/"
+									href="/reihe/{{ $model.result.Next.MusenalmID }}/edit"
 									class="text-gray-700 hover:text-slate-950 no-underline">
 									<i class="ri-arrow-right-s-line"></i>
 								</a>
--- a/views/routes/reihen/body.gohtml
+++ b/views/routes/reihen/body.gohtml
@@ -69,79 +69,17 @@
 		{{ end }}


-		<!-- INFO: 3. Treffer -->
-		<div id="searchcontent" class="font-serif">
-			{{ if and .search $model.result.IDSeries }}
-				<div class="mb-1 max-w-[60rem] hyphens-auto">
-					{{ range $id, $r := $model.result.IDSeries }}
-						{{ template "_reihe" (Arr $r $model.result.Entries $model.result.EntriesSeries
-						true false false $model.request) }}
-					{{ end }}
-				</div>
-			{{ end }}
-
-			{{ if $model.result.Series }}
-				<div class="mb-1 max-w-[60rem] hyphens-auto">
-					{{ range $id, $r := $model.result.Series }}
-						{{ template "_reihe" (Arr $r $model.result.Entries $model.result.EntriesSeries false false
-							false $model.request)
-						}}
-					{{ end }}
-				</div>
-			{{ end }}
-
-			{{ if and .search $model.result.AltSeries }}
-				{{ if $model.result.IDSeries }}
-					<div class="border-b text-sm font-sans text-right pb-0.5">
-						Treffer in Almanach-Nummer &uarr;
-					</div>
-				{{ end }}
-
-				{{ if $model.result.Series }}
-					<div class="border-b text-sm font-sans text-right pb-0.5">
-						Treffer in Reihentiteln &uarr;
-					</div>
-				{{ end }}
-
-				{{ if not (or $model.result.Series $model.result.IDSeries) }}
-					<div class="border-b text-sm font-sans text-right pb-0.5">
-						Keine Treffer im Reihentitel
-						<i class="ri-forbid-line inline-bloc -mr-0.5"></i>
-					</div>
-				{{ end }}
-				<div class="border-t mb-1.5 text-sm font-sans text-right pt-0.5">
-					Treffer in allen Feldern (inkl. Anmerkungen &amp; Verweise) &darr;
-				</div>
-				<div class="mb-1 max-w-[60rem] hyphens-auto">
-					{{ range $id, $r := $model.result.AltSeries }}
-						{{ template "_reihe" (Arr $r $model.result.Entries $model.result.EntriesSeries
-						false true true $model.request) }}
-					{{ end }}
-				</div>
-			{{ end }}
-			{{ if not (or $model.result.Series $model.result.AltSeries $model.result.IDSeries) }}
-				<div class="mt-8">
-					Keine Reihen
-					{{ if .search }}für {{ .search }}{{ end }}
-					gefunden.
-				</div>
-			{{ end }}
-
-			{{ if $model.search }}
-				<script type="module">
-				let elements = document.querySelectorAll('.reihen-text');
-				let mark_instance = new Mark(elements);
-				// INFO: we wait a little bit before marking, to settle everything
-					setTimeout(() => {
-						mark_instance.mark('{{ $model.search }}', {
-							"seperateWordSearch": true,
-						});
-					}, 200);
-				</script>
-			{{ end }}
-
-
-			<!-- INFO: Ende 3. Treffer -->
+		<div
+			id="reihenresults"
+			hx-get="/reihen/results/{{- if $model.request.query -}}?{{- $model.request.query -}}{{- end -}}"
+			hx-trigger="load"
+			hx-target="this"
+			hx-swap="outerHTML"
+			hx-history="false"
+			hx-indicator="body">
+			<div id="searchcontent" class="font-serif">
+				<div class="flex justify-center text-sm text-stone-600">Reihen laden…</div>
+			</div>
 		</div>

 		<!-- INFO: Ende 2. Breite Anzeige -->
--- a/views/routes/reihen/components/alphabet.gohtml
+++ b/views/routes/reihen/components/alphabet.gohtml
@@ -32,21 +32,26 @@
 			<div class="pb-0 border-b-4 border-zinc-300 grow">
 				<form
 					method="GET"
-					hx-boost="false"
+					action="/reihen/"
+					hx-get="/reihen/results/"
+					hx-indicator="body"
+					hx-push-url="false"
+					hx-swap="outerHTML"
+					hx-target="#reihenresults"
 					x-target="searchcontent"
 					role="search"
 					aria-label="Reihentitelsuche">
 					{{- if $model.letter -}}
-						<input type="hidden" name="letter" value="{{- $model.letter -}}" />
+						<input type="hidden" name="letter" value="{{- $model.letter -}}" :disabled="search" />
 					{{- end -}}
 					{{- if and $model.result $model.result.Agent -}}
-						<input type="hidden" name="agent" value="{{- $model.result.Agent.Id -}}" />
+						<input type="hidden" name="agent" value="{{- $model.result.Agent.Id -}}" :disabled="search" />
 					{{- end -}}
 					{{- if and $model.result $model.result.Place -}}
-						<input type="hidden" name="place" value="{{- $model.result.Place.Id -}}" />
+						<input type="hidden" name="place" value="{{- $model.result.Place.Id -}}" :disabled="search" />
 					{{- end -}}
 					{{- if $model.year -}}
-						<input type="hidden" name="year" value="{{- $model.year -}}" />
+						<input type="hidden" name="year" value="{{- $model.year -}}" :disabled="search" />
 					{{- end -}}
 					<input
 						class="px-1.5 font-serif placeholder:italic w-full"
--- a/views/routes/reihen/components/notifier.gohtml
+++ b/views/routes/reihen/components/notifier.gohtml
@@ -44,7 +44,7 @@
 			<span class="filtercategory">Erscheinungsort</span> &middot;
 			<span class="filterterm">{{ $model.result.Place.Name }}</span>
 			{{- if (IsAdminOrEditor $model.request.user) -}}
-				<a href="/ort/{{ $model.result.Place.Id }}/edit/" class="no-underline rounded bg-stone-100 px-1.5">
+				<a href="/ort/{{ $model.result.Place.Id }}/edit" class="no-underline rounded bg-stone-100 px-1.5">
 					<i class="ri-edit-line"></i>
 				</a>
 			{{- end -}}
--- a/views/routes/reihen/filters/body.gohtml
+++ b/views/routes/reihen/filters/body.gohtml
@@ -0,0 +1,83 @@
+{{ $model := . }}
+
+<div id="reihenfilters">
+{{ $model := . }}
+<div
+	class="hidden lg:flex min-w-[32rem] max-w-[32rem] float-right ml-6 flex-col gap-y-8 [&>*]:pb-12
+	[&>*]:px-12 [&>*]:pt-8 [&>*]:bg-slate-100"
+	id="reihenfilter">
+	{{ if $model.common.Agents }}
+		<div class="">
+			<h2 class="mb-6">Herausgeber:innen, Verlage &amp; Druckereien</h2>
+			<filter-list
+				class="min-h-[20rem] border-b border-zinc-300"
+				id="agent-list"
+				data-url="/reihen/?{{- if $model.query_without_agent -}}{{- $model.query_without_agent -}}&{{- end -}}agent="
+				data-queryparam="agent"
+				data-placeholder="Personen und Körperschaften filtern..."></filter-list>
+		</div>
+	<script type="module">
+		let agentList = document.getElementById("agent-list");
+		if (agentList) {
+			agentList.items = {{ $model.common.Agents }};
+
+			agentList.setSearchTextFunc((item) => {
+				return item.name;
+			});
+
+			agentList.setLinkTextFunc((item) => {
+				return `
+						<span class="filter-list-searchable">${item.name}</span>
+						<span class="text-xs text-stone-500 whitespace-nowrap font-sans">
+							${item.corporate_body ? "Verlag/Druck/Vertrieb" : item.biographical_data}
+						</span>
+						`;
+			});
+		}
+	</script>
+	{{ end }}
+
+	{{ if $model.common.Places }}
+		<div>
+			<h2 class="mb-6">Erscheinungsorte</h2>
+			<filter-list
+				id="place-list"
+				data-url="/reihen/?{{- if $model.query_without_place -}}{{- $model.query_without_place -}}&{{- end -}}place="
+				data-queryparam="place"
+				data-placeholder="Erscheinungsorte filtern..."></filter-list>
+		</div>
+	<script type="module">
+		let placeList = document.getElementById("place-list");
+		if (placeList) placeList.items = {{ $model.common.Places }};
+	</script>
+	{{ end }}
+
+	{{ if $model.common.Years }}
+		<div>
+			<h2 class="mb-6">Geltungsjahre</h2>
+			<filter-list
+				id="year-list"
+				data-url="/reihen/?{{- if $model.query_without_year -}}{{- $model.query_without_year -}}&{{- end -}}year="
+				data-queryparam="year"
+				data-filterstart="true"
+				data-placeholder="Nach Geltungsjahren filtern..."></filter-list>
+		</div>
+	<script type="module">
+		let yearList = document.getElementById("year-list");
+		if (yearList) {
+			yearList.items = {{ $model.common.Years }};
+
+			yearList.setHREFFunc((item) => {
+				return String(item);
+			});
+
+			yearList.setLinkTextFunc((item) => {
+				if (item === 0) return "ohne Jahr";
+				return String(item);
+			});
+		}
+	</script>
+	{{ end }}
+</div>
+
+</div>
--- a/views/routes/reihen/results/body.gohtml
+++ b/views/routes/reihen/results/body.gohtml
@@ -0,0 +1,77 @@
+{{ $model := . }}
+
+<div id="reihenresults">
+	<!-- INFO: 3. Treffer -->
+	<div id="searchcontent" class="font-serif">
+		{{ if and .search $model.result.IDSeries }}
+			<div class="mb-1 max-w-[60rem] hyphens-auto">
+				{{ range $id, $r := $model.result.IDSeries }}
+					{{ template "_reihe" (Arr $r $model.result.Entries $model.result.EntriesSeries
+					true false false $model.request) }}
+				{{ end }}
+			</div>
+		{{ end }}
+
+		{{ if $model.result.Series }}
+			<div class="mb-1 max-w-[60rem] hyphens-auto">
+				{{ range $id, $r := $model.result.Series }}
+					{{ template "_reihe" (Arr $r $model.result.Entries $model.result.EntriesSeries false false
+						false $model.request)
+					}}
+				{{ end }}
+			</div>
+		{{ end }}
+
+		{{ if and .search $model.result.AltSeries }}
+			{{ if $model.result.IDSeries }}
+				<div class="border-b text-sm font-sans text-right pb-0.5">
+					Treffer in Almanach-Nummer &uarr;
+				</div>
+			{{ end }}
+
+			{{ if $model.result.Series }}
+				<div class="border-b text-sm font-sans text-right pb-0.5">
+					Treffer in Reihentiteln &uarr;
+				</div>
+			{{ end }}
+
+			{{ if not (or $model.result.Series $model.result.IDSeries) }}
+				<div class="border-b text-sm font-sans text-right pb-0.5">
+					Keine Treffer im Reihentitel
+					<i class="ri-forbid-line inline-bloc -mr-0.5"></i>
+				</div>
+			{{ end }}
+			<div class="border-t mb-1.5 text-sm font-sans text-right pt-0.5">
+				Treffer in allen Feldern (inkl. Anmerkungen &amp; Verweise) &darr;
+			</div>
+			<div class="mb-1 max-w-[60rem] hyphens-auto">
+				{{ range $id, $r := $model.result.AltSeries }}
+					{{ template "_reihe" (Arr $r $model.result.Entries $model.result.EntriesSeries
+					false true true $model.request) }}
+				{{ end }}
+			</div>
+		{{ end }}
+		{{ if not (or $model.result.Series $model.result.AltSeries $model.result.IDSeries) }}
+			<div class="mt-8">
+				Keine Reihen
+				{{ if .search }}für {{ .search }}{{ end }}
+				gefunden.
+			</div>
+		{{ end }}
+
+		{{ if $model.search }}
+			<script type="module">
+			let elements = document.querySelectorAll('.reihen-text');
+			let mark_instance = new Mark(elements);
+			// INFO: we wait a little bit before marking, to settle everything
+				setTimeout(() => {
+					mark_instance.mark('{{ $model.search }}', {
+						"seperateWordSearch": true,
+					});
+				}, 200);
+			</script>
+		{{ end }}
+
+		<!-- INFO: Ende 3. Treffer -->
+	</div>
+</div>