Fix: Edit-Button-Klick-Handler vor DOMContentLoaded ziehen

Die globale Event-Delegation lag versehentlich innerhalb
des DOMContentLoaded-Callbacks. Wenn initSortable fehlschlug,
wurde der Click-Handler nie registriert.
- editState + document click handler jetzt global (vor DOMContentLoaded)
- Duplicate Code entfernt
- Debug-alerts entfernt
This commit is contained in:
Erik Thiele
2026-07-10 16:40:59 +02:00
parent be00342109
commit b8093521a0
2 changed files with 18 additions and 75 deletions

View File

@@ -280,8 +280,7 @@
data-zoom="{{ file.zoom | default(1.0) }}"
data-site="{{ current_site }}"
data-screen="{{ screen }}"
data-oldname="{{ file.name | e }}"
onclick="alert('KLICK!');">
data-oldname="{{ file.name | e }}">
Edit
</button>
{% endif %}
@@ -538,9 +537,25 @@
</div> <!-- /page -->
<script>
/* ─── Playlist-Item bearbeiten (URL + Zoom) ─── */
var editState = { site: "", screen: "", oldName: "" };
/* Event-Delegation für Edit-Buttons (global, sofort aktiv) */
document.addEventListener("click", function (e) {
var btn = e.target.closest(".edit-url-btn");
if (!btn) return;
e.preventDefault();
editState.site = btn.dataset.site;
editState.screen = btn.dataset.screen;
editState.oldName = btn.dataset.oldname;
document.getElementById("edit-url-input").value = btn.dataset.oldname;
document.getElementById("edit-zoom-input").value = btn.dataset.zoom;
document.getElementById("edit-url-error").style.display = "none";
new bootstrap.Modal(document.getElementById("edit-url-modal")).show();
});
document.addEventListener("DOMContentLoaded", function () {
/* ─── SortableJS Drag & Drop initialisieren ─── */
function initSortable(name) {
const el = document.getElementById("playlist-" + name);
if (!el || typeof Sortable === "undefined") return;
@@ -592,77 +607,6 @@ document.addEventListener("DOMContentLoaded", function () {
return new bootstrap.Tooltip(tooltipTriggerEl);
});
/* ─── Playlist-Item bearbeiten (URL + Zoom) ─── */
var editState = { site: "", screen: "", oldName: "" };
/* Event-Delegation für Edit-Buttons (global, sofort aktiv) */
document.addEventListener("click", function (e) {
var btn = e.target.closest(".edit-url-btn");
if (!btn) return;
e.preventDefault();
alert("DEBUG: Edit geklickt - " + btn.dataset.site + "/" + btn.dataset.screen + " - " + btn.dataset.oldname);
editState.site = btn.dataset.site;
editState.screen = btn.dataset.screen;
editState.oldName = btn.dataset.oldname;
document.getElementById("edit-url-input").value = btn.dataset.oldname;
document.getElementById("edit-zoom-input").value = btn.dataset.zoom;
document.getElementById("edit-url-error").style.display = "none";
new bootstrap.Modal(document.getElementById("edit-url-modal")).show();
});
document.addEventListener("DOMContentLoaded", function () {
/* ─── SortableJS Drag & Drop initialisieren ─── */
function initSortable(name) {
const el = document.getElementById("playlist-" + name);
if (!el || typeof Sortable === "undefined") return;
new Sortable(el, {
animation: 150,
handle: ".drag-handle",
ghostClass: "bg-light",
chosenClass: "bg-light"
});
}
// Für jeden Screen eine Sortable-Instanz
{% for screen in screens.keys() %}
initSortable("{{ screen }}");
{% endfor %}
/* ─── Playlist-Reihenfolge speichern ─── */
function savePlaylist(site, screen) {
const items = document.querySelectorAll(
"#playlist-" + screen + " li"
);
const playlist = [];
const enabled = {};
items.forEach((item) => {
const checkbox = item.querySelector(".playlist-enabled");
const fileName = item.dataset.file;
enabled[fileName] = !!(checkbox && checkbox.checked);
playlist.push(fileName);
});
fetch("/admin/" + site + "/playlist/" + screen, {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({
playlist: playlist,
enabled: enabled
})
}).then(() => location.reload());
}
window.savePlaylist = savePlaylist;
/* ─── Bootstrap Tooltips initialisieren ─── */
var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
return new bootstrap.Tooltip(tooltipTriggerEl);
});
/* ─── Edit-URL-Modal: Speichern-Button ─── */
document.getElementById("edit-url-save").addEventListener("click", function () {
const newUrl = document.getElementById("edit-url-input").value.trim();

View File

@@ -258,7 +258,6 @@ document.addEventListener("click", function (e) {
var btn = e.target.closest(".edit-url-btn");
if (!btn) return;
e.preventDefault();
alert("DEBUG: Edit geklickt - " + btn.dataset.site + "/" + btn.dataset.screen + " - " + btn.dataset.oldname);
editState.site = btn.dataset.site;
editState.screen = btn.dataset.screen;
editState.oldName = btn.dataset.oldname;