From b8093521a0c86898120fdb4e4495c6300be033c7 Mon Sep 17 00:00:00 2001
From: Erik Thiele <erik.thiele@cancom.de>
Date: Fri, 10 Jul 2026 16:40:59 +0200
Subject: [PATCH] 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
---
 templates/admin.html    | 92 ++++++++---------------------------------
 templates/priority.html |  1 -
 2 files changed, 18 insertions(+), 75 deletions(-)

diff --git a/templates/admin.html b/templates/admin.html
index 12b6643..bcff179 100755
--- a/templates/admin.html
+++ b/templates/admin.html
@@ -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();
diff --git a/templates/priority.html b/templates/priority.html
index 6936ce1..fa0ad43 100644
--- a/templates/priority.html
+++ b/templates/priority.html
@@ -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;