more bugs fixed, more bugs created

pages/reihe.go

@@ -27,6 +27,7 @@ type ReihePage struct {
 	pagemodels.Page
 }
 
+// TODO: data richtig seutzen, damit die Reihe mit dem template _reihe angezeigt wird
 func (p *ReihePage) Setup(router *router.Router[*core.RequestEvent], app core.App, engine *templating.Engine) error {
 	router.GET(URL_REIHE, func(e *core.RequestEvent) error {
 		id := e.Request.PathValue("id")

pages/reihen.go

@@ -150,6 +150,10 @@ func (p *ReihenPage) PlaceRequest(app core.App, engine *templating.Engine, e *co
 	return p.Get(e, engine, data)
 }
 
+// BUG: Umlaute werden nicht korrekt gesucht
+// BUG: alternative treffer haben keine relations
+// TODO: Suche nach Musenalm-ID
+// TODO: Suchverhalten bei gefilterten Personen, Orten und Jahren
 func (p *ReihenPage) SearchRequest(app core.App, engine *templating.Engine, e *core.RequestEvent) error {
 	search := e.Request.URL.Query().Get(PARAM_SEARCH)
 	data := map[string]interface{}{}

views/assets/scripts.js

@@ -2,19 +2,19 @@ var _ = (i) => {
   throw TypeError(i);
 };
 var g = (i, r, t) => r.has(i) || _("Cannot " + t);
-var c = (i, r, t) => (g(i, r, "read from private field"), t ? t.call(i) : r.get(i)), a = (i, r, t) => r.has(i) ? _("Cannot add the same private member more than once") : r instanceof WeakSet ? r.add(i) : r.set(i, t), o = (i, r, t, e) => (g(i, r, "write to private field"), e ? e.call(i, t) : r.set(i, t), t), f = (i, r, t) => (g(i, r, "access private method"), t);
+var c = (i, r, t) => (g(i, r, "read from private field"), t ? t.call(i) : r.get(i)), l = (i, r, t) => r.has(i) ? _("Cannot add the same private member more than once") : r instanceof WeakSet ? r.add(i) : r.set(i, t), o = (i, r, t, e) => (g(i, r, "write to private field"), e ? e.call(i, t) : r.set(i, t), t), d = (i, r, t) => (g(i, r, "access private method"), t);
-const v = "script[xslt-onload]", m = "xslt-template", A = "xslt-transformed", F = "filter-list", d = "filter-list-list", I = "filter-list-item", w = "filter-list-input", E = "filter-list-searchable";
+const v = "script[xslt-onload]", m = "xslt-template", A = "xslt-transformed", F = "filter-list", f = "filter-list-list", w = "filter-list-item", I = "filter-list-input", E = "filter-list-searchable";
-var l, p, x;
+var a, p, b;
 class $ {
   constructor() {
-    a(this, p);
+    l(this, p);
-    a(this, l);
+    l(this, a);
-    o(this, l, /* @__PURE__ */ new Map());
+    o(this, a, /* @__PURE__ */ new Map());
   }
   setup() {
     let r = htmx.findAll(v);
     for (let t of r)
-      f(this, p, x).call(this, t);
+      d(this, p, b).call(this, t);
   }
   hookupHTMX() {
     htmx.on("htmx:load", (r) => {
@@ -22,27 +22,27 @@ class $ {
     });
   }
 }
-l = new WeakMap(), p = new WeakSet(), x = function(r) {
+a = new WeakMap(), p = new WeakSet(), b = function(r) {
   if (r.getAttribute(A) === "true" || !r.hasAttribute(m))
     return;
-  let t = "#" + r.getAttribute(m), e = c(this, l).get(t);
+  let t = "#" + r.getAttribute(m), e = c(this, a).get(t);
   if (!e) {
     let u = htmx.find(t);
     if (u) {
-      let b = u.innerHTML ? new DOMParser().parseFromString(u.innerHTML, "application/xml") : u.contentDocument;
+      let S = u.innerHTML ? new DOMParser().parseFromString(u.innerHTML, "application/xml") : u.contentDocument;
-      e = new XSLTProcessor(), e.importStylesheet(b), c(this, l).set(t, e);
+      e = new XSLTProcessor(), e.importStylesheet(S), c(this, a).set(t, e);
     } else
       throw new Error("Unknown XSLT template: " + t);
   }
-  let s = new DOMParser().parseFromString(r.innerHTML, "application/xml"), L = e.transformToFragment(s, document), S = new XMLSerializer().serializeToString(L);
+  let s = new DOMParser().parseFromString(r.innerHTML, "application/xml"), L = e.transformToFragment(s, document), x = new XMLSerializer().serializeToString(L);
-  r.outerHTML = S;
+  r.outerHTML = x;
 };
 var n, h, T;
 class k extends HTMLElement {
   constructor() {
     super();
-    a(this, h);
+    l(this, h);
-    a(this, n, !1);
+    l(this, n, !1);
     this._items = [], this._url = "", this._filterstart = !1, this._placeholder = "Liste filtern...", this.render();
   }
   static get observedAttributes() {
@@ -84,7 +84,7 @@ class k extends HTMLElement {
   mark() {
     if (typeof Mark != "function")
       return;
-    let t = this.querySelector("#" + d);
+    let t = this.querySelector("#" + f);
     if (!t)
       return;
     let e = new Mark(t.querySelectorAll("." + E));
@@ -127,19 +127,19 @@ class k extends HTMLElement {
     return e === "" ? "" : `<span class="${E}">${e}</span>`;
   }
   renderList() {
-    let t = this.querySelector("#" + d);
+    let t = this.querySelector("#" + f);
     t && (t.outerHTML = this.List()), this.mark();
   }
   render() {
     this.innerHTML = `
-            <div class="font-serif text-base">
+            <div class="font-serif text-base shadow-inner border border-stone-100">
 							${this.Input()}
 							${this.List()}
             </div>
         `;
   }
   ActiveDot(t) {
-    return f(this, h, T).call(this, t), "";
+    return d(this, h, T).call(this, t), "";
   }
   NoItems(t) {
     return t.length === 0 ? '<div class="px-2 py-0.5 italic text-gray-500">Keine Einträge gefunden</div>' : "";
@@ -147,12 +147,12 @@ class k extends HTMLElement {
   Input() {
     return `
 			<div class="flex w-full py-0.5 border-b border-zinc-600 bg-stone-50">
-						<i class="ri-arrow-right-s-line mr-1 pl-2"></i>
+						<i class="ri-arrow-right-s-line pl-2"></i>
 						<div class="grow">
 						<input
 								type="text"
 								placeholder="${this._placeholder}"
-								class="${w} w-full placeholder:italic px-2 py-0.5" />
+								class="${I} w-full placeholder:italic px-2 py-0.5" />
 						</div>
 				</div>
 				`;
@@ -167,13 +167,13 @@ class k extends HTMLElement {
         t = this._items.filter((s) => e.every((L) => this.getSearchText(s).toLowerCase().includes(L.toLowerCase())));
       }
     return `
-							<div id="${d}" class="${d} pt-1 min-h-72 max-h-60 overflow-auto border-b border-zinc-300 bg-stone-50 ${c(this, n) ? "hidden" : ""}">
+							<div id="${f}" class="${f} pt-1 min-h-[19rem] max-h-60 overflow-auto border-b border-zinc-300 bg-stone-50 ${c(this, n) ? "hidden" : ""}">
 								${t.map(
       (e, s) => `
 									<a
 										href="${this._url}${this.getHREF(e)}"
-										class="${I} block px-2.5 py-0.5 hover:bg-slate-200 no-underline ${s % 2 === 0 ? "bg-stone-100" : "bg-stone-50"}"
+										class="${w} block px-2.5 py-0.5 hover:bg-slate-200 no-underline ${s % 2 === 0 ? "bg-stone-100" : "bg-stone-50"}"
-										${f(this, h, T).call(this, e) ? 'aria-current="page"' : ""}>
+										${d(this, h, T).call(this, e) ? 'aria-current="page"' : ""}>
 										${this.ActiveDot(e)}
 										${this.getLinkText(e)}
 									</a>

views/routes/components/_alphabet.gohtml

@@ -37,9 +37,10 @@
 					name="search"
 					value="{{ $model.search }}"
 					x-model="search"
-					placeholder="Almanach-Nr od. Suchbegriff"
+					placeholder="Almanach-Nr oder Suchbegriff"
 					hx-get=""
-					hx-trigger="input changed delay:=200ms, keyup[key=='Enter']"
+					hx-trigger="input changed delay=1000ms, keyup[key=='Enter']"
+					hx-sync="this:replace"
 					hx-select="#searchcontent"
 					hx-target="#searchcontent"
 					autocomplete="off" />

views/routes/components/_reihe.gohtml

@@ -1,26 +1,40 @@
 {{ $model := index . 0 }}
 {{ $r := index . 1 }}
 
+{{ $bds := index $model.relations $r.Id }}
+
 
 <div class="flex flex-row mb-1.5">
 	<div class="grow-0 shrink-0 w-[12rem] flex flex-col">
 		{{ if $r.References }}
 			<div class="text-sm font-sans px-2 py-1 bg-stone-100">{{ $r.References }}</div>
 		{{ end }}
+		{{ if $model.musenalmid }}
+			{{ range $_, $rel := $bds }}
+				<div class="font-sans text-sm px-2 py-1 bg-stone-100 searchable my-0.5">
+					Almanach-Nr.
+					{{ (index $model.entries
+						$rel.Entry).MusenalmID
+					}}
+				</div>
+			{{ end }}
+		{{ end }}
 		<div class="font-sans py-0.5 text-xs">
-			<a href="/reihe/?={{ $r.Id }}" class="no-underline rounded bg-stone-100 px-1.5">
+			<a href="/reihe/{{ $r.MusenalmID }}" class="no-underline rounded bg-stone-100 px-1.5">
 				<i class="ri-links-line"></i> Permalink
 			</a>
 		</div>
 	</div>
 	<div class="grow-0 ml-8 -indent-3">
-		<span class="font-bold">{{ $r.Title }}</span>
+		<div class="reihen-text contents">
-		{{ if $r.Annotation }}
+			<span class="font-bold">{{ $r.Title }}</span>
-			<span>&ensp;&middot;&ensp;</span>
+			{{ if $r.Annotation }}
-			<span class="">{{ Safe $r.Annotation }}</span>
+				<span>&ensp;&middot;&ensp;</span>
-		{{ end }}
+				<span class="">{{ Safe $r.Annotation }}</span>
+			{{ end }}
+		</div>
+		<div></div>
 		<div class="ml-3">
-			{{ $bds := index $model.relations $r.Id }}
 			{{ if $bds }}
 				{{ range $_, $rel := $bds }}
 					{{ $bd := index $model.entries $rel.Entry }}

views/routes/components/_reihenfilter.gohtml

@@ -1,9 +1,10 @@
 {{ $model := . }}
 <div
-	class="min-w-[32rem] max-w-[32rem] float-right ml-6 flex flex-col gap-y-8 [&>*]:py-12
+	class="min-w-[32rem] max-w-[32rem] float-right ml-6 flex flex-col gap-y-8 [&>*]:pb-12
-	[&>*]:px-12 -mr-36 [&>*]:bg-slate-100">
+	[&>*]:px-12 [&>*]:pt-8 -mr-36 [&>*]:bg-slate-100">
 	{{ if .agents }}
 		<div class="">
+			<h2 class="mb-6">Personen, Verlage &amp; Druckereien</h2>
 			<filter-list
 				id="agent-list"
 				data-url="/reihen/?agent="
@@ -32,6 +33,7 @@
 
 	{{ if .places }}
 		<div>
+			<h2 class="mb-6">Erscheinungsorte</h2>
 			<filter-list
 				id="place-list"
 				data-url="/reihen/?place="
@@ -45,11 +47,12 @@
 
 	{{ if .years }}
 		<div>
+			<h2 class="mb-6">Geltungsjahre</h2>
 			<filter-list
 				id="year-list"
 				data-url="/reihen/?year="
 				data-filterstart="true"
-				data-placeholder="Erscheinungsjahr filtern..."></filter-list>
+				data-placeholder="Nach Geltungsjahren filtern..."></filter-list>
 		</div>
 	<script type="module">
 		let yearList = document.getElementById("year-list");

views/routes/reihen/body.gohtml

@@ -13,22 +13,43 @@
 </div>
 
 <div id="searchcontent" class="font-serif">
-	<div class="-ml-16">
+	{{ if $model.search }}
-	{{ if or .series .altseries }}
+<script type="module">
-		<div class="mb-1 max-w-[60rem] hyphens-auto">
+let elements = document.querySelectorAll('.reihen-text');
-			{{ range $id, $r := .series }}
+let mark_instance = new Mark(elements);
-				{{ template "_reihe" (Arr $model $r) }}
+// INFO: we wait a little bit before marking, to settle everything
-			{{ end }}
+	setTimeout(() => {
-		</div>
+		mark_instance.mark('{{ $model.search }}', {
-		</div>
+			"seperateWordSearch": true,
+		});
+	}, 200);
+</script>
+	{{ end }}
 
-		{{ if .search }}
+	{{ if or .series .altseries }}
-			<div class="mt-8 max-w-96">
+		<div class="-ml-16">
-				{{ range $id, $r := .altseries }}
+			<div class="mb-1 max-w-[60rem] hyphens-auto">
-						{{ template "_reihe" (Arr $model $r) }}
+				{{ range $id, $r := .series }}
+					{{ template "_reihe" (Arr $model $r) }}
 				{{ end }}
 			</div>
-		{{ end }}
+
+			{{ if and .search .altseries }}
+				{{ if .series }}
+					<div class="border-b text-xs font-sans text-right pb-0.5">
+						Treffer in Reihentiteln &uarr;
+					</div>
+				{{ end }}
+				<div class="border-t mb-1.5 text-xs font-sans text-right pt-0.5">
+					Treffer in Anmerkungen, Verweisen etc. &darr;
+				</div>
+				<div class="mb-1 max-w-[60rem] hyphens-auto">
+					{{ range $id, $r := .altseries }}
+						{{ template "_reihe" (Arr $model $r) }}
+					{{ end }}
+				</div>
+			{{ end }}
+		</div>
 	{{ else }}
 		<div class="mt-8">
 			Keine Reihen

views/transform/main.js

@@ -285,7 +285,7 @@ class FilterList extends HTMLElement {
 
 	render() {
 		this.innerHTML = `
-            <div class="font-serif text-base">
+            <div class="font-serif text-base shadow-inner border border-stone-100">
 							${this.Input()}
 							${this.List()}
             </div>
@@ -309,7 +309,7 @@ class FilterList extends HTMLElement {
 	Input() {
 		return `
 			<div class="flex w-full py-0.5 border-b border-zinc-600 bg-stone-50">
-						<i class="ri-arrow-right-s-line mr-1 pl-2"></i>
+						<i class="ri-arrow-right-s-line pl-2"></i>
 						<div class="grow">
 						<input
 								type="text"
@@ -338,7 +338,7 @@ class FilterList extends HTMLElement {
 		}
 
 		return `
-							<div id="${FILTER_LIST_LIST}" class="${FILTER_LIST_LIST} pt-1 min-h-72 max-h-60 overflow-auto border-b border-zinc-300 bg-stone-50 ${this.#hiddenlist ? "hidden" : ""}">
+							<div id="${FILTER_LIST_LIST}" class="${FILTER_LIST_LIST} pt-1 min-h-[19rem] max-h-60 overflow-auto border-b border-zinc-300 bg-stone-50 ${this.#hiddenlist ? "hidden" : ""}">
 								${filtereditems
 									.map(
 										(item, index) => `