Default Filternames Changed

Web/modules/database/items.py

@@ -911,9 +911,9 @@ def get_filter_names():
     if names_doc and 'names' in names_doc:
         return names_doc['names']
     return {
-        '1': 'Fach/Kategorie',
-        '2': 'System/Bereich',
-        '3': 'Typ/Art'
+        '1': 'Klasse',
+        '2': 'Fach',
+        '3': 'Schlagwort'
     }
 
 def set_filter_name(filter_num, name):

Web/templates/library_table.html

@@ -613,8 +613,200 @@
     </div>
 </div>
 <script src="https://cdn.jsdelivr.net/npm/@ericblade/quagga2/dist/quagga.js"></script>
-{% endblock %}
 <script>
+
+    // =========================================================================
+    // CUSTOM MODAL HELPERS (Replaces native browser alert, confirm & prompt)
+    // =========================================================================
+    function createModalOverlay() {
+        const overlay = document.createElement('div');
+        overlay.style.position = 'fixed';
+        overlay.style.top = '0';
+        overlay.style.left = '0';
+        overlay.style.width = '100vw';
+        overlay.style.height = '100vh';
+        overlay.style.backgroundColor = 'rgba(0, 0, 0, 0.6)';
+        overlay.style.display = 'flex';
+        overlay.style.alignItems = 'center';
+        overlay.style.justifyContent = 'center';
+        overlay.style.zIndex = '999999';
+        return overlay;
+    }
+
+    function createModalBox() {
+        const box = document.createElement('div');
+        box.style.backgroundColor = '#fff';
+        box.style.padding = '24px';
+        box.style.borderRadius = '8px';
+        box.style.boxShadow = '0 10px 25px rgba(0,0,0,0.2)';
+        box.style.fontFamily = 'sans-serif';
+        box.style.minWidth = '320px';
+        box.style.maxWidth = '90%';
+        box.style.textAlign = 'left';
+        box.style.color = '#333';
+        return box;
+    }
+
+    function customAlert(message) {
+        return new Promise((resolve) => {
+            const overlay = createModalOverlay();
+            const box = createModalBox();
+
+            const text = document.createElement('p');
+            text.textContent = message;
+            text.style.marginBottom = '20px';
+            text.style.lineHeight = '1.5';
+            text.style.whiteSpace = 'pre-wrap';
+
+            const btnContainer = document.createElement('div');
+            btnContainer.style.display = 'flex';
+            btnContainer.style.justifyContent = 'flex-end';
+
+            const btn = document.createElement('button');
+            btn.textContent = 'OK';
+            btn.style.padding = '8px 16px';
+            btn.style.cursor = 'pointer';
+            btn.style.border = 'none';
+            btn.style.backgroundColor = '#007bff';
+            btn.style.color = '#fff';
+            btn.style.borderRadius = '4px';
+
+            btn.onclick = () => {
+                document.body.removeChild(overlay);
+                resolve();
+            };
+
+            btnContainer.appendChild(btn);
+            box.appendChild(text);
+            box.appendChild(btnContainer);
+            overlay.appendChild(box);
+            document.body.appendChild(overlay);
+            btn.focus();
+        });
+    }
+
+    function customConfirm(message) {
+        return new Promise((resolve) => {
+            const overlay = createModalOverlay();
+            const box = createModalBox();
+
+            const text = document.createElement('p');
+            text.textContent = message;
+            text.style.marginBottom = '20px';
+            text.style.lineHeight = '1.5';
+            text.style.whiteSpace = 'pre-wrap';
+
+            const btnContainer = document.createElement('div');
+            btnContainer.style.display = 'flex';
+            btnContainer.style.justifyContent = 'flex-end';
+            btnContainer.style.gap = '10px';
+
+            const cancelBtn = document.createElement('button');
+            cancelBtn.textContent = 'Abbrechen';
+            cancelBtn.style.padding = '8px 16px';
+            cancelBtn.style.cursor = 'pointer';
+            cancelBtn.style.border = '1px solid #ccc';
+            cancelBtn.style.backgroundColor = '#f8f9fa';
+            cancelBtn.style.color = '#333';
+            cancelBtn.style.borderRadius = '4px';
+
+            const okBtn = document.createElement('button');
+            okBtn.textContent = 'OK';
+            okBtn.style.padding = '8px 16px';
+            okBtn.style.cursor = 'pointer';
+            okBtn.style.border = 'none';
+            okBtn.style.backgroundColor = '#007bff';
+            okBtn.style.color = '#fff';
+            okBtn.style.borderRadius = '4px';
+
+            const closeAndResolve = (val) => {
+                document.body.removeChild(overlay);
+                resolve(val);
+            };
+
+            cancelBtn.onclick = () => closeAndResolve(false);
+            okBtn.onclick = () => closeAndResolve(true);
+
+            btnContainer.appendChild(cancelBtn);
+            btnContainer.appendChild(okBtn);
+            box.appendChild(text);
+            box.appendChild(btnContainer);
+            overlay.appendChild(box);
+            document.body.appendChild(overlay);
+            okBtn.focus();
+        });
+    }
+
+    function customPrompt(message, defaultValue = '') {
+        return new Promise((resolve) => {
+            const overlay = createModalOverlay();
+            const box = createModalBox();
+
+            const text = document.createElement('p');
+            text.textContent = message;
+            text.style.marginBottom = '15px';
+            text.style.lineHeight = '1.5';
+            text.style.whiteSpace = 'pre-wrap';
+
+            const input = document.createElement('input');
+            input.type = 'text';
+            input.value = defaultValue;
+            input.style.width = '100%';
+            input.style.marginBottom = '20px';
+            input.style.padding = '10px';
+            input.style.boxSizing = 'border-box';
+            input.style.border = '1px solid #ccc';
+            input.style.borderRadius = '4px';
+
+            const btnContainer = document.createElement('div');
+            btnContainer.style.display = 'flex';
+            btnContainer.style.justifyContent = 'flex-end';
+            btnContainer.style.gap = '10px';
+
+            const cancelBtn = document.createElement('button');
+            cancelBtn.textContent = 'Abbrechen';
+            cancelBtn.style.padding = '8px 16px';
+            cancelBtn.style.cursor = 'pointer';
+            cancelBtn.style.border = '1px solid #ccc';
+            cancelBtn.style.backgroundColor = '#f8f9fa';
+            cancelBtn.style.color = '#333';
+            cancelBtn.style.borderRadius = '4px';
+
+            const okBtn = document.createElement('button');
+            okBtn.textContent = 'OK';
+            okBtn.style.padding = '8px 16px';
+            okBtn.style.cursor = 'pointer';
+            okBtn.style.border = 'none';
+            okBtn.style.backgroundColor = '#007bff';
+            okBtn.style.color = '#fff';
+            okBtn.style.borderRadius = '4px';
+
+            const closeAndResolve = (val) => {
+                document.body.removeChild(overlay);
+                resolve(val);
+            };
+
+            cancelBtn.onclick = () => closeAndResolve(null);
+            okBtn.onclick = () => closeAndResolve(input.value);
+
+            input.onkeydown = (e) => {
+                if (e.key === 'Enter') closeAndResolve(input.value);
+                if (e.key === 'Escape') closeAndResolve(null);
+            };
+
+            btnContainer.appendChild(cancelBtn);
+            btnContainer.appendChild(okBtn);
+
+            box.appendChild(text);
+            box.appendChild(input);
+            box.appendChild(btnContainer);
+            overlay.appendChild(box);
+            document.body.appendChild(overlay);
+
+            input.focus();
+            input.select();
+        });
+    }
     // =========================================================================
     // 1. GLOBAL STATE DEFINITIONS
     // =========================================================================
@@ -1242,150 +1434,8 @@
     }
 
     // =========================================================================
-    // CUSTOM MODAL HELPERS (Replaces native alert/prompt)
+    // 4. UI INTERACTIONS & UTILITIES
     // =========================================================================
-    function createModalOverlay() {
-        const overlay = document.createElement('div');
-        overlay.style.position = 'fixed';
-        overlay.style.top = '0';
-        overlay.style.left = '0';
-        overlay.style.width = '100vw';
-        overlay.style.height = '100vh';
-        overlay.style.backgroundColor = 'rgba(0, 0, 0, 0.6)';
-        overlay.style.display = 'flex';
-        overlay.style.alignItems = 'center';
-        overlay.style.justifyContent = 'center';
-        overlay.style.zIndex = '999999';
-        return overlay;
-    }
-
-    function createModalBox() {
-        const box = document.createElement('div');
-        box.style.backgroundColor = '#fff';
-        box.style.padding = '24px';
-        box.style.borderRadius = '8px';
-        box.style.boxShadow = '0 10px 25px rgba(0,0,0,0.2)';
-        box.style.fontFamily = 'sans-serif';
-        box.style.minWidth = '320px';
-        box.style.maxWidth = '90%';
-        box.style.textAlign = 'left';
-        box.style.color = '#333';
-        return box;
-    }
-
-    function customAlert(message) {
-        return new Promise((resolve) => {
-            const overlay = createModalOverlay();
-            const box = createModalBox();
-
-            const text = document.createElement('p');
-            text.textContent = message;
-            text.style.marginBottom = '20px';
-            text.style.lineHeight = '1.5';
-            text.style.whiteSpace = 'pre-wrap';
-
-            const btnContainer = document.createElement('div');
-            btnContainer.style.display = 'flex';
-            btnContainer.style.justifyContent = 'flex-end';
-
-            const btn = document.createElement('button');
-            btn.textContent = 'OK';
-            btn.style.padding = '8px 16px';
-            btn.style.cursor = 'pointer';
-            btn.style.border = 'none';
-            btn.style.backgroundColor = '#007bff';
-            btn.style.color = '#fff';
-            btn.style.borderRadius = '4px';
-
-            btn.onclick = () => {
-                document.body.removeChild(overlay);
-                resolve();
-            };
-
-            btnContainer.appendChild(btn);
-            box.appendChild(text);
-            box.appendChild(btnContainer);
-            overlay.appendChild(box);
-            document.body.appendChild(overlay);
-            btn.focus();
-        });
-    }
-
-    function customPrompt(message, defaultValue = '') {
-        return new Promise((resolve) => {
-            const overlay = createModalOverlay();
-            const box = createModalBox();
-
-            const text = document.createElement('p');
-            text.textContent = message;
-            text.style.marginBottom = '15px';
-            text.style.lineHeight = '1.5';
-            text.style.whiteSpace = 'pre-wrap';
-
-            const input = document.createElement('input');
-            input.type = 'text';
-            input.value = defaultValue;
-            input.style.width = '100%';
-            input.style.marginBottom = '20px';
-            input.style.padding = '10px';
-            input.style.boxSizing = 'border-box';
-            input.style.border = '1px solid #ccc';
-            input.style.borderRadius = '4px';
-
-            const btnContainer = document.createElement('div');
-            btnContainer.style.display = 'flex';
-            btnContainer.style.justifyContent = 'flex-end';
-            btnContainer.style.gap = '10px';
-
-            const cancelBtn = document.createElement('button');
-            cancelBtn.textContent = 'Abbrechen';
-            cancelBtn.style.padding = '8px 16px';
-            cancelBtn.style.cursor = 'pointer';
-            cancelBtn.style.border = '1px solid #ccc';
-            cancelBtn.style.backgroundColor = '#f8f9fa';
-            cancelBtn.style.color = '#333';
-            cancelBtn.style.borderRadius = '4px';
-
-            const okBtn = document.createElement('button');
-            okBtn.textContent = 'OK';
-            okBtn.style.padding = '8px 16px';
-            okBtn.style.cursor = 'pointer';
-            okBtn.style.border = 'none';
-            okBtn.style.backgroundColor = '#007bff';
-            okBtn.style.color = '#fff';
-            okBtn.style.borderRadius = '4px';
-
-            const closeAndResolve = (val) => {
-                document.body.removeChild(overlay);
-                resolve(val);
-            };
-
-            cancelBtn.onclick = () => closeAndResolve(null);
-            okBtn.onclick = () => closeAndResolve(input.value);
-
-            input.onkeydown = (e) => {
-                if (e.key === 'Enter') closeAndResolve(input.value);
-                if (e.key === 'Escape') closeAndResolve(null);
-            };
-
-            btnContainer.appendChild(cancelBtn);
-            btnContainer.appendChild(okBtn);
-
-            box.appendChild(text);
-            box.appendChild(input);
-            box.appendChild(btnContainer);
-            overlay.appendChild(box);
-            document.body.appendChild(overlay);
-
-            input.focus();
-            input.select();
-        });
-    }
-
-    // =========================================================================
-    // ORIGINAL SCRIPT (Updated to use custom modals)
-    // =========================================================================
-
     async function borrowItem(itemId) {
         const selectedItem = (libraryItems || []).find(item => item._id === itemId);
         if (selectedItem && selectedItem.LibraryDisplayStatus === 'damaged') {
@@ -1395,8 +1445,6 @@
 
         const defaultCardId = activeStudentCardId || '';
         const promptCardResult = await customPrompt('Bitte Bibliotheksausweis-ID eingeben:', defaultCardId);
-
-        // Return early if the user clicked "Cancel" (prompt returns null)
         if (promptCardResult === null) return;
 
         const cardId = promptCardResult.trim().toUpperCase();
@@ -1412,7 +1460,6 @@
         const durationInput = promptDurationResult.trim();
 
         const maxAvailable = Math.max(1, parseInt(selectedItem?.AvailableGroupedCount || selectedItem?.Quantity || 1, 10) || 1);
-
         const countPromptResult = await customPrompt(`Anzahl ausleihen? (Standard: 1, verfügbar: ${maxAvailable})`, '1');
         if (countPromptResult === null) return;
 
@@ -1432,7 +1479,7 @@
         const csrfField = document.createElement('input');
         csrfField.type = 'hidden';
         csrfField.name = 'csrf_token';
-        csrfField.value = '{{ csrf_token }}'; // Note: Template syntax remains intact
+        csrfField.value = '{{ csrf_token }}';
         form.appendChild(csrfField);
 
         const cardField = document.createElement('input');
@@ -1502,13 +1549,13 @@
         const labels = { 'book': 'Buch', 'cd': 'CD', 'dvd': 'DVD', 'other': 'Sonstige', 'schoolbook': 'Schulbuch' };
         return labels[type] || type;
     }
+
     function escapeHtml(text) {
         const div = document.createElement('div');
         div.textContent = text;
         return div.innerHTML;
     }
 
-
     function showItemDetail(itemId) {
         const detailContent = document.getElementById('detailContent');
         const detailModal = document.getElementById('detailModal');
@@ -1542,9 +1589,9 @@
                                 : `/uploads/${image}`;
 
                             return `
-                    <div class="item-image-wrapper" style="width: 100%; height: auto;">
-                        <video src="${videoSrc}" class="item-image ${index === 0 ? 'active-image' : ''}" id="modal-image-${index}" controls preload="metadata" style="width: 100%; height: auto; max-height: 300px;"></video>
-                    </div>`;
+                        <div class="item-image-wrapper" style="width: 100%; height: auto;">
+                            <video src="${videoSrc}" class="item-image ${index === 0 ? 'active-image' : ''}" id="modal-image-${index}" controls preload="metadata" style="width: 100%; height: auto; max-height: 300px;"></video>
+                        </div>`;
                         } else {
                             const imageSrc = thumbnailInfo && thumbnailInfo.has_preview
                                 ? thumbnailInfo.preview_url
@@ -1553,15 +1600,15 @@
                                     : `/uploads/${image}`);
 
                             return `
-                    <div class="item-image-wrapper">
-                        <img src="${imageSrc}"
-                             alt="Buchcover / Bild"
-                             class="item-image ${index === 0 ? 'active-image' : ''}"
-                             id="modal-image-${index}"
-                             loading="lazy"
-                             onload="console.log('Bild geladen:', '${imageSrc}')"
-                             onerror="console.error('FEHLER beim Laden des Bildes im DOM:', '${imageSrc}')">
-                    </div>`;
+                        <div class="item-image-wrapper">
+                            <img src="${imageSrc}"
+                                 alt="Buchcover / Bild"
+                                 class="item-image ${index === 0 ? 'active-image' : ''}"
+                                 id="modal-image-${index}"
+                                 loading="lazy"
+                                 onload="console.log('Bild geladen:', '${imageSrc}')"
+                                 onerror="console.error('FEHLER beim Laden des Bildes im DOM:', '${imageSrc}')">
+                        </div>`;
                         }
                     }).join('');
 
@@ -1746,3 +1793,4 @@
         window.location.href = `/item_edit/${itemId}`;
     }
 </script>
+{% endblock %}