better map points

This commit is contained in:
Simon Martens
2025-09-28 19:53:36 +02:00
parent 71a623ec0e
commit 64e4cdde14
3 changed files with 145 additions and 142 deletions

View File

@@ -12,8 +12,8 @@ class $ extends HTMLElement {
setupEventListeners() {
const e = this.querySelector("#person-search"), t = this.querySelector("#authors-only"), i = this.querySelector("#all-persons"), n = this.querySelector("#authors-only-list");
!e || !t || !i || !n || (e.addEventListener("input", (s) => {
const o = s.target.value.toLowerCase().trim();
this.filterPersons(o);
const r = s.target.value.toLowerCase().trim();
this.filterPersons(r);
}), t.addEventListener("change", () => {
this.togglePersonsList();
const s = e.value.toLowerCase().trim();
@@ -30,8 +30,8 @@ class $ extends HTMLElement {
return;
i.querySelectorAll(".person-item").forEach((s) => {
var c, h;
const o = ((c = s.querySelector(".person-name")) == null ? void 0 : c.textContent) || "", r = ((h = s.querySelector(".person-life")) == null ? void 0 : h.textContent) || "";
!e || o.toLowerCase().includes(e) || r.toLowerCase().includes(e) ? s.style.display = "block" : s.style.display = "none";
const r = ((c = s.querySelector(".person-name")) == null ? void 0 : c.textContent) || "", o = ((h = s.querySelector(".person-life")) == null ? void 0 : h.textContent) || "";
!e || r.toLowerCase().includes(e) || o.toLowerCase().includes(e) ? s.style.display = "block" : s.style.display = "none";
});
}
}
@@ -43,8 +43,8 @@ class O extends HTMLElement {
const i = t.target.value.toLowerCase().trim();
this.querySelectorAll(".place-item").forEach((s) => {
var l;
const o = ((l = s.querySelector(".place-name")) == null ? void 0 : l.textContent) || "", r = !i || o.toLowerCase().includes(i);
s.style.display = r ? "block" : "none";
const r = ((l = s.querySelector(".place-name")) == null ? void 0 : l.textContent) || "", o = !i || r.toLowerCase().includes(i);
s.style.display = o ? "block" : "none";
});
});
}
@@ -57,8 +57,8 @@ class R extends HTMLElement {
const i = t.target.value.toLowerCase().trim();
this.querySelectorAll(".category-item").forEach((s) => {
var l;
const o = ((l = s.querySelector(".category-name")) == null ? void 0 : l.textContent) || "", r = !i || o.toLowerCase().includes(i);
s.style.display = r ? "block" : "none";
const r = ((l = s.querySelector(".category-name")) == null ? void 0 : l.textContent) || "", o = !i || r.toLowerCase().includes(i);
s.style.display = o ? "block" : "none";
});
});
}
@@ -87,21 +87,21 @@ class V extends HTMLElement {
e.addEventListener("change", () => {
this.updateIssueOptions(), this.updatePageInputState(), this.clearPageErrors();
}), t && t.addEventListener("change", () => {
const r = e.value, l = t.value;
r && l && (window.location.href = `/${r}/${l}`);
const o = e.value, l = t.value;
o && l && (window.location.href = `/${o}/${l}`);
}), i && i.addEventListener("change", () => {
const r = e.value, l = i.value;
r && l && (window.location.href = `/${r}/${l}`);
const o = e.value, l = i.value;
o && l && (window.location.href = `/${o}/${l}`);
}), n && (n.addEventListener("input", () => {
this.updatePageJumpButton(), this.clearPageErrors();
}), n.addEventListener("keydown", (r) => {
r.key === "Enter" && (r.preventDefault(), this.handlePageJump());
}), n.addEventListener("keydown", (o) => {
o.key === "Enter" && (o.preventDefault(), this.handlePageJump());
})), s && s.addEventListener("click", () => {
this.handlePageJump();
});
const o = this.querySelector("#page-jump-form");
o && o.addEventListener("submit", (r) => {
r.preventDefault(), this.handlePageJump();
const r = this.querySelector("#page-jump-form");
r && r.addEventListener("submit", (o) => {
o.preventDefault(), this.handlePageJump();
}), this.updateIssueOptions(), this.updatePageInputState(), this.updatePageJumpButton();
}
updateIssueOptions() {
@@ -109,14 +109,14 @@ class V extends HTMLElement {
if (!e || !t || !i)
return;
const n = e.value, s = this.issuesByYear[n] || [];
t.innerHTML = '<option value="">Nr.</option>', i.innerHTML = '<option value="">Datum</option>', s.forEach((r) => {
t.innerHTML = '<option value="">Nr.</option>', i.innerHTML = '<option value="">Datum</option>', s.forEach((o) => {
const l = document.createElement("option");
l.value = r.number, l.textContent = r.number, t.appendChild(l);
l.value = o.number, l.textContent = o.number, t.appendChild(l);
const c = document.createElement("option");
c.value = r.number, c.textContent = `${r.date} [${r.number}]`, i.appendChild(c);
c.value = o.number, c.textContent = `${o.date} [${o.number}]`, i.appendChild(c);
});
const o = s.length > 0 && n;
t.disabled = !o, i.disabled = !o;
const r = s.length > 0 && n;
t.disabled = !r, i.disabled = !r;
}
async handlePageJump() {
const e = this.querySelector("#year-select"), t = this.querySelector("#page-input"), i = this.querySelector("#jump-errors");
@@ -128,32 +128,32 @@ class V extends HTMLElement {
return;
}
try {
const o = new FormData();
o.append("year", n), o.append("page", s);
const r = await fetch("/jump", {
const r = new FormData();
r.append("year", n), r.append("page", s);
const o = await fetch("/jump", {
method: "POST",
body: o,
body: r,
redirect: "manual"
}), l = r.headers.get("HX-Redirect");
}), l = o.headers.get("HX-Redirect");
if (l) {
window.location.href = l;
return;
}
if (r.status === 302 || r.status === 301) {
const c = r.headers.get("Location");
if (o.status === 302 || o.status === 301) {
const c = o.headers.get("Location");
if (c) {
window.location.href = c;
return;
}
}
if (r.ok)
if (o.ok)
i && (i.innerHTML = "");
else {
const c = await r.text();
const c = await o.text();
i && (i.innerHTML = c);
}
} catch (o) {
console.error("Page jump failed:", o), this.showError("Fehler beim Suchen der Seite.");
} catch (r) {
console.error("Page jump failed:", r), this.showError("Fehler beim Suchen der Seite.");
}
}
showError(e) {
@@ -175,8 +175,8 @@ class V extends HTMLElement {
const e = this.querySelector("#year-select"), t = this.querySelector("#page-input"), i = this.querySelector("#page-jump-btn");
if (!e || !t || !i)
return;
const n = e.value, s = t.value && t.value.trim(), o = n && s;
i.disabled = !o;
const n = e.value, s = t.value && t.value.trim(), r = n && s;
i.disabled = !r;
}
}
customElements.define("year-jump-filter", V);
@@ -220,8 +220,8 @@ class D extends HTMLElement {
swap: "innerHTML"
}).then(() => {
console.log("HTMX request completed"), document.querySelector("#filter-container .flex.justify-center");
}).catch((o) => {
console.log("HTMX request failed:", o);
}).catch((r) => {
console.log("HTMX request failed:", r);
});
} else
this.hideFilter();
@@ -434,14 +434,14 @@ class F extends HTMLElement {
const e = document.getElementById("scrollspy-slider"), t = document.getElementById("scrollspy-nav");
if (!e || !t || e.style.opacity === "0")
return;
const i = t.getBoundingClientRect(), n = parseFloat(e.style.top), s = parseFloat(e.style.height), o = n + s, r = t.scrollTop, l = r + i.height;
if (o > l) {
const c = o - i.height + 20;
const i = t.getBoundingClientRect(), n = parseFloat(e.style.top), s = parseFloat(e.style.height), r = n + s, o = t.scrollTop, l = o + i.height;
if (r > l) {
const c = r - i.height + 20;
t.scrollTo({
top: c,
behavior: "smooth"
});
} else if (n < r) {
} else if (n < o) {
const c = n - 20;
t.scrollTo({
top: Math.max(0, c),
@@ -456,17 +456,17 @@ class F extends HTMLElement {
try {
this.sections.forEach((n) => {
if (!n || !n.getAttribute) return;
const s = n.getAttribute("id"), o = n.querySelector(".akteur-werke-section"), r = n.querySelector(".akteur-beitraege-section");
const s = n.getAttribute("id"), r = n.querySelector(".akteur-werke-section"), o = n.querySelector(".akteur-beitraege-section");
let l = !1;
if (o) {
const c = o.getBoundingClientRect(), h = c.top < window.innerHeight, d = c.bottom > 0;
h && d && (l = !0);
}
if (r && !l) {
if (r) {
const c = r.getBoundingClientRect(), h = c.top < window.innerHeight, d = c.bottom > 0;
h && d && (l = !0);
}
if (!o && !r) {
if (o && !l) {
const c = o.getBoundingClientRect(), h = c.top < window.innerHeight, d = c.bottom > 0;
h && d && (l = !0);
}
if (!r && !o) {
const c = n.querySelector("div:first-child");
if (c) {
const h = c.getBoundingClientRect(), d = h.top >= 0, u = h.bottom <= window.innerHeight;
@@ -485,13 +485,13 @@ class F extends HTMLElement {
e.includes(s) && (n.classList.add("font-medium"), t.push(n));
}), t.length > 0 && i) {
const n = document.getElementById("scrollspy-nav"), s = n.getBoundingClientRect();
let o = 1 / 0, r = -1 / 0;
let r = 1 / 0, o = -1 / 0;
t.forEach((c) => {
const h = c.getBoundingClientRect(), d = h.top - s.top + n.scrollTop, u = d + h.height;
o = Math.min(o, d), r = Math.max(r, u);
r = Math.min(r, d), o = Math.max(o, u);
});
let l = r - o;
i.style.top = `${o}px`, i.style.height = `${l}px`, i.style.opacity = "1", setTimeout(() => this.ensureMarkerVisibility(), 100);
let l = o - r;
i.style.top = `${r}px`, i.style.height = `${l}px`, i.style.opacity = "1", setTimeout(() => this.ensureMarkerVisibility(), 100);
} else i && (i.style.opacity = "0");
t.length > 0 && this.updateSidebarScroll(t);
}
@@ -509,8 +509,8 @@ class F extends HTMLElement {
if (i && (i.classList.add("font-medium"), t)) {
const n = document.getElementById("scrollspy-nav");
if (n) {
const s = n.getBoundingClientRect(), o = i.getBoundingClientRect(), r = o.top - s.top + n.scrollTop;
t.style.top = `${r}px`, t.style.height = `${o.height}px`, t.style.opacity = "1";
const s = n.getBoundingClientRect(), r = i.getBoundingClientRect(), o = r.top - s.top + n.scrollTop;
t.style.top = `${o}px`, t.style.height = `${r.height}px`, t.style.opacity = "1";
}
}
}
@@ -524,9 +524,9 @@ class F extends HTMLElement {
document.documentElement.clientHeight,
document.documentElement.scrollHeight,
document.documentElement.offsetHeight
), s = window.innerHeight, o = n - s, r = o > 0 ? window.scrollY / o : 0, l = t.clientHeight, h = t.scrollHeight - l;
), s = window.innerHeight, r = n - s, o = r > 0 ? window.scrollY / r : 0, l = t.clientHeight, h = t.scrollHeight - l;
if (h > 0) {
const d = r * h, u = i.getBoundingClientRect(), p = t.getBoundingClientRect(), m = u.top - p.top + t.scrollTop, g = l / 2, w = m - g, x = 0.7, f = x * d + (1 - x) * w, v = Math.max(0, Math.min(h, f)), E = t.scrollTop;
const d = o * h, u = i.getBoundingClientRect(), p = t.getBoundingClientRect(), m = u.top - p.top + t.scrollTop, g = l / 2, w = m - g, x = 0.7, f = x * d + (1 - x) * w, v = Math.max(0, Math.min(h, f)), E = t.scrollTop;
Math.abs(v - E) > 10 && t.scrollTo({
top: v,
behavior: "smooth"
@@ -592,8 +592,8 @@ class j extends HTMLElement {
let i = 0;
this.placeCards.forEach((n) => {
var l, c;
const s = ((l = n.getAttribute("data-place-name")) == null ? void 0 : l.toLowerCase()) || "", o = ((c = n.getAttribute("data-modern-name")) == null ? void 0 : c.toLowerCase()) || "";
e === "" || s.includes(t) || o.includes(t) ? (n.style.display = "", i++) : n.style.display = "none";
const s = ((l = n.getAttribute("data-place-name")) == null ? void 0 : l.toLowerCase()) || "", r = ((c = n.getAttribute("data-modern-name")) == null ? void 0 : c.toLowerCase()) || "";
e === "" || s.includes(t) || r.includes(t) ? (n.style.display = "", i++) : n.style.display = "none";
}), this.updateCountDisplay(i, e);
}
updateCountDisplay(e, t) {
@@ -740,15 +740,15 @@ class K extends HTMLElement {
initializeMap() {
if (!this.places.length || !this.pointsContainer)
return;
const e = { xmin: 2555e3, ymin: 135e4, xmax: 7405e3, ymax: 55e5 }, t = { lon: 10, lat: 52 }, i = (s, o) => {
const h = t.lon * Math.PI / 180, d = t.lat * Math.PI / 180, u = o * Math.PI / 180, p = s * Math.PI / 180, m = Math.sqrt(
const e = { xmin: 2555e3, ymin: 135e4, xmax: 7405e3, ymax: 55e5 }, t = { lon: 10, lat: 52 }, i = (s, r) => {
const h = t.lon * Math.PI / 180, d = t.lat * Math.PI / 180, u = r * Math.PI / 180, p = s * Math.PI / 180, m = Math.sqrt(
2 / (1 + Math.sin(d) * Math.sin(p) + Math.cos(d) * Math.cos(p) * Math.cos(u - h))
), g = 6371e3 * m * Math.cos(p) * Math.sin(u - h), w = 6371e3 * m * (Math.cos(d) * Math.sin(p) - Math.sin(d) * Math.cos(p) * Math.cos(u - h)), x = g + 4321e3, f = w + 321e4, v = e.xmax - e.xmin, E = e.ymax - e.ymin, S = (x - e.xmin) / v * 100, C = (e.ymax - f) / E * 100;
return { x: S, y: C };
}, n = [];
this.places.forEach((s) => {
if (s.lat && s.lng) {
const o = parseFloat(s.lat), r = parseFloat(s.lng), l = i(o, r);
const r = parseFloat(s.lat), o = parseFloat(s.lng), l = i(r, o);
if (l.x >= 0 && l.x <= 100 && l.y >= 0 && l.y <= 100) {
n.push(l);
const c = document.createElement("div");
@@ -765,7 +765,7 @@ class K extends HTMLElement {
e.forEach((y) => {
y.x < t && (t = y.x), y.x > i && (i = y.x), y.y < n && (n = y.y), y.y > s && (s = y.y);
});
const o = 0.06, r = i - t, l = s - n, c = r * o, h = l * o, d = Math.max(0, t - c), u = Math.min(100, i + c), p = Math.max(0, n - h), m = Math.min(100, s + h), g = u - d, w = m - p, x = 5 / 7, f = g / w;
const r = 0.06, o = i - t, l = s - n, c = o * r, h = l * r, d = Math.max(0, t - c), u = Math.min(100, i + c), p = Math.max(0, n - h), m = Math.min(100, s + h), g = u - d, w = m - p, x = 5 / 7, f = g / w;
let v = { x: d, y: p, width: g, height: w };
if (f > x) {
const y = g / x;
@@ -799,10 +799,10 @@ class K extends HTMLElement {
}));
}
setPointActive(e) {
e.className = "map-point absolute w-1.5 h-1.5 bg-red-500 border border-red-700 rounded-full shadow-md -translate-x-1/2 -translate-y-1/2 transition-all duration-300 opacity-100 saturate-100 z-20 cursor-pointer hover:w-2 hover:h-2 hover:bg-red-600 hover:z-30";
e.className = "map-point absolute w-1.5 h-1.5 bg-red-500 rounded-full shadow-sm -translate-x-1/2 -translate-y-1/2 transition-all duration-300 opacity-100 saturate-100 z-20 cursor-pointer hover:w-2 hover:h-2 hover:bg-red-600 hover:z-30", e.style.border = "0.5px solid #b91c1c";
}
setPointInactive(e) {
e.className = "map-point absolute w-[0.18rem] h-[0.18rem] bg-white opacity-[0.7] rounded-full shadow-sm -translate-x-1/2 -translate-y-1/2 transition-all duration-300 z-10 cursor-pointer hover:w-1.5 hover:h-1.5 hover:bg-red-400 hover:z-30 hover:opacity-[1.0]";
e.className = "map-point absolute w-[0.18rem] h-[0.18rem] bg-white opacity-[0.7] rounded-full shadow-sm -translate-x-1/2 -translate-y-1/2 transition-all duration-300 z-10 cursor-pointer hover:w-1.5 hover:h-1.5 hover:bg-red-400 hover:z-30 hover:opacity-[1.0]", e.style.border = "";
}
showTooltip(e) {
const t = e.target, i = t.dataset.tooltipText, n = t.dataset.placeId;
@@ -903,29 +903,29 @@ class W extends HTMLElement {
initializeMap() {
if (!this.place || !this.place.lat || !this.place.lng || !this.pointsContainer)
return;
const e = { xmin: 2555e3, ymin: 135e4, xmax: 7405e3, ymax: 55e5 }, t = { lon: 10, lat: 52 }, i = (r, l) => {
const u = t.lon * Math.PI / 180, p = t.lat * Math.PI / 180, m = l * Math.PI / 180, g = r * Math.PI / 180, w = Math.sqrt(
const e = { xmin: 2555e3, ymin: 135e4, xmax: 7405e3, ymax: 55e5 }, t = { lon: 10, lat: 52 }, i = (o, l) => {
const u = t.lon * Math.PI / 180, p = t.lat * Math.PI / 180, m = l * Math.PI / 180, g = o * Math.PI / 180, w = Math.sqrt(
2 / (1 + Math.sin(p) * Math.sin(g) + Math.cos(p) * Math.cos(g) * Math.cos(m - u))
), x = 6371e3 * w * Math.cos(g) * Math.sin(m - u), f = 6371e3 * w * (Math.cos(p) * Math.sin(g) - Math.sin(p) * Math.cos(g) * Math.cos(m - u)), v = x + 4321e3, E = f + 321e4, S = e.xmax - e.xmin, C = e.ymax - e.ymin, T = (v - e.xmin) / S * 100, P = (e.ymax - E) / C * 100;
return { x: T, y: P };
}, n = parseFloat(this.place.lat), s = parseFloat(this.place.lng), o = i(n, s);
if (o.x >= 0 && o.x <= 100 && o.y >= 0 && o.y <= 100) {
const r = document.createElement("div");
r.style.left = `${o.x}%`, r.style.top = `${o.y}%`, r.style.transformOrigin = "center", r.className = "absolute w-2 h-2 bg-red-500 border border-red-700 rounded-full shadow-md -translate-x-1/2 -translate-y-1/2 z-20";
}, n = parseFloat(this.place.lat), s = parseFloat(this.place.lng), r = i(n, s);
if (r.x >= 0 && r.x <= 100 && r.y >= 0 && r.y <= 100) {
const o = document.createElement("div");
o.style.left = `${r.x}%`, o.style.top = `${r.y}%`, o.style.transformOrigin = "center", o.className = "absolute w-2 h-2 bg-red-500 rounded-full shadow-sm -translate-x-1/2 -translate-y-1/2 z-20", o.style.border = "0.5px solid #b91c1c";
const l = `${this.place.name}${this.place.toponymName && this.place.toponymName !== this.place.name ? ` (${this.place.toponymName})` : ""}`;
r.dataset.tooltipText = l, r.addEventListener("mouseenter", (c) => this.showTooltip(c)), r.addEventListener("mouseleave", () => this.hideTooltip()), r.addEventListener("mousemove", (c) => this.updateTooltipPosition(c)), this.pointsContainer.appendChild(r), this.autoZoomToPoint(o);
o.dataset.tooltipText = l, o.addEventListener("mouseenter", (c) => this.showTooltip(c)), o.addEventListener("mouseleave", () => this.hideTooltip()), o.addEventListener("mousemove", (c) => this.updateTooltipPosition(c)), this.pointsContainer.appendChild(o), this.autoZoomToPoint(r);
}
}
autoZoomToPoint(e) {
let i = Math.max(0, e.x - 20), n = Math.min(100, e.x + 20), s = Math.max(0, e.y - 20), o = Math.min(100, e.y + 20), r = n - i, l = o - s;
const c = 5 / 7, h = r / l;
let d = { x: i, y: s, width: r, height: l };
let i = Math.max(0, e.x - 20), n = Math.min(100, e.x + 20), s = Math.max(0, e.y - 20), r = Math.min(100, e.y + 20), o = n - i, l = r - s;
const c = 5 / 7, h = o / l;
let d = { x: i, y: s, width: o, height: l };
if (h > c) {
const f = r / c;
const f = o / c;
d.y = s - (f - l) / 2, d.height = f;
} else {
const f = l * c;
d.x = i - (f - r) / 2, d.width = f;
d.x = i - (f - o) / 2, d.width = f;
}
d.x < 0 && (d.width += d.x, d.x = 0), d.y < 0 && (d.height += d.y, d.y = 0), d.x + d.width > 100 && (d.width = 100 - d.x), d.y + d.height > 100 && (d.height = 100 - d.y);
const u = 30;
@@ -1004,11 +1004,11 @@ class Y extends HTMLElement {
const t = e.toLowerCase();
let i = 0;
this.itemCards.forEach((n) => {
var o;
var r;
let s = e === "";
if (!s) {
for (const r of this.searchAttributes)
if ((((o = n.getAttribute(r.trim())) == null ? void 0 : o.toLowerCase()) || "").includes(t)) {
for (const o of this.searchAttributes)
if ((((r = n.getAttribute(o.trim())) == null ? void 0 : r.toLowerCase()) || "").includes(t)) {
s = !0;
break;
}
@@ -1147,9 +1147,9 @@ class Z extends HTMLElement {
e.style.width = t, console.log("Updated sidebar width to:", t);
}
}
show(e, t, i, n = !1, s = 0, o = null, r = null, l = null) {
show(e, t, i, n = !1, s = 0, r = null, o = null, l = null) {
const c = this.querySelector("#single-page-image"), h = this.querySelector("#page-number"), d = this.querySelector("#page-icon");
this.querySelector("#page-indicator"), c.src = e, c.alt = t, this.currentPageNumber = i, this.currentIsBeilage = n, this.currentPartNumber = o;
this.querySelector("#page-indicator"), c.src = e, c.alt = t, this.currentPageNumber = i, this.currentIsBeilage = n, this.currentPartNumber = r;
let u;
if (l)
u = l;
@@ -1164,7 +1164,7 @@ class Z extends HTMLElement {
const g = document.createElement("span");
g.className = "target-page-dot absolute -top-1 -right-1 w-3 h-3 bg-red-500 rounded-full z-10", g.title = "verlinkte Seite", h.appendChild(g);
}
r ? r === "part-number" && o !== null ? d.innerHTML = `<span class="part-number bg-slate-100 text-slate-800 font-bold px-1.5 py-0.5 rounded border border-slate-400 flex items-center justify-center">${o}. Teil</span>` : d.innerHTML = this.generateIconFromType(r) : d.innerHTML = this.generateFallbackIcon(i, n, o), this.updateNavigationButtons(), this.style.display = "block", this.setAttribute("active", "true");
o ? o === "part-number" && r !== null ? d.innerHTML = `<span class="part-number bg-slate-100 text-slate-800 font-bold px-1.5 py-0.5 rounded border border-slate-400 flex items-center justify-center">${r}. Teil</span>` : d.innerHTML = this.generateIconFromType(o) : d.innerHTML = this.generateFallbackIcon(i, n, r), this.updateNavigationButtons(), this.style.display = "block", this.setAttribute("active", "true");
const p = this.querySelector(".flex-1.overflow-auto");
p && (p.scrollTop = 0), document.body.style.overflow = "hidden", document.dispatchEvent(
new CustomEvent("singlepageviewer:opened", {
@@ -1258,15 +1258,15 @@ class Z extends HTMLElement {
"for",
this.currentIsBeilage ? "beilage" : "main"
);
const i = t.map((r) => {
const l = r.getAttribute("data-page-container"), c = l ? parseInt(l) : null;
const i = t.map((o) => {
const l = o.getAttribute("data-page-container"), c = l ? parseInt(l) : null;
return console.log("Container page:", l, "parsed:", c), c;
}).filter((r) => r !== null);
}).filter((o) => o !== null);
console.log("All pages found:", i), console.log("Current page:", this.currentPageNumber);
const n = i.indexOf(this.currentPageNumber);
console.log("Current index:", n);
let s = null, o = null;
return n > 0 && (s = i[n - 1]), n < i.length - 1 && (o = i[n + 1]), console.log("Adjacent pages - prev:", s, "next:", o), { prevPage: s, nextPage: o };
let s = null, r = null;
return n > 0 && (s = i[n - 1]), n < i.length - 1 && (r = i[n + 1]), console.log("Adjacent pages - prev:", s, "next:", r), { prevPage: s, nextPage: r };
}
// Navigate to previous page
goToPreviousPage() {
@@ -1288,14 +1288,14 @@ class Z extends HTMLElement {
if (n) {
let s = null;
this.currentPartNumber !== null && (s = this.getPartNumberForPage(e));
let o = null, r = null;
o = i.getAttribute("data-page-icon-type"), i.querySelector(".part-number") && (o = "part-number");
let r = null, o = null;
r = i.getAttribute("data-page-icon-type"), i.querySelector(".part-number") && (r = "part-number");
const c = i.querySelector(".page-indicator");
if (c) {
const h = c.cloneNode(!0);
h.querySelectorAll("i").forEach((p) => p.remove()), h.querySelectorAll(
'[class*="target-page-dot"], .target-page-indicator'
).forEach((p) => p.remove()), r = h.textContent.trim();
).forEach((p) => p.remove()), o = h.textContent.trim();
}
this.show(
n.src,
@@ -1304,8 +1304,8 @@ class Z extends HTMLElement {
this.currentIsBeilage,
0,
s,
o,
r
r,
o
), document.dispatchEvent(
new CustomEvent("singlepageviewer:pagechanged", {
detail: { pageNumber: this.currentPageNumber, isBeilage: this.currentIsBeilage }
@@ -1335,8 +1335,8 @@ class Z extends HTMLElement {
toggleSidebar() {
const e = this.querySelector("#sidebar-spacer"), t = this.querySelector("#sidebar-toggle-btn"), i = t.querySelector("i"), n = e.style.width, s = n === "0px" || n === "0";
if (console.log("Current state - isCollapsed:", s), console.log("Current width:", n), s) {
const o = this.detectSidebarWidth();
e.style.width = o, t.className = "w-10 h-10 bg-slate-100 hover:bg-slate-200 text-slate-700 border border-slate-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer", i.className = "ri-sidebar-fold-line text-lg font-bold", t.title = "Inhaltsverzeichnis ausblenden", console.log("Expanding sidebar to:", o);
const r = this.detectSidebarWidth();
e.style.width = r, t.className = "w-10 h-10 bg-slate-100 hover:bg-slate-200 text-slate-700 border border-slate-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer", i.className = "ri-sidebar-fold-line text-lg font-bold", t.title = "Inhaltsverzeichnis ausblenden", console.log("Expanding sidebar to:", r);
} else
e.style.width = "0px", t.className = "w-10 h-10 bg-orange-100 hover:bg-orange-200 text-orange-700 border border-orange-300 rounded flex items-center justify-center transition-colors duration-200 cursor-pointer", i.className = "ri-sidebar-unfold-line text-lg font-bold", t.title = "Inhaltsverzeichnis einblenden", console.log("Collapsing sidebar");
console.log("New width:", e.style.width);
@@ -1345,9 +1345,9 @@ class Z extends HTMLElement {
getIssueContext(e) {
const t = window.location.pathname, i = t.includes("/beitrag/");
if (i) {
const o = document.querySelector(`[data-page-container="${e}"]`);
if (o) {
const c = o.querySelector(".page-indicator");
const r = document.querySelector(`[data-page-container="${e}"]`);
if (r) {
const c = r.querySelector(".page-indicator");
if (c) {
const h = c.textContent.trim(), d = h.match(/(\d{1,2}\.\d{1,2}\.\d{4}\s+Nr\.\s+\d+)/);
if (d)
@@ -1367,9 +1367,9 @@ class Z extends HTMLElement {
return i ? `${n[1]} Nr. ${n[2]}` : "";
const s = document.querySelector(".page-indicator");
if (s) {
const r = s.textContent.trim().match(/(\d{4})\s+Nr\.\s+(\d+)/);
if (r)
return `${r[1]} Nr. ${r[2]}`;
const o = s.textContent.trim().match(/(\d{4})\s+Nr\.\s+(\d+)/);
if (o)
return `${o[1]} Nr. ${o[2]}`;
}
return "KGPZ";
}
@@ -1450,8 +1450,8 @@ class J extends HTMLElement {
t.forEach((i) => {
const n = i.target.getAttribute("data-page-container"), s = this.pageContainers.get(n);
if (s) {
const r = i.isIntersecting && i.intersectionRatio >= 0.5 || this.singlePageViewerActive ? "full" : "short";
s.state !== r ? (s.state = r, this.updateEntriesState(s)) : r === "full" && i.isIntersecting && i.intersectionRatio >= 0.5 && this.scrollPageIntoInhaltsverzeichnis(s);
const o = i.isIntersecting && i.intersectionRatio >= 0.5 || this.singlePageViewerActive ? "full" : "short";
s.state !== o ? (s.state = o, this.updateEntriesState(s)) : o === "full" && i.isIntersecting && i.intersectionRatio >= 0.5 && this.scrollPageIntoInhaltsverzeichnis(s);
}
});
}, {
@@ -1478,15 +1478,15 @@ class J extends HTMLElement {
}), this.highlightPageElements(e, !1));
}
highlightPageElements(e, t) {
var r;
var o;
const i = e.container.getAttribute("data-page-container"), n = this.querySelector(`[data-page-number="${i}"]`);
(r = n == null ? void 0 : n.closest(".page-entry")) == null || r.querySelector(".icon-container");
(o = n == null ? void 0 : n.closest(".page-entry")) == null || o.querySelector(".icon-container");
const s = n == null ? void 0 : n.closest(".page-entry");
s && (t ? (s.classList.add("!border-l-red-500"), s.classList.remove("border-slate-300")) : (s.classList.remove("!border-l-red-500"), s.classList.add("border-slate-300")), t && this.scrollEntryIntoView(s));
const o = document.querySelector(`[data-page="${i}"].page-indicator`);
if (o) {
const l = o.querySelectorAll("i:not(.text-slate-400)");
t ? (o.classList.add("!bg-red-50", "!text-red-600"), l.forEach((c) => c.classList.add("!text-red-600"))) : (o.classList.remove("!bg-red-50", "!text-red-600"), l.forEach((c) => c.classList.remove("!text-red-600")));
const r = document.querySelector(`[data-page="${i}"].page-indicator`);
if (r) {
const l = r.querySelectorAll("i:not(.text-slate-400)");
t ? (r.classList.add("!bg-red-50", "!text-red-600"), l.forEach((c) => c.classList.add("!text-red-600"))) : (r.classList.remove("!bg-red-50", "!text-red-600"), l.forEach((c) => c.classList.remove("!text-red-600")));
}
}
scrollEntryIntoView(e) {
@@ -1508,9 +1508,9 @@ class J extends HTMLElement {
});
return;
}
const o = t.getBoundingClientRect(), r = e.getBoundingClientRect();
if (!(r.top >= o.top && r.bottom <= o.bottom)) {
const c = t.scrollTop, h = r.top - o.top + c, d = o.height, u = r.height, p = h - (d - u) / 2;
const r = t.getBoundingClientRect(), o = e.getBoundingClientRect();
if (!(o.top >= r.top && o.bottom <= r.bottom)) {
const c = t.scrollTop, h = o.top - r.top + c, d = r.height, u = o.height, p = h - (d - u) / 2;
t.scrollTo({
top: Math.max(0, p),
behavior: "smooth"
@@ -1537,8 +1537,8 @@ class J extends HTMLElement {
this.singlePageViewerActive = e !== null;
}
isPageContainerVisible(e) {
const t = e.getBoundingClientRect(), i = window.innerHeight, n = Math.max(t.top, 0), s = Math.min(t.bottom, i), o = Math.max(0, s - n), r = t.height;
return o / r >= 0.5;
const t = e.getBoundingClientRect(), i = window.innerHeight, n = Math.max(t.top, 0), s = Math.min(t.bottom, i), r = Math.max(0, s - n), o = t.height;
return r / o >= 0.5;
}
cleanup() {
this.pageObserver && (this.pageObserver.disconnect(), this.pageObserver = null), document.removeEventListener("singlepageviewer:opened", this.boundHandleSinglePageViewer), document.removeEventListener("singlepageviewer:closed", this.boundHandleSinglePageViewer), document.removeEventListener("singlepageviewer:pagechanged", this.boundHandleSinglePageViewer), this.pageContainers.clear();
@@ -1600,17 +1600,17 @@ window.pageObserver = window.pageObserver || null;
function U(a, e, t, i = null) {
let n = document.querySelector("single-page-viewer");
n || (n = document.createElement("single-page-viewer"), document.body.appendChild(n));
const s = a.closest('[data-beilage="true"]') !== null, o = window.templateData && window.templateData.targetPage ? window.templateData.targetPage : 0, r = a.closest(".newspaper-page-container, .piece-page-container");
const s = a.closest('[data-beilage="true"]') !== null, r = window.templateData && window.templateData.targetPage ? window.templateData.targetPage : 0, o = a.closest(".newspaper-page-container, .piece-page-container");
let l = null, c = null;
if (r) {
l = r.getAttribute("data-page-icon-type"), r.querySelector(".part-number") && (l = "part-number");
const d = r.querySelector(".page-indicator");
if (o) {
l = o.getAttribute("data-page-icon-type"), o.querySelector(".part-number") && (l = "part-number");
const d = o.querySelector(".page-indicator");
if (d) {
const u = d.cloneNode(!0);
u.querySelectorAll("i").forEach((g) => g.remove()), u.querySelectorAll('[class*="target-page-dot"], .target-page-indicator').forEach((g) => g.remove()), c = u.textContent.trim();
}
}
n.show(a.src, a.alt, e, s, o, i, l, c);
n.show(a.src, a.alt, e, s, r, i, l, c);
}
function M() {
document.getElementById("pageModal").classList.add("hidden");
@@ -1624,7 +1624,7 @@ function Q() {
const n = window.currentPageContainers.indexOf(i.target);
n !== -1 && (i.isIntersecting ? e.add(n) : e.delete(n));
}), e.size > 0) {
const n = Array.from(e).sort((s, o) => s - o)[0];
const n = Array.from(e).sort((s, r) => s - r)[0];
n !== window.currentActiveIndex && (window.currentActiveIndex = n, L());
}
},
@@ -1641,7 +1641,7 @@ function ee() {
let a = -1;
const e = [];
window.currentPageContainers.forEach((i, n) => {
const s = i.getBoundingClientRect(), o = window.innerHeight, r = Math.max(s.top, 0), l = Math.min(s.bottom, o), c = Math.max(0, l - r), h = s.height;
const s = i.getBoundingClientRect(), r = window.innerHeight, o = Math.max(s.top, 0), l = Math.min(s.bottom, r), c = Math.max(0, l - o), h = s.height;
c / h >= 0.3 && e.push(n);
});
const t = Math.min(...e);
@@ -1662,7 +1662,7 @@ function te() {
let a = -1;
const e = [];
window.currentPageContainers.forEach((i, n) => {
const s = i.getBoundingClientRect(), o = window.innerHeight, r = Math.max(s.top, 0), l = Math.min(s.bottom, o), c = Math.max(0, l - r), h = s.height;
const s = i.getBoundingClientRect(), r = window.innerHeight, o = Math.max(s.top, 0), l = Math.min(s.bottom, r), c = Math.max(0, l - o), h = s.height;
c / h >= 0.3 && e.push(n);
});
const t = Math.max(...e);
@@ -1701,8 +1701,8 @@ function ie() {
function q() {
const a = [];
window.currentPageContainers.forEach((e, t) => {
const i = e.getBoundingClientRect(), n = window.innerHeight, s = Math.max(i.top, 0), o = Math.min(i.bottom, n), r = Math.max(0, o - s), l = i.height;
r / l >= 0.3 && a.push(t);
const i = e.getBoundingClientRect(), n = window.innerHeight, s = Math.max(i.top, 0), r = Math.min(i.bottom, n), o = Math.max(0, r - s), l = i.height;
o / l >= 0.3 && a.push(t);
});
for (const e of a) {
const t = window.currentPageContainers[e];
@@ -1768,8 +1768,8 @@ function se() {
const s = document.createElement("textarea");
s.value = n, document.body.appendChild(s), s.select();
try {
const o = document.execCommand("copy");
b(a, o ? "Zitation kopiert!" : "Kopieren fehlgeschlagen");
const r = document.execCommand("copy");
b(a, r ? "Zitation kopiert!" : "Kopieren fehlgeschlagen");
} catch {
b(a, "Kopieren fehlgeschlagen");
} finally {
@@ -1795,10 +1795,10 @@ function b(a, e) {
transition: opacity 0.2s ease;
white-space: nowrap;
`;
const n = a.getBoundingClientRect(), s = window.innerHeight, o = window.innerWidth;
let r = n.left - 10, l = n.bottom + 8;
const n = a.getBoundingClientRect(), s = window.innerHeight, r = window.innerWidth;
let o = n.left - 10, l = n.bottom + 8;
const c = 120, h = 32;
r + c > o && (r = n.right - c + 10), l + h > s && (l = n.top - h - 8), i.style.left = Math.max(5, r) + "px", i.style.top = Math.max(5, l) + "px", document.body.appendChild(i), setTimeout(() => {
o + c > r && (o = n.right - c + 10), l + h > s && (l = n.top - h - 8), i.style.left = Math.max(5, o) + "px", i.style.top = Math.max(5, l) + "px", document.body.appendChild(i), setTimeout(() => {
i.style.opacity = "1";
}, 10), setTimeout(() => {
i.style.opacity = "0", setTimeout(() => {
@@ -1813,8 +1813,8 @@ function oe(a, e, t = !1) {
else {
const s = window.location.pathname.split("/");
if (s.length >= 3) {
const o = s[1], r = s[2];
i = `${window.location.origin}/${o}/${r}/${a}`;
const r = s[1], o = s[2];
i = `${window.location.origin}/${r}/${o}/${a}`;
} else
i = window.location.origin + window.location.pathname + `/${a}`;
}
@@ -1829,8 +1829,8 @@ function oe(a, e, t = !1) {
const s = document.createElement("textarea");
s.value = n, document.body.appendChild(s), s.select();
try {
const o = document.execCommand("copy");
b(e, o ? "Link kopiert!" : "Kopieren fehlgeschlagen");
const r = document.execCommand("copy");
b(e, r ? "Link kopiert!" : "Kopieren fehlgeschlagen");
} catch {
b(e, "Kopieren fehlgeschlagen");
} finally {
@@ -1846,16 +1846,16 @@ function re(a, e) {
n = `${window.location.origin}/${l}/${c}/${a}`;
} else
n = `${window.location.origin}${window.location.pathname}/${a}`;
const s = n, o = (/* @__PURE__ */ new Date()).toLocaleDateString("de-DE"), r = `Königsberger Gelehrte und Politische Zeitung (KGPZ). ${t}, Seite ${a}. Digital verfügbar unter: ${s} (Zugriff: ${o}).`;
const s = n, r = (/* @__PURE__ */ new Date()).toLocaleDateString("de-DE"), o = `Königsberger Gelehrte und Politische Zeitung (KGPZ). ${t}, Seite ${a}. Digital verfügbar unter: ${s} (Zugriff: ${r}).`;
if (navigator.clipboard)
navigator.clipboard.writeText(r).then(() => {
navigator.clipboard.writeText(o).then(() => {
b(e, "Zitation kopiert!");
}).catch((l) => {
b(e, "Kopieren fehlgeschlagen");
});
else {
const l = document.createElement("textarea");
l.value = r, document.body.appendChild(l), l.select();
l.value = o, document.body.appendChild(l), l.select();
try {
const c = document.execCommand("copy");
b(e, c ? "Zitation kopiert!" : "Kopieren fehlgeschlagen");
@@ -1883,10 +1883,10 @@ function B() {
if (i === a)
n = !0;
else {
const s = a.match(/^\/(\d{4})\/(\d+)(?:\/(\d+))?$/), o = i.match(/^\/(\d{4})\/(\d+)$/);
if (s && o) {
const [, r, l, c] = s, [, h, d] = o;
r === h && l === d && (n = !0);
const s = a.match(/^\/(\d{4})\/(\d+)(?:\/(\d+))?$/), r = i.match(/^\/(\d{4})\/(\d+)$/);
if (s && r) {
const [, o, l, c] = s, [, h, d] = r;
o === h && l === d && (n = !0);
}
}
n ? (t.classList.add("text-red-700", "pointer-events-none"), t.setAttribute("aria-current", "page")) : (t.classList.remove("text-red-700", "pointer-events-none"), t.removeAttribute("aria-current"));