Slight fix of the displaying of the detailed view, for the bibliothek

Web/templates/library_table.html

@@ -1331,40 +1331,34 @@
         detailContent.innerHTML = '<p>Lade Details...</p>';
         detailModal.style.display = 'flex';
 
-        // Sicherer Zugriff auf das Item mit Fallback
-        const item = libraryItems.find(i => i._id === itemId);
-        let mediaHtml = '';
-
-        if (item) {
-            // Prüfe gängige Array-Namen aus dem Backend
-            const imageArray = item.Images || item.Bilder || item.images;
-
-            if (Array.isArray(imageArray) && imageArray.length > 0) {
-                const imagesHtml = imageArray.map(image => {
-                    // Direkter, robuster Pfad zur Upload-Route
-                    const imageSrc = image.startsWith('/uploads/') || image.startsWith('http')
-                        ? image
-                        : `/uploads/${image}`;
-
-                    return `<img src="${imageSrc}" alt="${escapeHtml(item.Name || 'Medium')}" class="item-image" style="width: 120px; height: 120px; object-fit: cover; border-radius: 8px; border: 1px solid #ddd; margin-right: 15px; margin-bottom: 15px;">`;
-                }).join('');
-
-                mediaHtml = `<div class="detail-gallery-container" style="margin-bottom: 20px; padding-bottom: 15px; border-bottom: 1px solid #eee; display: flex; flex-wrap: wrap;">${imagesHtml}</div>`;
-            }
-        }
-
-        // Zusätzliche Details vom Backend laden
         fetch(`/api/item_detail/${itemId}`)
             .then(response => {
-                if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`);
+                if (!response.ok) {
-                return response.text();
+                    throw new Error('Fehler beim Laden der Artikeldetails');
+                }
+                return response.json();
             })
-            .then(html => {
+            .then(data => {
-                detailContent.innerHTML = mediaHtml + DOMPurify.sanitize(html);
+                let mediaHtml = '';
+                const imageArray = data.images || [];
+
+                if (Array.isArray(imageArray) && imageArray.length > 0) {
+                    const imagesHtml = imageArray.map(image => {
+                        const imageSrc = image.startsWith('/uploads/') || image.startsWith('http')
+                            ? image
+                            : `/uploads/${image}`;
+
+                        return `<img src="${imageSrc}" alt="Buchcover / Bild" class="item-image" style="width: 120px; height: 120px; object-fit: cover; border-radius: 8px; border: 1px solid #ddd; margin-right: 15px; margin-bottom: 15px;">`;
+                    }).join('');
+
+                    mediaHtml = `<div class="detail-gallery-container" style="margin-bottom: 20px; padding-bottom: 15px; border-bottom: 1px solid #eee; display: flex; flex-wrap: wrap;">${imagesHtml}</div>`;
+                }
+
+                detailContent.innerHTML = mediaHtml + data.html;
             })
-            .catch(err => {
+            .catch(error => {
-                console.error('Error loading detail:', err);
+                console.error('Error fetching item detail:', error);
-                detailContent.innerHTML = '<p style="color: red;">Entschuldigung, die Details konnten nicht geladen werden.</p>';
+                detailContent.innerHTML = '<p style="color: red;">Fehler beim Laden der Artikeldetails.</p>';
             });
     }