Theodor-Springmann-Stiftung/musenalm
1
0
Fork 0
mirror of https://github.com/Theodor-Springmann-Stiftung/musenalm.git synced 2025-10-29 17:25:32 +00:00
Code Issues Packages Projects Releases Wiki Activity

Single person page + reihen list

Browse Source
This commit is contained in:
Simon Martens
2025-02-23 19:27:26 +01:00
parent d8a01bfffb
commit 2ef3eda244
24 changed files with 802 additions and 133 deletions
Download Patch File Download Diff File Expand all files Collapse all files

283
views/assets/scripts.js
View File

@@ -1,48 +1,48 @@
var _ = (s) => {
var L = (s) => {
throw TypeError(s);
};
var L = (s, i, t) => i.has(s) || _("Cannot " + t);
var d = (s, i, t) => (L(s, i, "read from private field"), t ? t.call(s) : i.get(s)), n = (s, i, t) => i.has(s) ? _("Cannot add the same private member more than once") : i instanceof WeakSet ? i.add(s) : i.set(s, t), a = (s, i, t, e) => (L(s, i, "write to private field"), e ? e.call(s, t) : i.set(s, t), t), u = (s, i, t) => (L(s, i, "access private method"), t);
const S = "script[xslt-onload]", b = "xslt-template", w = "xslt-transformed", y = "filter-list", p = "filter-list-list", k = "filter-list-item", A = "filter-list-input", g = "filter-list-searchable", M = "scroll-button", F = "tool-tip";
var l, f, x;
class $ {
var T = (s, e, t) => e.has(s) || L("Cannot " + t);
var g = (s, e, t) => (T(s, e, "read from private field"), t ? t.call(s) : e.get(s)), c = (s, e, t) => e.has(s) ? L("Cannot add the same private member more than once") : e instanceof WeakSet ? e.add(s) : e.set(s, t), u = (s, e, t, i) => (T(s, e, "write to private field"), i ? i.call(s, t) : e.set(s, t), t), f = (s, e, t) => (T(s, e, "access private method"), t);
const w = "script[xslt-onload]", v = "xslt-template", A = "xslt-transformed", k = "filter-list", m = "filter-list-list", M = "filter-list-item", y = "filter-list-input", x = "filter-list-searchable", B = "scroll-button", P = "tool-tip", I = "abbrev-tooltips";
var h, b, E;
class R {
constructor() {
n(this, f);
n(this, l);
a(this, l, /* @__PURE__ */ new Map());
c(this, b);
c(this, h);
u(this, h, /* @__PURE__ */ new Map());
}
setup() {
let i = htmx.findAll(S);
for (let t of i)
u(this, f, x).call(this, t);
let e = htmx.findAll(w);
for (let t of e)
f(this, b, E).call(this, t);
}
hookupHTMX() {
htmx.on("htmx:load", (i) => {
htmx.on("htmx:load", (e) => {
this.setup();
});
}
}
l = new WeakMap(), f = new WeakSet(), x = function(i) {
if (i.getAttribute(w) === "true" || !i.hasAttribute(b))
h = new WeakMap(), b = new WeakSet(), E = function(e) {
if (e.getAttribute(A) === "true" || !e.hasAttribute(v))
return;
let t = "#" + i.getAttribute(b), e = d(this, l).get(t);
if (!e) {
let c = htmx.find(t);
if (c) {
let v = c.innerHTML ? new DOMParser().parseFromString(c.innerHTML, "application/xml") : c.contentDocument;
e = new XSLTProcessor(), e.importStylesheet(v), d(this, l).set(t, e);
let t = "#" + e.getAttribute(v), i = g(this, h).get(t);
if (!i) {
let l = htmx.find(t);
if (l) {
let S = l.innerHTML ? new DOMParser().parseFromString(l.innerHTML, "application/xml") : l.contentDocument;
i = new XSLTProcessor(), i.importStylesheet(S), g(this, h).set(t, i);
} else
throw new Error("Unknown XSLT template: " + t);
}
let r = new DOMParser().parseFromString(i.innerHTML, "application/xml"), T = e.transformToFragment(r, document), E = new XMLSerializer().serializeToString(T);
i.outerHTML = E;
let r = new DOMParser().parseFromString(e.innerHTML, "application/xml"), n = i.transformToFragment(r, document), a = new XMLSerializer().serializeToString(n);
e.outerHTML = a;
};
var o, h, m;
class I extends HTMLElement {
var o, p, _;
class H extends HTMLElement {
constructor() {
super();
n(this, h);
n(this, o, !1);
c(this, p);
c(this, o, !1);
this._items = [], this._url = "", this._filterstart = !1, this._placeholder = "Liste filtern...", this.render();
}
static get observedAttributes() {
@@ -55,40 +55,40 @@ class I extends HTMLElement {
return this._items;
}
connectedCallback() {
this._url = this.getAttribute("data-url") || "./", this._filterstart = this.getAttribute("data-filterstart") === "true", this._placeholder = this.getAttribute("data-placeholder") || "Liste filtern...", this._filterstart && a(this, o, !0), this.addEventListener("input", this.onInput.bind(this)), this.addEventListener("keydown", this.onEnter.bind(this)), this.addEventListener("focusin", this.onGainFocus.bind(this)), this.addEventListener("focusout", this.onLoseFocus.bind(this));
this._url = this.getAttribute("data-url") || "./", this._filterstart = this.getAttribute("data-filterstart") === "true", this._placeholder = this.getAttribute("data-placeholder") || "Liste filtern...", this._filterstart && u(this, o, !0), this.addEventListener("input", this.onInput.bind(this)), this.addEventListener("keydown", this.onEnter.bind(this)), this.addEventListener("focusin", this.onGainFocus.bind(this)), this.addEventListener("focusout", this.onLoseFocus.bind(this));
}
attributeChangedCallback(t, e, r) {
t === "data-url" && e !== r && (this._url = r, this.render()), t === "data-filterstart" && e !== r && (this._filterstart = r === "true", this.render()), t === "data-placeholder" && e !== r && (this._placeholder = r, this.render());
attributeChangedCallback(t, i, r) {
t === "data-url" && i !== r && (this._url = r, this.render()), t === "data-filterstart" && i !== r && (this._filterstart = r === "true", this.render()), t === "data-placeholder" && i !== r && (this._placeholder = r, this.render());
}
onInput(t) {
t.target && t.target.tagName.toLowerCase() === "input" && (this._filter = t.target.value, this.renderList());
}
onGainFocus(t) {
t.target && t.target.tagName.toLowerCase() === "input" && (a(this, o, !1), this.renderList());
t.target && t.target.tagName.toLowerCase() === "input" && (u(this, o, !1), this.renderList());
}
onLoseFocus(t) {
let e = this.querySelector("input");
if (t.target && t.target === e) {
let i = this.querySelector("input");
if (t.target && t.target === i) {
if (relatedElement = t.relatedTarget, relatedElement && this.contains(relatedElement))
return;
e.value = "", this._filter = "", this._filterstart && a(this, o, !0), this.renderList();
i.value = "", this._filter = "", this._filterstart && u(this, o, !0), this.renderList();
}
}
onEnter(t) {
if (t.target && t.target.tagName.toLowerCase() === "input" && t.key === "Enter") {
t.preventDefault();
const e = this.querySelector("a");
e && e.click();
const i = this.querySelector("a");
i && i.click();
}
}
mark() {
if (typeof Mark != "function")
return;
let t = this.querySelector("#" + p);
let t = this.querySelector("#" + m);
if (!t)
return;
let e = new Mark(t.querySelectorAll("." + g));
this._filter && e.mark(this._filter, {
let i = new Mark(t.querySelectorAll("." + x));
this._filter && i.mark(this._filter, {
separateWordSearch: !0
});
}
@@ -123,11 +123,11 @@ class I extends HTMLElement {
return t.name;
}
getLinkText(t) {
let e = this.getSearchText(t);
return e === "" ? "" : `<span class="${g}">${e}</span>`;
let i = this.getSearchText(t);
return i === "" ? "" : `<span class="${x}">${i}</span>`;
}
renderList() {
let t = this.querySelector("#" + p);
let t = this.querySelector("#" + m);
t && (t.outerHTML = this.List()), this.mark();
}
render() {
@@ -139,7 +139,7 @@ class I extends HTMLElement {
`;
}
ActiveDot(t) {
return u(this, h, m).call(this, t), "";
return f(this, p, _).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>' : "";
@@ -152,7 +152,7 @@ class I extends HTMLElement {
<input
type="text"
placeholder="${this._placeholder}"
class="${A} w-full placeholder:italic px-2 py-0.5" />
class="${y} w-full placeholder:italic px-2 py-0.5" />
</div>
</div>
`;
@@ -161,21 +161,21 @@ class I extends HTMLElement {
let t = this._items;
if (this._filter)
if (this._filterstart)
t = this._items.filter((e) => this.getSearchText(e).toLowerCase().startsWith(this._filter.toLowerCase()));
t = this._items.filter((i) => this.getSearchText(i).toLowerCase().startsWith(this._filter.toLowerCase()));
else {
let e = this._filter.split(" ");
t = this._items.filter((r) => e.every((T) => this.getSearchText(r).toLowerCase().includes(T.toLowerCase())));
let i = this._filter.split(" ");
t = this._items.filter((r) => i.every((n) => this.getSearchText(r).toLowerCase().includes(n.toLowerCase())));
}
return `
<div id="${p}" class="${p} pt-1 min-h-[19rem] max-h-60 overflow-auto border-b border-zinc-300 bg-stone-50 ${d(this, o) ? "hidden" : ""}">
<div id="${m}" class="${m} pt-1 min-h-[19rem] max-h-60 overflow-auto border-b border-zinc-300 bg-stone-50 ${g(this, o) ? "hidden" : ""}">
${t.map(
(e, r) => `
(i, r) => `
<a
href="${this._url}${this.getHREF(e)}"
class="${k} block px-2.5 py-0.5 hover:bg-slate-200 no-underline ${r % 2 === 0 ? "bg-stone-100" : "bg-stone-50"}"
${u(this, h, m).call(this, e) ? 'aria-current="page"' : ""}>
${this.ActiveDot(e)}
${this.getLinkText(e)}
href="${this._url}${this.getHREF(i)}"
class="${M} block px-2.5 py-0.5 hover:bg-slate-200 no-underline ${r % 2 === 0 ? "bg-stone-100" : "bg-stone-50"}"
${f(this, p, _).call(this, i) ? 'aria-current="page"' : ""}>
${this.ActiveDot(i)}
${this.getLinkText(i)}
</a>
`
).join("")}
@@ -184,13 +184,13 @@ class I extends HTMLElement {
`;
}
}
o = new WeakMap(), h = new WeakSet(), m = function(t) {
o = new WeakMap(), p = new WeakSet(), _ = function(t) {
if (!t)
return !1;
let e = this.getHREF(t);
return !(e === "" || !window.location.href.endsWith(e));
let i = this.getHREF(t);
return !(i === "" || !window.location.href.endsWith(i));
};
class B extends HTMLElement {
class C extends HTMLElement {
constructor() {
super(), this.handleScroll = this.handleScroll.bind(this), this.scrollToTop = this.scrollToTop.bind(this);
}
@@ -226,12 +226,12 @@ class B extends HTMLElement {
window.scrollTo({ top: 0, behavior: "smooth" });
}
}
class C extends HTMLElement {
class F extends HTMLElement {
static get observedAttributes() {
return ["position"];
return ["position", "timeout"];
}
constructor() {
super(), this._tooltipBox = null;
super(), this._tooltipBox = null, this._timeout = 200, this._hideTimeout = null, this._hiddenTimeout = null;
}
connectedCallback() {
this.classList.add(
@@ -242,8 +242,8 @@ class C extends HTMLElement {
"leading-none",
"[&>*]:leading-normal"
);
const i = this.querySelector(".data-tip"), t = i ? i.innerHTML : "Tooltip";
i && i.remove(), this._tooltipBox = document.createElement("div"), this._tooltipBox.innerHTML = t, this._tooltipBox.className = [
const e = this.querySelector(".data-tip"), t = e ? e.innerHTML : "Tooltip";
e && e.remove(), this._tooltipBox = document.createElement("div"), this._tooltipBox.innerHTML = t, this._tooltipBox.className = [
"opacity-0",
"hidden",
"absolute",
@@ -261,20 +261,20 @@ class C extends HTMLElement {
"font-sans"
].join(" "), this.appendChild(this._tooltipBox), this._updatePosition(), this.addEventListener("mouseenter", () => this._showTooltip()), this.addEventListener("mouseleave", () => this._hideTooltip());
}
attributeChangedCallback(i, t, e) {
i === "position" && this._tooltipBox && this._updatePosition();
attributeChangedCallback(e, t, i) {
e === "position" && this._tooltipBox && this._updatePosition(), e === "timeout" && i && (this._timeout = parseInt(i) || 200);
}
_showTooltip() {
this._tooltipBox.classList.remove("hidden"), setTimeout(() => {
clearTimeout(this._hideTimeout), clearTimeout(this._hiddenTimeout), this._tooltipBox.classList.remove("hidden"), setTimeout(() => {
this._tooltipBox.classList.remove("opacity-0"), this._tooltipBox.classList.add("opacity-100");
}, 16);
}
_hideTooltip() {
setTimeout(() => {
this._tooltipBox.classList.remove("opacity-100"), this._tooltipBox.classList.add("opacity-0"), setTimeout(() => {
this._hideTimeout = setTimeout(() => {
this._tooltipBox.classList.remove("opacity-100"), this._tooltipBox.classList.add("opacity-0"), this._hiddenTimeout = setTimeout(() => {
this._tooltipBox.classList.add("hidden");
}, 200);
}, 100);
}, this._timeout + 100);
}, this._timeout);
}
_updatePosition() {
switch (this._tooltipBox.classList.remove(
@@ -334,11 +334,142 @@ class C extends HTMLElement {
}
}
}
customElements.define(y, I);
customElements.define(M, B);
customElements.define(F, C);
class d extends HTMLElement {
static get observedAttributes() {
return ["data-text", "data-abbrevmap"];
}
static get defaultAbbrevMap() {
return {
"#": "Hinweis auf weitere Informationen in der Anmerkung.",
$: "vermutlich",
"+++": "Inhalte aus mehreren Almanachen interpoliert",
B: "Blatt",
BB: "Blätter",
C: "Corrigenda",
Diagr: "Diagramm",
G: "Graphik",
"G-Verz": "Verzeichnis der Kupfer u. ä.",
GG: "Graphiken",
Hrsg: "Herausgeber",
"I-Verz": "Inhaltsverzeichnis",
Kal: "Kalendarium",
Kr: "Karte",
MusB: "Musikbeigabe",
MusBB: "Musikbeigaben",
S: "Seite",
SS: "Seiten",
Sp: "Spiegel",
T: "Titel",
TG: "Titelgraphik, Titelportrait etc",
"TG r": "Titelgraphik, Titelportrait etc recto",
"TG v": "Titelgraphik, Titelportrait etc verso",
Tab: "Tabelle",
UG: "Umschlaggraphik",
"UG r": "Umschlaggraphik recto",
"UG v": "Umschlaggraphik verso",
VB: "Vorsatzblatt",
Vf: "Verfasser",
VrlgM: "Verlagsmitteilung",
Vrwrt: "Vorwort",
ar: "arabische Paginierung",
ar1: "erste arabische Paginierung",
ar2: "zweite arabische Paginierung",
ar3: "dritte arabische Paginierung",
ar4: "vierte arabische Paginierung",
ar5: "fünfte arabische Paginierung",
ar6: "sechste arabische Paginierung",
ar7: "siebte arabische Paginierung",
gA: "graphische Anleitung",
gT: "graphischer Titel",
gTzA: "graphische Tanzanleitung",
nT: "Nachtitel",
röm: "römische Paginierung",
röm1: "erste römische Paginierung",
röm2: "zweite römische Paginierung",
röm3: "dritte römische Paginierung",
röm4: "vierte römische Paginierung",
röm5: "fünfte römische Paginierung",
röm6: "sechste römische Paginierung",
röm7: "siebte römische Paginierung",
vT: "Vortitel",
zT: "Zwischentitel",
"§§": "Hinweis auf Mängel im Almanach (Beschädigungen, fehlende Graphiken, unvollständige Sammlungen etc) in der Anmerkung"
};
}
constructor() {
super(), this._abbrevMap = d.defaultAbbrevMap;
}
connectedCallback() {
this.render();
}
attributeChangedCallback(e, t, i) {
t !== i && (e === "data-abbrevmap" && this._parseAndSetAbbrevMap(i), this.render());
}
_parseAndSetAbbrevMap(e) {
if (!e) {
this._abbrevMap = d.defaultAbbrevMap;
return;
}
try {
this._abbrevMap = JSON.parse(e);
} catch {
this._abbrevMap = d.defaultAbbrevMap;
}
}
setAbbrevMap(e) {
typeof e == "object" && e !== null && (this._abbrevMap = e, this.render());
}
get text() {
return this.getAttribute("data-text") || "";
}
set text(e) {
this.setAttribute("data-text", e);
}
render() {
this.innerHTML = this.transformText(this.text, this._abbrevMap);
}
transformText(e, t) {
let i = "", r = 0;
for (; r < e.length; ) {
if (r > 0 && !this.isSpaceOrPunct(e[r - 1])) {
i += e[r], r++;
continue;
}
const n = this.findLongestAbbrevAt(e, r, t);
if (n) {
const { match: a, meaning: l } = n;
i += `
<tool-tip position="top" class="!inline" timeout="300">
<div class="data-tip p-2 text-sm text-white bg-gray-700 rounded shadow">
${l}
</div>
<span class="cursor-help text-blue-900 hover:text-slate-800">
${a}
</span>
</tool-tip>
`, r += a.length;
} else
i += e[r], r++;
}
return i;
}
findLongestAbbrevAt(e, t, i) {
let r = null, n = 0;
for (const a of Object.keys(i))
e.startsWith(a, t) && a.length > n && (r = a, n = a.length);
return r ? { match: r, meaning: i[r] } : null;
}
isSpaceOrPunct(e) {
return /\s|[.,;:!?]/.test(e);
}
}
customElements.define(I, d);
customElements.define(k, H);
customElements.define(B, C);
customElements.define(P, F);
export {
I as FilterList,
B as ScrollButton,
$ as XSLTParseProcess
d as AbbreviationTooltips,
H as FilterList,
C as ScrollButton,
R as XSLTParseProcess
};

2
views/assets/style.css
View File

File diff suppressed because one or more lines are too long

168
views/routes/almanach/body.gohtml
View File

@@ -1,3 +1,169 @@
{{ $model := . }}
{{ $isGer := false }}
{{ $isFra := false }}
{{ $isEng := false }}
{{ $model.entry.TitleStmt }}
<div class="container-normal" id="">
<div class="flex flex-col" id="entrydata">
<div class="entryrow">
<div class="fieldlabel">Almanach-Nummer</div>
<div class="fieldvalue">{{ $model.entry.MusenalmID }}</div>
</div>
{{- if $model.entry.PreferredTitle -}}
<div class="entryrow">
<div class="fieldlabel">Kurztitel</div>
<div class="fieldvalue">{{ $model.entry.PreferredTitle }}</div>
</div>
{{- end -}}
{{- if $model.entry.TitleStmt -}}
<div class="entryrow">
<div class="fieldlabel">Titel</div>
<div class="fieldvalue">{{ $model.entry.TitleStmt }}</div>
</div>
{{- end -}}
<div class="entryrow">
<div class="fieldlabel">Jahr</div>
<div class="fieldvalue">
{{- if $model.entry.Year -}}
<a href="/reihen?year={{ $model.entry.Year }}&hidden=true">{{ $model.entry.Year }}</a>
{{- else -}}
[keine Angabe]
{{- end -}}
</div>
</div>
{{- if $model.entry.ResponsibilityStmt -}}
<div class="entryrow">
<div class="fieldlabel">Herausgeber</div>
<div class="fieldvalue">{{ $model.entry.ResponsibilityStmt }}</div>
</div>
{{- end -}}
{{- if $model.entry.Extent -}}
<div class="entryrow">
<div class="fieldlabel">Umfang</div>
<div class="fieldvalue">
<abbrev-tooltips data-text="{{ $model.entry.Extent }}"></abbrev-tooltips>
</div>
</div>
{{- end -}}
{{- if $model.entry.Language -}}
<div class="entryrow">
<div class="fieldlabel">Sprache</div>
<div class="fieldvalue">
{{- range $i, $lang := $model.entry.Language -}}
{{- if $i -}},{{- end -}}
{{- if eq $lang "ger" -}}
{{ $isGer = true }}
Deutsch
{{- else if eq $lang "eng" -}}
{{ $isEng = true }}
Englisch
{{- else if eq $lang "fre" -}}
{{ $isFra = true }}
Französisch
{{- else if eq $lang "ita" -}}
Italienisch
{{- else if eq $lang "lat" -}}
Latein
{{- else -}}
{{ $lang }}
{{- end -}}
{{- end -}}
</div>
</div>
{{- end -}}
{{- if $model.entry.References -}}
<div class="entryrow">
<div class="fieldlabel">Nachweise</div>
<div class="fieldvalue">
{{- $model.entry.References -}}
</div>
</div>
{{- end -}}
{{- if $model.series -}}
<div class="entryrow">
<div class="fieldlabel">Reihen</div>
<div class="fieldvalue">
{{- range $i, $s := $model.series -}}
<div>
{{- $rel := index $model.srelations $s.Id -}}
{{- if $rel -}}
{{- $crel := index $rel 0 -}}
{{- if not (eq $crel.Type "Bevorzugter Reihentitel") -}}
<span class="text-sm font-sans mr-2">
{{- if eq $crel.Type "Früherer Reihentitel" -}}
hat Titelauflage s.a.
{{- else if eq $crel.Type "Späterer Reihentitel" -}}
ist Titelauflage von, s.a.
{{- else if eq $crel.Type "In anderer Sprache" -}}
{{- if $isFra -}}
In deutscher Sprache s.a.
{{- else -}}
In französischer Sprache s.a.
{{- end -}}
{{- else if eq $crel.Type "Alternatives Titelblatt" -}}
alternatives Titelblatt, s.a.
{{- end -}}
</span>
{{- end -}}
{{- end -}}
<a href="/reihe/{{ $s.MusenalmID }}">{{ $s.Title }}</a>
</div>
{{- end -}}
</div>
</div>
{{- end -}}
{{- if $model.places -}}
<div class="entryrow">
<div class="fieldlabel">Orte</div>
<div class="fieldvalue">
{{- range $i, $p := $model.places -}}
<div>
<a href="/reihen?place={{ $p.Id }}&hidden=true">{{ $p.Name }}</a>
</div>
{{- end -}}
</div>
</div>
{{- end -}}
{{- if $model.arelations -}}
{{- $rels := index $model.arelations $model.entry.Id -}}
<div class="entryrow">
<div class="fieldlabel">Personen</div>
<div class="fieldvalue">
{{- range $i, $r := $rels -}}
{{- $a := index $model.agents $r.Agent -}}
{{- if $a -}}
<div>
<a href="/person/{{ $a.Id }}">
{{ $a.Name }}
</a>
<span class="ml-2 px-2 py-0.5 rounded text-sm font-sans bg-slate-200 inline-block">
{{- $r.Type -}}
</span>
</div>
{{- end -}}
{{- end -}}
</div>
</div>
{{- end -}}
{{- if $model.entry.Annotation -}}
<div class="entryrow">
<div class="fieldlabel">Anmerkungen</div>
<div class="fieldvalue">
{{- Safe $model.entry.Annotation -}}
</div>
</div>
{{- end -}}
</div>
</div>
<script type="module">
let abbrevs = {{- $model.abbrs -}};
let ats = document.querySelectorAll('abbrev-tooltips');
if (ats) {
ats.forEach((at) => {
at.setAbbrevMap(abbrevs);
});
}
</script>

11
views/routes/components/_reihe.gohtml
View File

@@ -8,7 +8,7 @@
{{ $bds := index $relations $r.Id }}
<div class="flex flex-col lg:flex-row mb-1.5">
<div class="flex flex-col lg:flex-row mb-4">
<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 {{ if $markr }}reihen-text{{ end }}">
@@ -33,17 +33,14 @@
</a>
</div>
</div>
<div class="grow-0 lg:px-0 ml-3 lg:ml-8 -indent-3">
<div class="contents">
<div class="grow lg:px-0 ml-3 lg:ml-8">
<div class="-indent-3">
<span class="font-bold reihen-text">{{ $r.Title }}</span>
{{ if $r.Annotation }}
<span>&ensp;&middot;&ensp;</span>
<span class="{{ if $marka }}reihen-text{{ end }}">{{ Safe $r.Annotation }}</span>
{{ end }}
</div>
<div></div>
<div class="ml-3">
{{ template "_reiherelations" (Arr $r $bds $entries false) }}
</div>
{{ template "_reiherelations" (Arr $r $bds $entries false) }}
</div>
</div>

63
views/routes/components/_reiherelations.gohtml
View File

@@ -3,20 +3,49 @@
{{ $entries := index . 2 }}
{{ $shownos := index . 3 }}
{{ if $rels }}
{{ range $_, $rel := $rels }}
{{ $bd := index $entries $rel.Entry }}
{{ if $bd }}
<a href="/almanach/{{ $bd.MusenalmID }}">
{{ if ne $bd.Year 0 }}
{{ $bd.Year }}
{{ else }}
[o.J.]
{{ end }} </a
>&ensp;
{{ if $shownos }}
{{ $bd.MusenalmID }}
{{ end }}
{{ end }}
{{ end }}
{{ end }}
{{- if $rels -}}
<div class="reiherelations flex flex-col text-base font-sans w-full pt-1 -ml-3">
{{- range $_, $rel := $rels -}}
{{- $bd := index $entries $rel.Entry -}}
{{- if $bd -}}
<div class="flex flex-row odd:bg-zinc-100 px-3 py-0.5 justify-between w-full">
<a href="/almanach/{{ $bd.MusenalmID }}" class="no-underline">
<div class="">
{{- if $bd.PreferredTitle -}}
{{ $bd.PreferredTitle }}
{{- else if ne $bd.Year 0 -}}
{{- $bd.Year -}}
{{- else -}}
[o.J.]
{{- end -}}
</div>
{{- if not (eq $rel.Type "Bevorzugter Reihentitel") -}}
<div class="text-xs whitespace-nowrap">
{{- if eq $rel.Type "Früherer Reihentitel" -}}
Titelauflage aus einer anderen Reihe
{{- else if eq $rel.Type "Späterer Reihentitel" -}}
Titelauflage
{{- else if eq $rel.Type "In anderer Sprache" -}}
{{- if Contains $bd.Language "ger" -}}
In deutscher Sprache
{{- else -}}
In französischer Sprache
{{- end -}}
{{- else -}}
{{ $rel.Type }}
{{- end -}}
</div>
{{- end -}}
</a>
<div class="whitespace-nowrap align-top">
Alm
{{ $bd.MusenalmID }}
</div>
</div>
{{- end -}}
{{- end -}}
</div>
{{- end -}}

57
views/routes/person/body.gohtml
View File

@@ -1,14 +1,57 @@
{{ $model := . }}
{{ if .entries }}
<h2>Bände nach Riehentiteln</h2>
{{ range $id, $r := .series }}
<div>
{{ template "_reihe" (Arr $model $r) }}
<div class="container-normal font-serif">
{{ if $model.a.CorporateBody }}
<div class="notifier font-sans">
<i class="ri-team-line"></i>
<span class="filtercategory">Verlag, Druckerei oder Vertrieb</span>
</div>
{{ else }}
<div class="notifier font-sans">
<i class="ri-user-line"></i>
<span class="filtercategory">Person</span>
</div>
{{ end }}
{{ else }}
<div>Keine Bände</div>
<h1 class="text-3xl font-bold">{{ $model.a.Name }}</h1>
<div>
<span class="">
{{ $model.a.BiographicalData }}
</span>
<span class="">
{{- $arr := $model.a.ProfessionArray -}}
{{- if $arr -}}
{{- range $i, $p := $arr -}}
<div
class="inline-block align-middle bg-slate-200 px-2 font-sans text-sm py-0.5 rounded mx-1">
{{- $p -}}
</div>
{{- end -}}
{{- end -}}
</span>
</div>
</div>
{{ if .entries }}
<div class="container-normal flex flex-col font-serif mt-7 gap-y-6">
<h2>Bände nach Reihentiteln</h2>
{{ range $id, $r := .series }}
<div class="grow-0 max-w-[48rem]">
<div>
<span class="font-bold">{{ $r.Title }}</span>
</div>
{{ if $r.Annotation }}
<div class="max-w-[48rem]">
<span class="">{{ Safe $r.Annotation }}</span>
</div>
{{ end }}
<div class="">
{{- $bds := index $model.relations $r.Id -}}
{{ template "reiherelations" (Arr $r $bds $model.entries true $model.relations) }}
</div>
</div>
{{ end }}
</div>
{{ end }}
{{ if .contents }}

51
views/routes/person/components/reiherelations.gohtml Normal file
View File

@@ -0,0 +1,51 @@
{{ $reihe := index . 0 }}
{{ $rels := index . 1 }}
{{ $entries := index . 2 }}
{{ $shownos := index . 3 }}
{{- if $rels -}}
<div class="reiherelations flex flex-col text-base font-sans w-full pt-1 -ml-3">
{{- range $_, $rel := $rels -}}
{{- $bd := index $entries $rel.Entry -}}
{{- if $bd -}}
<div class="flex flex-row odd:bg-zinc-100 px-3 py-0.5 justify-between w-full">
<a href="/almanach/{{ $bd.MusenalmID }}" class="no-underline">
<div class="">
{{- if $bd.PreferredTitle -}}
{{ $bd.PreferredTitle }}
{{- else if ne $bd.Year 0 -}}
{{- $bd.Year -}}
{{- else -}}
[o.J.]
{{- end -}}
</div>
{{- if not (eq $rel.Type "Bevorzugter Reihentitel") -}}
<div class="text-xs whitespace-nowrap">
{{- if eq $rel.Type "Früherer Reihentitel" -}}
Titelauflage aus einer anderen Reihe
{{- else if eq $rel.Type "Späterer Reihentitel" -}}
Titelauflage
{{- else if eq $rel.Type "In anderer Sprache" -}}
{{- if Contains $bd.Language "ger" -}}
In deutscher Sprache
{{- else -}}
In französischer Sprache
{{- end -}}
{{- else -}}
{{ $rel.Type }}
{{- end -}}
</div>
{{- end -}}
</a>
<div class="whitespace-nowrap align-top">
Alm
{{ $bd.MusenalmID }}
</div>
</div>
{{- end -}}
{{- end -}}
</div>
{{- end -}}

8
views/routes/personen/body.gohtml
View File

@@ -7,25 +7,25 @@
<!-- INFO: 2. Spalten-Layout -->
<div class="flex flex-row">
<div class="flex flex-row items-stretch">
{{ template "alphabet" . }}
<!-- INFO: 3. rechte Spalte -->
<div class="w-full">
<div class="w-full self-stretch {{ if not .search -}}border-b border-zinc-300{{- end -}}">
<!-- INFO: 4. Header -->
<div id="personheader" class="border-t border-r border-zinc-300 relative w-full">
{{ template "heading" . }}
<div class="flex flex-row justify-end">
<div class="flex flex-row justify-end mt-12">
{{ template "professionselectbox" . }}
{{ template "searchbox" . }}
</div>
</div>
<!-- INFO: 4. Personenliste -->
<div class="mt-7 ml-9 mr-5 font-serif font-lg" id="searchresults">
<div class="mt-7 pl-9 pr-5 font-serif font-lg pb-7" id="searchresults">
{{ if or .agents .altagents }}
{{ if .agents }}
<div class="w-full flex flex-col">

2
views/routes/personen/components/alphabet.gohtml
View File

@@ -1,7 +1,7 @@
{{ $model := . }}
{{- if and $model.letters (not $model.search) -}}
<div id="personalphabet" class="flex flex-col text-xl pt-20 relative">
<div id="personalphabet" class="flex flex-col text-xl pt-[4.875rem] pb-4 relative">
{{- range $id, $r := .letters -}}
<a
class="{{ if not $model.letter -}}inactive{{- end -}}"

4
views/routes/personen/components/searchbox.gohtml
View File

@@ -2,7 +2,7 @@
<div class="ml-12 shrink-0 grow-0 mr-2.5">
<div class="min-w-[22.5rem] max-w-96 flex flex-row relative mt-9 ml-auto">
<div class="min-w-[22.5rem] max-w-96 flex flex-row relative ml-auto">
<div class="">
<i class="ri-search-line"></i><i class="-ml-0.5 inline-block ri-arrow-right-s-line"></i>
</div>
@@ -19,8 +19,8 @@
hx-sync="this:replace"
hx-select="#searchresults"
hx-target="#searchresults"
hx-swap="outerHTML"
autocomplete="off"
{{ if $model.active }}autofocus="true"{{ end }}
{{ if $model.search }}disabled="true"{{ end }} />
</div>
<div id="permalink" class="font-serif ml-3 min-w-7 pb-1">

11
views/routes/reihen/body.gohtml
View File

@@ -12,7 +12,7 @@
<h1 class="heading">Bände nach Reihentiteln</h1>
{{ template "notifier" . }}
{{ if not .search }}
{{ if not (or .search .hidden) }}
<div class="mt-2">
{{ template "alphabet" Dict "active" .letter "letters" .letters "search" .search }}
</div>
@@ -22,8 +22,13 @@
</div>
<!-- INFO: 2. Breite Anzeige -->
<div class="container-oversize mt-4">
{{ if not .search }}
<div
class="{{ if or .search .hidden }}
container-normal
{{ else }}
container-oversize
{{ end }} mt-4">
{{ if not (or .search .hidden) }}
{{ template "filter" . }}
{{ end }}

1
views/routes/reihen/components/alphabet.gohtml
View File

@@ -39,7 +39,6 @@
hx-select="#searchcontent"
hx-target="#searchcontent"
autocomplete="off"
{{ if $model.active }}autofocus="true"{{ end }}
{{ if $model.search }}disabled="true"{{ end }} />
</div>
<div id="permalink" class="font-serif ml-3 min-w-7 pb-1">

4
views/routes/suche/body.gohtml
View File

@@ -9,12 +9,14 @@
text-zinc-800">
Suche nach:
</div>
<!--
<a
href="/suche/reihen"
class="block no-underline"
{{ if eq $model.type "reihen" }}aria-current="page"{{- end -}}
>Reihen</a
>
-->
<a
href="/suche/baende"
class="block no-underline"
@@ -27,12 +29,14 @@
{{ if eq $model.type "beitraege" }}aria-current="page"{{- end -}}
>Beiträgen</a
>
<!--
<a
href="/suche/personen"
class="block no-underline"
{{ if eq $model.type "personen" }}aria-current="page"{{- end -}}
>Personen</a
>
-->
</nav>
<h1
class="text-3xl font-bold px-3 relative translate-y-[45%] w-min whitespace-nowrap

1
views/routes/suche/components/searchboxsimple.gohtml
View File

@@ -7,7 +7,6 @@
{{ if $model.q }}value="{{ $model.q }}"{{- end -}}
type="search"
name="q"
autofocus="true"
minlength="3"
required
placeholder="Suchbegriff (min. 3 Zeichen)"

194
views/transform/main.js
View File

@@ -13,6 +13,7 @@ const FILTER_LIST_SEARCHABLE = "filter-list-searchable";
const SCROLL_BUTTON_ELEMENT = "scroll-button";
const TOOLTIP_ELEMENT = "tool-tip";
const ABBREV_TOOLTIPS_ELEMENT = "abbrev-tooltips";
class XSLTParseProcess {
#processors;
@@ -421,12 +422,15 @@ class ScrollButton extends HTMLElement {
class ToolTip extends HTMLElement {
static get observedAttributes() {
return ["position"];
return ["position", "timeout"];
}
constructor() {
super();
this._tooltipBox = null;
this._timeout = 200;
this._hideTimeout = null;
this._hiddenTimeout = null;
}
connectedCallback() {
@@ -477,9 +481,14 @@ class ToolTip extends HTMLElement {
if (name === "position" && this._tooltipBox) {
this._updatePosition();
}
if (name === "timeout" && newValue) {
this._timeout = parseInt(newValue) || 200;
}
}
_showTooltip() {
clearTimeout(this._hideTimeout);
clearTimeout(this._hiddenTimeout);
this._tooltipBox.classList.remove("hidden");
setTimeout(() => {
this._tooltipBox.classList.remove("opacity-0");
@@ -488,13 +497,13 @@ class ToolTip extends HTMLElement {
}
_hideTooltip() {
setTimeout(() => {
this._hideTimeout = setTimeout(() => {
this._tooltipBox.classList.remove("opacity-100");
this._tooltipBox.classList.add("opacity-0");
setTimeout(() => {
this._hiddenTimeout = setTimeout(() => {
this._tooltipBox.classList.add("hidden");
}, 200);
}, 100);
}, this._timeout + 100);
}, this._timeout);
}
_updatePosition() {
@@ -557,8 +566,181 @@ class ToolTip extends HTMLElement {
}
}
class AbbreviationTooltips extends HTMLElement {
static get observedAttributes() {
return ["data-text", "data-abbrevmap"];
}
static get defaultAbbrevMap() {
return {
"#": "Hinweis auf weitere Informationen in der Anmerkung.",
$: "vermutlich",
"+++": "Inhalte aus mehreren Almanachen interpoliert",
B: "Blatt",
BB: "Blätter",
C: "Corrigenda",
Diagr: "Diagramm",
G: "Graphik",
"G-Verz": "Verzeichnis der Kupfer u. ä.",
GG: "Graphiken",
Hrsg: "Herausgeber",
"I-Verz": "Inhaltsverzeichnis",
Kal: "Kalendarium",
Kr: "Karte",
MusB: "Musikbeigabe",
MusBB: "Musikbeigaben",
S: "Seite",
SS: "Seiten",
Sp: "Spiegel",
T: "Titel",
TG: "Titelgraphik, Titelportrait etc",
"TG r": "Titelgraphik, Titelportrait etc recto",
"TG v": "Titelgraphik, Titelportrait etc verso",
Tab: "Tabelle",
UG: "Umschlaggraphik",
"UG r": "Umschlaggraphik recto",
"UG v": "Umschlaggraphik verso",
VB: "Vorsatzblatt",
Vf: "Verfasser",
VrlgM: "Verlagsmitteilung",
Vrwrt: "Vorwort",
ar: "arabische Paginierung",
ar1: "erste arabische Paginierung",
ar2: "zweite arabische Paginierung",
ar3: "dritte arabische Paginierung",
ar4: "vierte arabische Paginierung",
ar5: "fünfte arabische Paginierung",
ar6: "sechste arabische Paginierung",
ar7: "siebte arabische Paginierung",
gA: "graphische Anleitung",
gT: "graphischer Titel",
gTzA: "graphische Tanzanleitung",
nT: "Nachtitel",
röm: "römische Paginierung",
röm1: "erste römische Paginierung",
röm2: "zweite römische Paginierung",
röm3: "dritte römische Paginierung",
röm4: "vierte römische Paginierung",
röm5: "fünfte römische Paginierung",
röm6: "sechste römische Paginierung",
röm7: "siebte römische Paginierung",
vT: "Vortitel",
zT: "Zwischentitel",
"§§": "Hinweis auf Mängel im Almanach (Beschädigungen, fehlende Graphiken, unvollständige Sammlungen etc) in der Anmerkung",
};
}
constructor() {
super();
this._abbrevMap = AbbreviationTooltips.defaultAbbrevMap;
}
connectedCallback() {
this.render();
}
attributeChangedCallback(name, oldVal, newVal) {
if (oldVal !== newVal) {
if (name === "data-abbrevmap") {
this._parseAndSetAbbrevMap(newVal);
}
this.render();
}
}
_parseAndSetAbbrevMap(jsonStr) {
if (!jsonStr) {
this._abbrevMap = AbbreviationTooltips.defaultAbbrevMap;
return;
}
try {
this._abbrevMap = JSON.parse(jsonStr);
} catch {
this._abbrevMap = AbbreviationTooltips.defaultAbbrevMap;
}
}
setAbbrevMap(map) {
if (typeof map === "object" && map !== null) {
this._abbrevMap = map;
this.render();
}
}
get text() {
return this.getAttribute("data-text") || "";
}
set text(value) {
this.setAttribute("data-text", value);
}
render() {
this.innerHTML = this.transformText(this.text, this._abbrevMap);
}
transformText(text, abbrevMap) {
let result = "";
let i = 0;
while (i < text.length) {
// Only match if at start of text or preceded by a boundary character
if (i > 0 && !this.isSpaceOrPunct(text[i - 1])) {
result += text[i];
i++;
continue;
}
const matchObj = this.findLongestAbbrevAt(text, i, abbrevMap);
if (matchObj) {
const { match, meaning } = matchObj;
result += `
<tool-tip position="top" class="!inline" timeout="300">
<div class="data-tip p-2 text-sm text-white bg-gray-700 rounded shadow">
${meaning}
</div>
<span class="cursor-help text-blue-900 hover:text-slate-800">
${match}
</span>
</tool-tip>
`;
i += match.length;
} else {
result += text[i];
i++;
}
}
return result;
}
findLongestAbbrevAt(text, i, abbrevMap) {
let bestKey = null;
let bestLength = 0;
for (const key of Object.keys(abbrevMap)) {
if (text.startsWith(key, i)) {
if (key.length > bestLength) {
bestKey = key;
bestLength = key.length;
}
}
}
if (bestKey) {
return { match: bestKey, meaning: abbrevMap[bestKey] };
}
return null;
}
isSpaceOrPunct(ch) {
// Adjust if you want a different set of punctuation recognized
return /\s|[.,;:!?]/.test(ch);
}
}
customElements.define(ABBREV_TOOLTIPS_ELEMENT, AbbreviationTooltips);
customElements.define(FILTER_LIST_ELEMENT, FilterList);
customElements.define(SCROLL_BUTTON_ELEMENT, ScrollButton);
customElements.define(TOOLTIP_ELEMENT, ToolTip);
export { XSLTParseProcess, FilterList, ScrollButton };
export { XSLTParseProcess, FilterList, ScrollButton, AbbreviationTooltips };

15
views/transform/site.css
View File

@@ -312,4 +312,19 @@
#personalphabet a.inactive {
@apply !text-gray-400;
}
#entrydata .fieldlabel {
@apply font-bold text-base font-sans whitespace-nowrap w-60 grow-0 shrink-0 pt-0.5;
}
#entrydata .fieldvalue {
@apply font-serif text-left grow align-top max-w-[60ch];
}
#entrydata .entryrow {
@apply flex flex-row gap-x-3.5 items-start py-0.5 px-4;
}
#entrydata {
}
}