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

fix of a redirect error
Implementation of a clean up function for a stray collection processing
2026-08-16 23:50:24 +02:00 · 2026-08-16 23:21:31 +02:00 · 2026-08-16 23:08:10 +02:00 · 2026-08-16 22:50:17 +02:00 · 2026-08-16 22:19:41 +02:00 · 2026-08-16 21:23:04 +02:00
9 changed files with 1087 additions and 3088 deletions
@@ -25,6 +25,7 @@ import datetime
 import Web.modules.database.settings as cfg
 from Web.modules.database.settings import MongoClient
 import Web.modules.inventarsystem.data_protection as dp
+import logging


 def is_library_item(item):
@@ -1292,4 +1293,137 @@ def sync_group_codes(primary_obj_id, base_code, individual_codes_list):
        return True
    except Exception as e:
        print(f"Error syncing group codes: {e}")
-        return False
+        return False
+
+
+logging.basicConfig(level=logging.INFO, format='%(levelname)s: %(message)s')
+
+
+def cleanup_orphaned_images(fs, dry_run=True):
+    """
+    Finds images in GridFS that are no longer referenced by any item
+    and optionally deletes them.
+
+    Supported item fields:
+        - book_cover_image
+        - image
+        - images
+
+    The fields are expected to contain GridFS file ObjectIds.
+
+    :param fs: GridFS instance, e.g. gridfs.GridFS(db)
+    :param dry_run: If True, only reports what would be deleted.
+                    If False, actually deletes the files.
+    """
+
+    logging.info("Starte Cleanup-Skript...")
+
+    client = MongoClient(cfg.MONGODB_HOST, cfg.MONGODB_PORT)
+
+    try:
+        db = client[cfg.MONGODB_DB]
+        items_collection = db["items"]
+
+        referenced_files = set()
+
+        for item in items_collection.find(
+            {},
+            {
+                "Images": 1
+            }
+        ):
+            images = item.get("Images")
+
+            if isinstance(images, list):
+                for img in images:
+                    if img:
+                        referenced_files.add(img)
+
+        referenced_files.discard(None)
+
+        logging.info(
+            f"{len(referenced_files)} referenzierte GridFS-Dateien gefunden."
+        )
+
+        orphaned_files = []
+
+        for grid_file in fs.find():
+            file_id = grid_file._id
+            filename = grid_file.filename or ""
+
+            if not filename.lower().endswith(
+                (".jpg", ".jpeg", ".png", ".gif", ".webp")
+            ):
+                continue
+
+            if file_id not in referenced_files:
+                orphaned_files.append(
+                    {
+                        "_id": file_id,
+                        "filename": filename,
+                        "upload_date": grid_file.upload_date,
+                    }
+                )
+
+        logging.info(
+            f"Gefundene verwaiste Bilder: {len(orphaned_files)}"
+        )
+
+        if dry_run:
+            logging.info(
+                "--- DRY RUN AKTIV - Es wird nichts gelöscht ---"
+            )
+
+            for file in orphaned_files:
+                logging.info(
+                    f"Würde löschen: "
+                    f"{file['filename']} "
+                    f"(ID: {file['_id']}, "
+                    f"Hochgeladen: {file['upload_date']})"
+                )
+
+            logging.info(
+                "--- Setze dry_run=False, um physisch zu löschen ---"
+            )
+
+        else:
+            logging.warning("--- LÖSCHVORGANG AKTIV ---")
+
+            deleted_count = 0
+            failed_count = 0
+
+            for file in orphaned_files:
+                try:
+                    fs.delete(file["_id"])
+
+                    deleted_count += 1
+
+                    logging.info(
+                        f"Gelöscht: {file['filename']} "
+                        f"(ID: {file['_id']})"
+                    )
+
+                except Exception as e:
+                    failed_count += 1
+
+                    logging.error(
+                        f"Fehler beim Löschen von "
+                        f"{file['filename']} "
+                        f"(ID: {file['_id']}): {e}"
+                    )
+
+            logging.info(
+                f"Cleanup beendet. "
+                f"{deleted_count} Bilder gelöscht, "
+                f"{failed_count} Fehler."
+            )
+
+        return {
+            "status": "success",
+            "referenced_count": len(referenced_files),
+            "orphaned_count": len(orphaned_files),
+            "dry_run": dry_run,
+        }
+
+    finally:
+        client.close()
@@ -1,752 +0,0 @@
-{% extends "base.html" %}
-
-{% block title %}Bibliothek - {{ APP_VERSION }}{% endblock %}
-
-{% block content %}
-<div class="content-container">
-    <!-- Header Section -->
-    <div class="header-section">
-        <div class="header-title-group">
-            <h1>📚 Bibliothek</h1>
-            <p class="subtitle">Bücher, CDs und weitere Medien</p>
-        </div>
-    </div>
-
-    <!-- Search & Filter Section -->
-    <div class="search-filter-section">
-        <input type="text" id="searchInput" placeholder="Nach Titel, Autor, ISBN suchen..." class="search-input">
-        
-        <div class="filter-group" id="filterGroup">
-            <button class="filter-btn" id="filterBtn" aria-expanded="false" aria-label="Filter öffnen">
-                🔍 Filter <span class="filter-arrow">▼</span>
-            </button>
-            <div class="filter-dropdown" id="filterDropdown" style="display: none;">
-                <div class="filter-section">
-                    <h4>Medientyp</h4>
-                    <div class="filter-options">
-                        <label><input type="checkbox" class="filter-checkbox" data-filter="type" value="book"> Buch</label>
-                        <label><input type="checkbox" class="filter-checkbox" data-filter="type" value="cd"> CD/DVD</label>
-                        <label><input type="checkbox" class="filter-checkbox" data-filter="type" value="other"> Sonstige</label>
-                    </div>
-                </div>
-                <div class="filter-section">
-                    <h4>Status</h4>
-                    <div class="filter-options">
-                        <label><input type="checkbox" class="filter-checkbox" data-filter="status" value="available"> Verfügbar</label>
-                        <label><input type="checkbox" class="filter-checkbox" data-filter="status" value="borrowed"> Ausgeliehen</label>
-                        <label><input type="checkbox" class="filter-checkbox" data-filter="status" value="reserved"> Reserviert</label>
-                    </div>
-                </div>
-                <button id="clearFiltersBtn" class="button">Filter zurücksetzen</button>
-            </div>
-        </div>
-
-        <!-- Barcode Scanner -->
-        <button id="scannerBtn" class="scan-button" aria-expanded="false" aria-label="Scanner öffnen">
-            📱 Scanner <span class="scanner-arrow">▼</span>
-        </button>
-    </div>
-
-    <!-- Scanner Panel -->
-    <div id="qrContainer" class="qr-container" style="display: none;">
-        <div id="qr-reader" style="width: auto; height: 300px;"></div>
-        <span id="qr-result" style="display: none;"></span>
-    </div>
-
-    <!-- Table Header (only in table mode) -->
-    <div class="library-table-wrapper">
-    <div class="table-header" id="tableHeader" style="display: none;">
-        <div class="table-row">
-            <div class="table-cell title-cell">Titel</div>
-            <div class="table-cell author-cell">Autor/Künstler</div>
-            <div class="table-cell isbn-cell">ISBN/Code</div>
-            <div class="table-cell type-cell">Typ</div>
-            <div class="table-cell status-cell">Status</div>
-            <div class="table-cell actions-cell">Aktionen</div>
-        </div>
-    </div>
-
-    <!-- Items Container -->
-    <div id="itemsContainer" class="items-container">
-        {% if library_items %}
-            {% for item in library_items %}
-                <div class="item-card library-item" data-item-id="{{ item._id }}" data-type="{{ item.get('ItemType', 'book') }}" data-status="{{ 'borrowed' if item.get('Verfuegbar') == False else 'available' }}">
-                    <!-- Card Mode View -->
-                    <div class="item-content card-mode">
-                        <div class="item-image-wrapper">
-                            {% if item.get('Image') %}
-                                <img src="/uploads/{{ item.Image }}" alt="{{ item.Name }}" class="item-image">
-                            {% else %}
-                                <div class="placeholder-image">📚</div>
-                            {% endif %}
-                        </div>
-                        
-                        <div class="item-details">
-                            <h3 class="item-name">{{ item.Name }}</h3>
-                            
-                            {% if item.get('Author') %}
-                                <p class="item-author">Von: {{ item.Author }}</p>
-                            {% endif %}
-                            
-                            {% if item.get('ISBN') %}
-                                <p class="item-isbn">ISBN: {{ item.ISBN }}</p>
-                            {% endif %}
-                            
-                            <div class="item-meta">
-                                <span class="item-type">{{ item.get('ItemType', 'Medium') }}</span>
-                                <span class="item-status {% if item.get('Verfuegbar') == False %}borrowed{% else %}available{% endif %}">
-                                    {% if item.get('Verfuegbar') == False %}Ausgeliehen{% else %}Verfügbar{% endif %}
-                                </span>
-                            </div>
-                        </div>
-                    </div>
-
-                    <!-- Table Mode View -->
-                    <div class="item-content table-mode" style="display: none;">
-                        <div class="table-row">
-                            <div class="table-cell title-cell">
-                                <span class="descriptor">Titel:</span>
-                                <span class="value">{{ item.Name }}</span>
-                            </div>
-                            <div class="table-cell author-cell">
-                                <span class="descriptor">Autor:</span>
-                                <span class="value">{{ item.get('Author', '—') }}</span>
-                            </div>
-                            <div class="table-cell isbn-cell">
-                                <span class="descriptor">ISBN:</span>
-                                <span class="value">{{ item.get('ISBN', '—') }}</span>
-                            </div>
-                            <div class="table-cell type-cell">
-                                <span class="descriptor">Typ:</span>
-                                <span class="value">{{ item.get('ItemType', 'Medium') }}</span>
-                            </div>
-                            <div class="table-cell status-cell">
-                                <span class="descriptor">Status:</span>
-                                <span class="value {% if item.get('Verfuegbar') == False %}borrowed{% else %}available{% endif %}">
-                                    {% if item.get('Verfuegbar') == False %}Ausgeliehen{% else %}Verfügbar{% endif %}
-                                </span>
-                            </div>
-                            <div class="table-cell actions-cell">
-                                <button class="action-button details-btn" data-item-id="{{ item._id }}">Details</button>
-                            </div>
-                        </div>
-                    </div>
-
-                    <!-- Action Buttons (Card Mode) -->
-                    <div class="item-actions card-mode" style="display: flex;">
-                        <button class="action-button details-btn" data-item-id="{{ item._id }}">Details</button>
-                        {% if item.get('Verfuegbar') == True %}
-                            <button class="action-button borrow-btn" data-item-id="{{ item._id }}">Ausleihen</button>
-                        {% else %}
-                            <button class="action-button return-btn" data-item-id="{{ item._id }}" disabled>Ausgeliehen</button>
-                        {% endif %}
-                    </div>
-                </div>
-            {% endfor %}
-        {% else %}
-            <div class="empty-state">
-                <p>Keine Bibliotheks-Medien gefunden</p>
-            </div>
-        {% endif %}
-    </div>
-    </div>
-</div>
-
-<!-- Detail Modal -->
-<div id="detailModal" class="modal" style="display: none;">
-    <div class="modal-content">
-        <button class="modal-close" aria-label="Schließen">✕</button>
-        
-        <div class="modal-body" id="modalBody">
-            <!-- Filled by JavaScript -->
-        </div>
-    </div>
-</div>
-
-<!-- Borrow Modal -->
-<div id="borrowModal" class="modal" style="display: none;">
-    <div class="modal-content">
-        <h2>Ausleihen</h2>
-        <form id="borrowForm">
-            <input type="hidden" id="borrowItemId" name="item_id">
-            
-            <div class="form-group">
-                <label for="studentIdInput">Schülerausweis-ID (optional):</label>
-                <input type="text" id="studentIdInput" name="student_id" placeholder="Ausweis scannen oder eingeben" class="form-input">
-            </div>
-            
-            <div class="form-group">
-                <label for="borrowDaysInput">Ausleih-Dauer (Tage):</label>
-                <input type="number" id="borrowDaysInput" name="borrow_days" min="1" max="365" class="form-input" value="14">
-            </div>
-            
-            <div class="form-actions">
-                <button type="submit" class="button primary-button">Ausleihen</button>
-                <button type="button" class="button cancel-button" onclick="document.getElementById('borrowModal').style.display='none'">Abbrechen</button>
-            </div>
-        </form>
-    </div>
-</div>
-<script src="https://cdn.jsdelivr.net/npm/@ericblade/quagga2/dist/quagga.js"></script>
-<script>
-// View mode persistence
-const LIBRARY_VIEW_MODE_KEY = 'inventarLibraryViewMode';
-const MOBILE_LIBRARY_MAX_WIDTH = 900;
-const MOBILE_LIBRARY_MIN_ITEMS = 24;
-
-function isMobileViewport() {
-    return window.matchMedia(`(max-width: ${MOBILE_LIBRARY_MAX_WIDTH}px)`).matches;
-}
-
-function setViewMode(mode) {
-    localStorage.setItem(LIBRARY_VIEW_MODE_KEY, mode);
-    const container = document.getElementById('itemsContainer');
-    const tableHeader = document.getElementById('tableHeader');
-    const renderedItems = Array.from(container.querySelectorAll('.item-card'));
-    const virtualizationState = window.mobileLibraryVirtualizationState || null;
-    const detachedItems = virtualizationState && virtualizationState.active && Array.isArray(virtualizationState.items)
-        ? virtualizationState.items.filter(item => !container.contains(item))
-        : [];
-    const items = [...renderedItems, ...detachedItems.filter(item => !container.contains(item))];
-    
-    items.forEach(item => {
-        const cardContent = item.querySelector('.item-content.card-mode');
-        const cardActions = item.querySelector('.item-actions.card-mode');
-        const tableContent = item.querySelector('.item-content.table-mode');
-        
-        if (mode === 'table') {
-            if (cardContent) cardContent.style.display = 'none';
-            if (cardActions) cardActions.style.display = 'none';
-            if (tableContent) tableContent.style.display = 'block';
-        } else {
-            if (cardContent) cardContent.style.display = 'flex';
-            if (cardActions) cardActions.style.display = 'flex';
-            if (tableContent) tableContent.style.display = 'none';
-        }
-    });
-    
-    tableHeader.style.display = mode === 'table' ? 'block' : 'none';
-    
-    document.getElementById('viewModeToggle').classList.toggle('open', mode === 'table');
-}
-
-function initMobileWindowedLibraryLoading() {
-    const container = document.getElementById('itemsContainer');
-    if (!container) {
-        return;
-    }
-
-    if (!window.mobileLibraryVirtualizationState) {
-        window.mobileLibraryVirtualizationState = {
-            active: false,
-            items: [],
-            topSpacer: null,
-            bottomSpacer: null,
-            averageItemHeight: Math.max(Math.round(window.innerHeight * 0.35), 230),
-            lastStart: -1,
-            lastEnd: -1,
-            framePending: false,
-            scrollListener: null,
-            resizeListener: null,
-            initialized: false
-        };
-    }
-    const state = window.mobileLibraryVirtualizationState;
-
-    function restoreAllImages() {
-        state.items.forEach(item => {
-            const image = item.querySelector('img.item-image');
-            if (!image) {
-                return;
-            }
-
-            const originalSrc = image.dataset.mobileSrc || '';
-            if (!image.getAttribute('src') && originalSrc) {
-                image.setAttribute('src', originalSrc);
-            }
-        });
-    }
-
-    function updateImageMemory(startIndex, endIndex) {
-        const imageBuffer = 4;
-        state.items.forEach((item, index) => {
-            const image = item.querySelector('img.item-image');
-            if (!image) {
-                return;
-            }
-
-            if (!image.dataset.mobileSrc) {
-                image.dataset.mobileSrc = image.getAttribute('src') || '';
-            }
-            image.loading = 'lazy';
-            image.decoding = 'async';
-
-            const shouldKeepLoaded = index >= startIndex - imageBuffer && index < endIndex + imageBuffer;
-            if (shouldKeepLoaded) {
-                if (!image.getAttribute('src') && image.dataset.mobileSrc) {
-                    image.setAttribute('src', image.dataset.mobileSrc);
-                }
-                return;
-            }
-
-            if (image.getAttribute('src')) {
-                image.removeAttribute('src');
-            }
-        });
-    }
-
-    function renderVisibleWindow() {
-        if (!state.active || !state.topSpacer || !state.bottomSpacer) {
-            return;
-        }
-
-        const viewportHeight = window.innerHeight || 800;
-        const scrollTop = window.scrollY || window.pageYOffset || 0;
-        const renderBuffer = viewportHeight * 1.5;
-
-        let startIndex = Math.max(0, Math.floor((scrollTop - renderBuffer) / state.averageItemHeight));
-        let endIndex = Math.min(state.items.length, Math.ceil((scrollTop + viewportHeight + renderBuffer) / state.averageItemHeight));
-
-        if (endIndex - startIndex < 14) {
-            endIndex = Math.min(state.items.length, startIndex + 14);
-        }
-
-        if (startIndex === state.lastStart && endIndex === state.lastEnd) {
-            return;
-        }
-
-        state.lastStart = startIndex;
-        state.lastEnd = endIndex;
-
-        while (state.topSpacer.nextSibling && state.topSpacer.nextSibling !== state.bottomSpacer) {
-            state.topSpacer.nextSibling.remove();
-        }
-
-        const fragment = document.createDocumentFragment();
-        for (let index = startIndex; index < endIndex; index += 1) {
-            fragment.appendChild(state.items[index]);
-        }
-        container.insertBefore(fragment, state.bottomSpacer);
-
-        let measuredHeightSum = 0;
-        let measuredCount = 0;
-        for (let index = startIndex; index < endIndex; index += 1) {
-            const height = state.items[index].getBoundingClientRect().height;
-            if (height > 0) {
-                measuredHeightSum += height;
-                measuredCount += 1;
-            }
-        }
-
-        if (measuredCount > 0) {
-            const measuredAverage = measuredHeightSum / measuredCount;
-            state.averageItemHeight = Math.round((state.averageItemHeight * 3 + measuredAverage) / 4);
-        }
-
-        state.topSpacer.style.height = `${Math.max(0, startIndex * state.averageItemHeight)}px`;
-        state.bottomSpacer.style.height = `${Math.max(0, (state.items.length - endIndex) * state.averageItemHeight)}px`;
-        updateImageMemory(startIndex, endIndex);
-    }
-
-    function scheduleWindowRender() {
-        if (!state.active || state.framePending) {
-            return;
-        }
-        state.framePending = true;
-        requestAnimationFrame(() => {
-            state.framePending = false;
-            renderVisibleWindow();
-        });
-    }
-
-    function activateVirtualization() {
-        if (state.active) {
-            return;
-        }
-
-        if (!Array.isArray(state.items) || state.items.length === 0) {
-            state.items = Array.from(container.querySelectorAll('.library-item'));
-        }
-        if (state.items.length <= MOBILE_LIBRARY_MIN_ITEMS) {
-            return;
-        }
-
-        state.topSpacer = document.createElement('div');
-        state.topSpacer.className = 'mobile-window-spacer top';
-        state.bottomSpacer = document.createElement('div');
-        state.bottomSpacer.className = 'mobile-window-spacer bottom';
-
-        state.items.forEach(item => item.remove());
-        container.appendChild(state.topSpacer);
-        container.appendChild(state.bottomSpacer);
-
-        state.lastStart = -1;
-        state.lastEnd = -1;
-        state.framePending = false;
-        state.active = true;
-
-        if (!state.scrollListener) {
-            state.scrollListener = () => scheduleWindowRender();
-            window.addEventListener('scroll', state.scrollListener, { passive: true });
-        }
-
-        scheduleWindowRender();
-    }
-
-    function deactivateVirtualization() {
-        if (!state.active) {
-            if (!Array.isArray(state.items) || state.items.length === 0) {
-                state.items = Array.from(container.querySelectorAll('.library-item'));
-            }
-            return;
-        }
-
-        if (state.scrollListener) {
-            window.removeEventListener('scroll', state.scrollListener);
-            state.scrollListener = null;
-        }
-
-        if (state.topSpacer && state.topSpacer.parentNode === container) {
-            state.topSpacer.remove();
-        }
-        if (state.bottomSpacer && state.bottomSpacer.parentNode === container) {
-            state.bottomSpacer.remove();
-        }
-
-        const fragment = document.createDocumentFragment();
-        state.items.forEach(item => fragment.appendChild(item));
-        container.appendChild(fragment);
-
-        restoreAllImages();
-
-        state.topSpacer = null;
-        state.bottomSpacer = null;
-        state.lastStart = -1;
-        state.lastEnd = -1;
-        state.framePending = false;
-        state.active = false;
-
-        const currentMode = localStorage.getItem(LIBRARY_VIEW_MODE_KEY) || 'card';
-        setViewMode(currentMode);
-    }
-
-    function syncVirtualizationWithViewport() {
-        if (!Array.isArray(state.items) || state.items.length === 0) {
-            state.items = Array.from(container.querySelectorAll('.library-item'));
-        }
-
-        const shouldVirtualize = isMobileViewport() && state.items.length > MOBILE_LIBRARY_MIN_ITEMS;
-        if (shouldVirtualize) {
-            activateVirtualization();
-            scheduleWindowRender();
-        } else {
-            deactivateVirtualization();
-        }
-    }
-
-    if (!state.initialized) {
-        state.resizeListener = () => syncVirtualizationWithViewport();
-        window.addEventListener('resize', state.resizeListener, { passive: true });
-        state.initialized = true;
-    }
-
-    syncVirtualizationWithViewport();
-}
-
-// Initialize view mode
-document.addEventListener('DOMContentLoaded', function() {
-    const savedMode = localStorage.getItem(LIBRARY_VIEW_MODE_KEY) || 'card';
-    setViewMode(savedMode);
-    
-    document.getElementById('viewModeToggle').addEventListener('click', function() {
-        const currentMode = localStorage.getItem(LIBRARY_VIEW_MODE_KEY) || 'card';
-        const newMode = currentMode === 'card' ? 'table' : 'card';
-        setViewMode(newMode);
-    });
-    
-    // Details button handlers
-    document.querySelectorAll('.details-btn').forEach(btn => {
-        btn.addEventListener('click', function(e) {
-            e.preventDefault();
-            const itemId = this.dataset.itemId;
-            fetch(`/get_item_details/${itemId}`)
-                .then(r => r.json())
-                .then(data => {
-                    if (data.success) {
-                        displayLibraryItemDetail(data.item);
-                        document.getElementById('detailModal').style.display = 'flex';
-                    }
-                });
-        });
-    });
-    
-    // Borrow button handlers
-    document.querySelectorAll('.borrow-btn').forEach(btn => {
-        btn.addEventListener('click', function() {
-            document.getElementById('borrowItemId').value = this.dataset.itemId;
-            document.getElementById('borrowModal').style.display = 'flex';
-        });
-    });
-    
-    // Borrow form submit
-    document.getElementById('borrowForm').addEventListener('submit', function(e) {
-        e.preventDefault();
-        const itemId = document.getElementById('borrowItemId').value;
-        const studentId = document.getElementById('studentIdInput').value || null;
-        const borrowDays = document.getElementById('borrowDaysInput').value || 14;
-        
-        fetch('/borrow_item', {
-            method: 'POST',
-            headers: {'Content-Type': 'application/json'},
-            body: JSON.stringify({
-                item_id: itemId,
-                student_id: studentId,
-                borrow_days: borrowDays
-            })
-        })
-        .then(r => r.json())
-        .then(data => {
-            if (data.success) {
-                alert('Erfolgreich ausgeliehen!');
-                location.reload();
-            } else {
-                alert('Fehler: ' + data.message);
-            }
-        });
-    });
-    
-    // Modal close handlers
-    document.querySelectorAll('.modal-close').forEach(btn => {
-        btn.addEventListener('click', function() {
-            this.closest('.modal').style.display = 'none';
-        });
-    });
-    
-    // Close modals on outside click
-    document.querySelectorAll('.modal').forEach(modal => {
-        modal.addEventListener('click', function(e) {
-            if (e.target === this) this.style.display = 'none';
-        });
-    });
-
-    initMobileWindowedLibraryLoading();
-});
-
-function displayLibraryItemDetail(item) {
-    const modalBody = document.getElementById('modalBody');
-    const returnBtn = item.Verfuegbar === false ? `<button class="action-button return-btn" onclick="returnItem('${item._id}')">Zurückgeben</button>` : '';
-    const borrowBtn = item.Verfuegbar === true ? `<button class="action-button borrow-btn" onclick="openBorrowModal('${item._id}')">Ausleihen</button>` : '';
-    
-    modalBody.innerHTML = `
-        <h2>${item.Name}</h2>
-        <div class="detail-content">
-            ${item.Image ? `<img src="/uploads/${item.Image}" alt="${item.Name}" style="max-width: 200px; margin-bottom: 20px;">` : ''}
-            <p><strong>Autor:</strong> ${item.Author || '—'}</p>
-            <p><strong>ISBN:</strong> ${item.ISBN || '—'}</p>
-            <p><strong>Typ:</strong> ${item.ItemType || 'Medium'}</p>
-            <p><strong>Status:</strong> ${item.Verfuegbar === false ? 'Ausgeliehen' : 'Verfügbar'}</p>
-            ${item.User ? `<p><strong>Ausgeliehen von:</strong> ${item.User}</p>` : ''}
-            ${item.Beschreibung ? `<p><strong>Beschreibung:</strong> ${item.Beschreibung}</p>` : ''}
-            <div class="modal-actions">
-                ${borrowBtn}
-                ${returnBtn}
-            </div>
-        </div>
-    `;
-}
-
-function openBorrowModal(itemId) {
-    document.getElementById('borrowItemId').value = itemId;
-    document.getElementById('borrowModal').style.display = 'flex';
-    document.getElementById('detailModal').style.display = 'none';
-}
-
-function returnItem(itemId) {
-    if (confirm('Wirklich zurückgeben?')) {
-        fetch('/return_item', {
-            method: 'POST',
-            headers: {'Content-Type': 'application/json'},
-            body: JSON.stringify({item_id: itemId})
-        })
-        .then(r => r.json())
-        .then(data => {
-            if (data.success) {
-                alert('Erfolgreich zurückgegeben!');
-                location.reload();
-            }
-        });
-    }
-}
-
-// Filter dropdown toggle with auto-close
-function closeAllFilters() {
-    document.querySelectorAll('.filter-dropdown').forEach(d => d.style.display = 'none');
-    document.getElementById('filterBtn').setAttribute('aria-expanded', 'false');
-    document.getElementById('filterBtn').classList.remove('open');
-}
-
-document.getElementById('filterBtn').addEventListener('click', function(e) {
-    e.stopPropagation();
-    const dropdown = document.getElementById('filterDropdown');
-    const isOpen = dropdown.style.display !== 'none';
-    closeAllFilters();
-    if (!isOpen) {
-        dropdown.style.display = 'block';
-        this.setAttribute('aria-expanded', 'true');
-        this.classList.add('open');
-    }
-});
-
-document.addEventListener('click', closeAllFilters);
-document.getElementById('filterDropdown').addEventListener('click', e => e.stopPropagation());
-
-// Clear filters
-document.getElementById('clearFiltersBtn').addEventListener('click', function() {
-    document.querySelectorAll('.filter-checkbox').forEach(c => c.checked = false);
-    closeAllFilters();
-});
-
-// Scanner toggle
-// Scanner state tracking
-let isScanning = false; 
-
-document.getElementById('scannerBtn').addEventListener('click', function(e) {
-    e.stopPropagation();
-    const container = document.getElementById('qrContainer');
-    const isOpen = container.style.display !== 'none';
-    const btn = this;
-    
-    if (isOpen) {
-        // Close the scanner
-        container.style.display = 'none';
-        Quagga.stop();
-        isScanning = false;
-        
-        btn.classList.remove('open');
-        btn.setAttribute('aria-expanded', 'false');
-    } else {
-        // Open the scanner
-        container.style.display = 'block';
-        btn.classList.add('open');
-        btn.setAttribute('aria-expanded', 'true');
-        
-        Quagga.init({
-            inputStream: {
-                name: "Live",
-                type: "LiveStream",
-                // Targets the element where the video stream will inject
-                target: document.querySelector('#qr-reader'), 
-                constraints: {
-                    width: 640,
-                    height: 480,
-                    facingMode: "environment" // Forces back camera
-                },
-            },
-            decoder: {
-                // Optimized for 1D barcodes (e.g., student IDs, member cards)
-                readers: ["code_128_reader", "ean_reader", "code_39_reader", "upc_reader"]
-            } 
-        }, function(err) {
-            if (err) {
-                console.error("Initialization error:", err);
-                alert("Kamera konnte nicht gestartet werden.");
-                return;
-            }
-            Quagga.start();
-            isScanning = true;
-        });
-    }
-});
-
-// Single Quagga event listener for successful scans
-Quagga.onDetected(function(data) {
-    const decodedText = data.codeResult.code;
-    const studentId = String(decodedText || '').trim();
-    
-    // Stop scanning immediately to prevent multiple triggers
-    Quagga.stop();
-    isScanning = false;
-    
-    // Reset UI states to closed
-    const container = document.getElementById('qrContainer');
-    const btn = document.getElementById('scannerBtn');
-    if (container) container.style.display = 'none';
-    if (btn) {
-        btn.classList.remove('open');
-        btn.setAttribute('aria-expanded', 'false');
-    }
-    
-    // Route the scanned data to your input
-    document.getElementById('studentIdInput').value = studentId;
-    alert('Ausweis gescannt: ' + studentId);
-});
-</script>
-
-<style>
-.library-item .item-image-wrapper {
-    width: 120px;
-    height: 160px;
-    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-    border-radius: 8px;
-    overflow: hidden;
-    flex-shrink: 0;
-}
-
-.library-item .placeholder-image {
-    width: 100%;
-    height: 100%;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    font-size: 48px;
-    color: white;
-}
-
-.library-item .item-author {
-    font-size: 0.9rem;
-    color: #666;
-    margin: 4px 0;
-}
-
-.library-item .item-isbn {
-    font-size: 0.85rem;
-    color: #999;
-    font-family: monospace;
-    margin: 4px 0;
-}
-
-.library-item .item-type {
-    display: inline-block;
-    background: #e8f0fe;
-    color: #1967d2;
-    padding: 2px 8px;
-    border-radius: 4px;
-    font-size: 0.8rem;
-}
-
-.library-item .item-status.available {
-    background: #e6f4ea;
-    color: #137333;
-}
-
-.library-item .item-status.borrowed {
-    background: #fce8e6;
-    color: #b3261e;
-}
-
-/* Mobile: allow horizontal scrolling for table-mode views */
-@media (max-width: 900px) {
-    .library-table-wrapper {
-        overflow-x: auto;
-        -webkit-overflow-scrolling: touch;
-        width: 100%;
-    }
-    .library-table-wrapper .table-row {
-        min-width: 720px; /* allow table to have intrinsic width and be scrolled */
-    }
-    .table-header, .item-content.table-mode {
-        display: block; /* keep rows stacked but allow horizontal scroll */
-    }
-}
-</style>
-{% endblock %}
@@ -819,7 +819,7 @@
        flex: 0 0 auto;
    }

-    .ausleihen, .edit-button, .delete-button, .details-button, .duplicate-button, .schedule-button, .damage-button {
+    .ausleihen, .edit-button, .delete-button, .details-button,  .schedule-button, .damage-button {
        padding: 10px 18px;
        border: none;
        border-radius: 5px;
@@ -942,27 +942,6 @@
        box-shadow: 0 2px 4px rgba(23, 162, 184, 0.3);
    }

-    /* Duplicate Button */
-    .duplicate-button {
-        background-color: #6f42c1;
-        color: white;
-        border: 2px solid #6f42c1;
-    }
-
-    .duplicate-button:hover {
-        background-color: #5a32a3;
-        border-color: #4e2a8e;
-        transform: translateY(-1px);
-        box-shadow: 0 4px 8px rgba(111, 66, 193, 0.3);
-        color: white;
-        text-decoration: none;
-    }
-
-    .duplicate-button:active {
-        transform: translateY(0);
-        box-shadow: 0 2px 4px rgba(111, 66, 193, 0.3);
-    }
-
    .damage-button {
        background-color: #fd7e14;
        color: white;
@@ -1645,7 +1624,7 @@
            gap: 10px !important;
        }
        
-        .ausleihen, .edit-button, .delete-button, .details-button, .duplicate-button, .schedule-button {
+        .ausleihen, .edit-button, .delete-button, .details-button, .schedule-button {
            width: 100% !important;
            min-height: 44px !important;
            padding: 12px 20px !important;
@@ -1777,7 +1756,7 @@
            justify-content: flex-start;
        }
        
-        .ausleihen, .edit-button, .delete-button, .details-button, .duplicate-button, .schedule-button {
+        .ausleihen, .edit-button, .delete-button, .details-button, .schedule-button {
            padding: 10px 20px;
            font-size: 0.9rem;
            min-width: 110px;
@@ -1790,7 +1769,7 @@
                gap: 8px;
            }
            
-            .ausleihen, .edit-button, .delete-button, .details-button, .duplicate-button, .schedule-button {
+            .ausleihen, .edit-button, .delete-button, .details-button, .schedule-button {
                padding: 8px 16px;
                font-size: 0.85rem;
                min-width: 95px;
@@ -1808,7 +1787,7 @@
            gap: 15px;
        }
        
-        .ausleihen, .edit-button, .delete-button, .details-button, .duplicate-button, .schedule-button {
+        .ausleihen, .edit-button, .delete-button, .details-button, .schedule-button {
            padding: 12px 24px;
            font-size: 1rem;
            min-width: 120px;
@@ -1980,7 +1959,7 @@
    }
    
    /* Standardize form and document buttons */
-    .save-button, .cancel-button, .remove-book-cover-button, .remove-duplicate-image-button,
+    .save-button, .cancel-button, .remove-book-cover-button,
    .import-book-button, .fetch-isbn-button, .nav-back-button {
        display: inline-flex;
        align-items: center;
@@ -3465,9 +3444,6 @@ document.addEventListener('DOMContentLoaded', ()=>{
                                {% if current_permissions.actions.get('can_edit', False) %}
                                <button class="edit-button" onclick="openEditModalForSelectedUnit('${item._id}', 'specific-item-card-${item._id}')">Bearbeiten</button>
                                {% endif %}
-                                {% if current_permissions.actions.get('can_insert', False) %}
-                                <button class="duplicate-button" onclick="duplicateItem('${item._id}')">Duplizieren</button>
-                                {% endif %}
                                {% if current_permissions.pages.get('admin_school_settings', False) %}
                                ${canScheduleItem ? `<button class="schedule-button" onclick="openScheduleModal('${item._id}')">Reservieren</button>` : ''}
                                {% endif %}
@@ -4244,7 +4220,6 @@ document.addEventListener('DOMContentLoaded', ()=>{
                    : `<button class="ausleihen disabled-button" disabled>Ausgeliehen</button>`
                }
                <button class="edit-button" onclick="openEditModalForSelectedUnit('${item._id}', 'specific-item-modal-${item._id}')">Bearbeiten</button>
-                <button class="duplicate-button" onclick="duplicateItem('${item._id}')">Duplizieren</button>
                ${damageReports && damageReports.length > 0 ? `<button class="damage-button" onclick="markDamageAsRepaired('${item._id}')">Repariert</button>` : `<button class="damage-button" onclick="registerDamage('${item._id}')">Schaden melden</button>`}
                ${canScheduleItem ? `<button class="schedule-button" onclick="openScheduleModal('${item._id}')">Reservieren</button>` : ''}
                <form method="POST" action="/delete_item/${item._id}" style="display:inline;" onsubmit="return confirm('Sind Sie sicher?')">
@@ -5044,55 +5019,6 @@ document.addEventListener('DOMContentLoaded', ()=>{
        }
    }

-
-    // Duplication function
-    function duplicateItem(itemId) {
-        // Show loading indicator
-        const loadingDiv = document.createElement('div');
-        loadingDiv.innerHTML = `
-            <div style="position: fixed; top: 0; left: 0; width: 100%; height: 100%; 
-                        background: rgba(0,0,0,0.5); z-index: 10000; display: flex; 
-                        align-items: center; justify-content: center;">
-                <div class="modal-dialog-white">
-                    <div>Element wird dupliziert...</div>
-                    <div class="modal-content-margin">
-                        <div class="spinner"></div>
-                    </div>
-                </div>
-            </div>
-        `;
-        document.body.appendChild(loadingDiv);
-
-        // Create form data for the duplicate_item request
-        const formData = new FormData();
-        formData.append('original_item_id', itemId);
-
-        // Send duplication request to get item data
-        fetch('/duplicate_item', {
-            method: 'POST',
-            body: formData
-        })
-        .then(response => response.json())
-        .then(data => {
-            document.body.removeChild(loadingDiv);
-            
-            if (data.success) {
-                // Store duplication data in sessionStorage for the upload page
-                sessionStorage.setItem('duplicateItemData', JSON.stringify(data.item_data));
-                
-                // Redirect to upload admin page
-                window.location.href = '/upload_admin?duplicate=true';
-            } else {
-                alert('Fehler beim Duplizieren: ' + (data.message || 'Unbekannter Fehler'));
-            }
-        })
-        .catch(error => {
-            document.body.removeChild(loadingDiv);
-            console.error('Error duplicating item:', error);
-            alert('Fehler beim Duplizieren des Elements. Bitte versuchen Sie es erneut.');
-        });
-    }
-
    // Helper functions for appointment display
    function formatAppointmentDate(dateString) {
        if (!dateString) return '';
@@ -11,7 +11,7 @@
 <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Schülerausweis - Barcode PDF Download</title>
+    <title>Bibliotheksausweis - Barcode PDF Download</title>
    <style>
        * {
            margin: 0;
@@ -123,7 +123,7 @@
 <body>
    <div class="container">
        <div class="icon">📇</div>
-        <h1>Schülerausweis-Download</h1>
+        <h1>Bibliotheksausweis-Download</h1>
        <p>Generieren Sie eine PDF mit Barcodes aller Bibliotheksausweise zum direkten Drucken</p>

        <div class="info-box">
@@ -232,6 +232,16 @@
            <h1>📚 Bibliotheksausweise (Bibliothek)</h1>
        </div>
        <div class="export-buttons">
+            <form method="GET" action="{{ url_for('student_card_class_barcode_download') }}" style="display: inline-flex; gap: 5px; align-items: center; background: white; padding: 2px; border-radius: 4px; border: 1px solid #ddd;">
+                <select name="class_name" required style="border: none; padding: 8px; outline: none; font-size: 14px; background: transparent; cursor: pointer;">
+                    <option value="" disabled selected>-- Klasse wählen --</option>
+                    {% for cls in available_classes %}
+                        <option value="{{ cls }}">{{ cls }}</option>
+                    {% endfor %}
+                </select>
+                <button type="submit" class="btn-print" style="background: #17a2b8; padding: 8px 12px; margin: 0;">📤 PDF</button>
+            </form>
+
            <a href="{{ url_for('student_card_barcode_download') }}" class="btn-print" style="background: #28a745;">📥 Alle Ausweise (PDF)</a>
            <a href="{{ url_for('library_admin') }}" class="btn btn-primary">← Zur Bibliotheks-Upload</a>
        </div>
@@ -249,7 +259,7 @@

    <!-- Add/Edit Form -->
    <div class="student-card-form">
-        <h2>{% if edit_mode %}Ausweis bearbeiten{% else %}Neuer Schülerausweis{% endif %}</h2>
+        <h2>{% if edit_mode %}Ausweis bearbeiten{% else %}Neuer Bibliotheksausweis{% endif %}</h2>
        
        <form method="POST" action="{{ url_for('student_cards_admin') }}">
            {% if edit_mode %}
@@ -283,9 +293,15 @@
                </div>
                <div class="form-group">
                    <label for="class_name">Klasse</label>
-                    <input type="text" id="class_name" name="class_name"
+                    <input type="text" id="class_name" name="class_name" list="class_list"
                           value="{{ form_data.get('class_name', '') }}"
-                           placeholder="z.B. 10A">
+                           placeholder="z.B. 10A (Tippen oder Auswählen)">
+
+                    <datalist id="class_list">
+                        {% for cls in available_classes %}
+                            <option value="{{ cls }}">
+                        {% endfor %}
+                    </datalist>
                </div>
            </div>

@@ -11,59 +11,6 @@
 {% block title %}{{ page_title|default('Artikel hochladen') }} - Inventarsystem{% endblock %}

 {% block content %}
-{% if duplicate_data and duplicate_data.images %}
-<!-- Hidden server-side values for duplication, will be processed by JavaScript -->
-<div id="server-duplicate-data" 
-     data-name="{{ duplicate_data.name|default('') }}"
-     data-description="{{ duplicate_data.description|default('') }}"
-     data-location="{{ duplicate_data.location|default('') }}"
-     data-room="{{ duplicate_data.room|default('') }}"
-     data-year="{{ duplicate_data.year|default('') }}"
-     data-cost="{{ duplicate_data.cost|default('') }}"
-     data-images="{{ duplicate_data.images|tojson|safe }}"
-     data-filter1="{{ duplicate_data.filter1|tojson|safe if duplicate_data.filter1 else '[]' }}"
-     data-filter2="{{ duplicate_data.filter2|tojson|safe if duplicate_data.filter2 else '[]' }}"
-     data-filter3="{{ duplicate_data.filter3|tojson|safe if duplicate_data.filter3 else '[]' }}"
-     data-original-id="{{ duplicate_data.original_id|default('') }}"
-     style="display:none;">
-</div>
-<script>
-    // Pre-initialize duplicate data from server
-    var serverDuplicateData = null;
-    const dataElement = document.getElementById('server-duplicate-data');
-    if (dataElement) {
-        // Safely parse JSON arrays with error handling
-        function safeJsonParse(jsonStr, defaultValue = []) {
-            try {
-                if (!jsonStr) return defaultValue;
-                return JSON.parse(jsonStr);
-            } catch (e) {
-                console.error("Error parsing JSON:", e, "Value was:", jsonStr);
-                return defaultValue;
-            }
-        }
-        
-        // Get images data and log it for debugging
-        const imagesData = dataElement.getAttribute('data-images') || "[]";
-        console.log("Raw images data attribute:", imagesData);
-        
-        serverDuplicateData = {
-            name: dataElement.getAttribute('data-name') || "",
-            description: dataElement.getAttribute('data-description') || "",
-            location: dataElement.getAttribute('data-location') || "",
-            room: dataElement.getAttribute('data-room') || "",
-            year: dataElement.getAttribute('data-year') || "",
-            cost: dataElement.getAttribute('data-cost') || "",
-            images: safeJsonParse(imagesData),
-            filter1: safeJsonParse(dataElement.getAttribute('data-filter1')),
-            filter2: safeJsonParse(dataElement.getAttribute('data-filter2')),
-            filter3: safeJsonParse(dataElement.getAttribute('data-filter3')),
-            original_id: dataElement.getAttribute('data-original-id') || ""
-        };
-        console.log("Server-provided duplicate data:", serverDuplicateData);
-    }
-</script>
-{% endif %}

 <style>
    /* Book information display styles */
@@ -296,38 +243,11 @@
        color: #721c24 !important;
    }

-    /* Duplicate code popup styling */
-    .popup-overlay {
-        position: fixed;
-        top: 0;
-        left: 0;
-        width: 100%;
-        height: 100%;
-        background-color: rgba(0, 0, 0, 0.6);
-        z-index: 10000;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        animation: overlayFadeIn 0.3s ease;
-    }
-
    @keyframes overlayFadeIn {
        from { opacity: 0; }
        to { opacity: 1; }
    }

-    .duplicate-code-popup {
-        background-color: white;
-        padding: 30px;
-        border-radius: 8px;
-        box-shadow: 0 5px 20px rgba(0, 0, 0, 0.3);
-        max-width: 500px;
-        width: 90%;
-        text-align: center;
-        position: relative;
-        animation: popupSlideIn 0.3s ease;
-    }
-
    @keyframes popupSlideIn {
        from { 
            opacity: 0; 
@@ -916,7 +836,7 @@
                            <!-- Options will be loaded by JavaScript -->
                        </select>
                    </div>
-                    <div class="formupload_admin-group">
+                    <div class="form-group">
                        <label for="filter2-4">Wert 4:</label>
                        <select id="filter2-4" name="filter2" class="filter-dropdown-select">
                            <option value="">-- Optional --</option>
@@ -956,12 +876,14 @@
            </div>


-            <!-- Image upload (hidden for library mode) -->
            <div class="form-group">
-                <label for="images">Bilder/Videos:</label>
-                <input type="file" id="images" name="images" accept=".jpg, .jpeg, .png, .gif, .mp4, .mov, .avi, .mkv, .webm, .flv, .m4v, .3gp" multiple>
-                <div class="allowed-formats">Erlaubte Formate: JPG, JPEG, PNG, GIF, MP4, MOV, AVI, MKV, WEBM, FLV, M4V, 3GP</div>
-                <!-- Add image preview area -->
+                <label>Buchcover (automatisch):</label>
+                <div id="book-cover-preview-container"></div>
+            </div>
+            <div class="form-group">
+                <label for="images"> Bilder hinzufügen:</label>
+                <input type="file" id="images" name="images" accept=".jpg, .jpeg, .png, .gif" multiple>
+                <div class="allowed-formats">Erlaubte Formate: JPG, JPEG, PNG, GIF</div>
                <div class="image-preview-container" id="image-preview-container"></div>
            </div>

@@ -1749,23 +1671,24 @@
        }, 3000);
    }

-    // Function to download book cover image
    function downloadBookCover(imageUrl) {
        if (!imageUrl) {
            console.log('No image URL provided');
            return;
        }
-        
-        // Show loading indicator for image download
-        const imagePreviewContainer = document.getElementById('image-preview-container');
-        if (imagePreviewContainer) {
-            const loadingDiv = document.createElement('div');
-            loadingDiv.className = 'image-loading';
-            loadingDiv.innerHTML = '<div class="loading-spinner">Buchcover wird heruntergeladen...</div>';
-            imagePreviewContainer.appendChild(loadingDiv);
+
+        const coverPreviewContainer = document.getElementById('book-cover-preview-container');
+
+        if (!coverPreviewContainer) {
+            console.error('Error: "book-cover-preview-container" not found in the DOM.');
+            return;
        }
-        
-        // Download the image via backend
+
+        const loadingDiv = document.createElement('div');
+        loadingDiv.className = 'image-loading';
+        loadingDiv.innerHTML = '<div class="loading-spinner">Buchcover wird heruntergeladen...</div>';
+        coverPreviewContainer.appendChild(loadingDiv);
+
        fetch('/download_book_cover', {
            method: 'POST',
            headers: {
@@ -1773,78 +1696,63 @@
            },
            body: JSON.stringify({ url: imageUrl })
        })
-        .then(response => response.json())
-        .then(data => {
-            // Remove loading indicator
-            const loadingDiv = imagePreviewContainer?.querySelector('.image-loading');
-            if (loadingDiv) {
-                loadingDiv.remove();
-            }
-            
-            if (data.success) {
-                // Create a preview of the downloaded image
-                const imagePreview = document.createElement('div');
-                imagePreview.className = 'book-cover-preview';
-                imagePreview.innerHTML = `
-                    <div class="preview-item">
-                        <img src="{{ url_for('uploaded_file', filename='') }}${data.filename}" 
-                             alt="Buchcover" class="book-cover-thumbnail">
-                        <p class="book-cover-caption">Buchcover automatisch heruntergeladen</p>
-                        <input type="hidden" name="book_cover_image" value="${data.filename}">
-                        <button type="button" onclick="removeBookCover(this)" 
-                                class="remove-book-cover-button">
-                            Entfernen
-                        </button>
-                    </div>
-                `;
-                
-                if (imagePreviewContainer) {
-                    imagePreviewContainer.appendChild(imagePreview);
+            .then(response => response.json())
+            .then(data => {
+                const currentLoadingDiv = coverPreviewContainer.querySelector('.image-loading');
+                if (currentLoadingDiv) {
+                    currentLoadingDiv.remove();
                }
-                
-                console.log('Book cover downloaded successfully:', data.filename);
-            } else {
-                console.error('Failed to download book cover:', data.error);
-                // Show error message to user
-                if (imagePreviewContainer) {
-                    const errorDiv = document.createElement('div');
-                    errorDiv.className = 'error-message';
-                    errorDiv.textContent = 'Fehler beim Herunterladen des Buchcovers: ' + data.error;
-                    errorDiv.style.fontSize = '0.8em';
-                    errorDiv.style.padding = '5px';
-                    errorDiv.style.marginTop = '5px';
-                    imagePreviewContainer.appendChild(errorDiv);
-                    
-                    // Remove error message after 5 seconds
-                    setTimeout(() => errorDiv.remove(), 5000);
+
+                if (data.success) {
+                    coverPreviewContainer.innerHTML = '';
+
+                    const imagePreview = document.createElement('div');
+                    imagePreview.className = 'book-cover-preview';
+                    imagePreview.innerHTML = `
+                <div class="preview-item">
+                    <img src="/uploads/${data.filename}"
+                         alt="Buchcover" class="book-cover-thumbnail" style="max-width: 150px; border-radius: 4px;">
+                    <p class="book-cover-caption" style="font-size: 0.9em; color: #555;">Buchcover automatisch heruntergeladen</p>
+                    <input type="hidden" name="book_cover_image" value="${data.filename}">
+                    <button type="button" onclick="removeBookCover(this)"
+                            class="remove-book-cover-button btn btn-sm btn-danger">
+                        Entfernen
+                    </button>
+                </div>
+            `;
+
+                    coverPreviewContainer.appendChild(imagePreview);
+                    console.log('Book cover downloaded successfully:', data.filename);
+                } else {
+                    console.error('Failed to download book cover:', data.error);
+                    showCoverError(coverPreviewContainer, 'Fehler beim Herunterladen des Buchcovers: ' + data.error);
                }
-            }
-        })
-        .catch(error => {
-            console.error('Error downloading book cover:', error);
-            // Remove loading indicator
-            const loadingDiv = imagePreviewContainer?.querySelector('.image-loading');
-            if (loadingDiv) {
-                loadingDiv.remove();
-            }
-            
-            // Show error message
-            if (imagePreviewContainer) {
-                const errorDiv = document.createElement('div');
-                errorDiv.className = 'error-message';
-                errorDiv.textContent = 'Netzwerkfehler beim Herunterladen des Buchcovers';
-                errorDiv.style.fontSize = '0.8em';
-                errorDiv.style.padding = '5px';
-                errorDiv.style.marginTop = '5px';
-                imagePreviewContainer.appendChild(errorDiv);
-                
-                // Remove error message after 5 seconds
-                setTimeout(() => errorDiv.remove(), 5000);
-            }
-        });
+            })
+            .catch(error => {
+                console.error('Error downloading book cover:', error);
+
+                const currentLoadingDiv = coverPreviewContainer.querySelector('.image-loading');
+                if (currentLoadingDiv) {
+                    currentLoadingDiv.remove();
+                }
+
+                showCoverError(coverPreviewContainer, 'Netzwerkfehler beim Herunterladen des Buchcovers');
+            });
    }
-    
-    // Function to remove downloaded book cover
+
+    function showCoverError(container, message) {
+        const errorDiv = document.createElement('div');
+        errorDiv.className = 'error-message';
+        errorDiv.textContent = message;
+        errorDiv.style.fontSize = '0.8em';
+        errorDiv.style.color = 'red';
+        errorDiv.style.padding = '5px';
+        errorDiv.style.marginTop = '5px';
+        container.appendChild(errorDiv);
+
+        setTimeout(() => errorDiv.remove(), 5000);
+    }
+
    function removeBookCover(button) {
        const previewItem = button.closest('.preview-item');
        if (previewItem) {
@@ -1852,7 +1760,6 @@
        }
    }

-    // Code validation functions
    function checkCodeUnique(code, excludeId, callback) {
        if (!code || code.trim() === '') {
            callback(true);
@@ -1878,11 +1785,11 @@
        if (existingPopup) {
            existingPopup.remove();
        }
-        
+
        // Create popup overlay
        const overlay = document.createElement('div');
        overlay.className = 'popup-overlay';
-        
+
        // Create popup content
        overlay.innerHTML = `
            <div class="duplicate-code-popup">
@@ -1895,9 +1802,9 @@
                <button class="popup-close-button" onclick="this.closest('.popup-overlay').remove()">Verstanden</button>
            </div>
        `;
-        
+
        document.body.appendChild(overlay);
-        
+
        // Auto-remove after 10 seconds
        setTimeout(() => {
            if (overlay.parentNode) {
@@ -1937,28 +1844,25 @@
    function setupImagePreview() {
        const imageInput = document.getElementById('images');
        const previewContainer = document.getElementById('image-preview-container');
-        
+
        if (imageInput && previewContainer) {
            imageInput.addEventListener('change', function(e) {
                previewContainer.innerHTML = '';
-                
+
                const files = e.target.files;
-                
-                // Validate file types before preview
-                const allowedTypes = ['image/jpeg', 'image/jpg', 'image/png', 'image/gif', 
-                                    'video/mp4', 'video/quicktime', 'video/x-msvideo', 'video/x-matroska', 
-                                    'video/webm', 'video/x-flv', 'video/mp4', 'video/3gpp'];
-                let hasInvalidFile = false;
-                
+
+                // Validate file types before preview (Strictly Images)
+                const allowedTypes = ['image/jpeg', 'image/jpg', 'image/png', 'image/gif'];
+
                for (let i = 0; i < files.length; i++) {
                    if (!allowedTypes.includes(files[i].type)) {
-                        hasInvalidFile = true;
                        // Clear the file input to prevent submission
                        imageInput.value = '';
-                        previewContainer.innerHTML = '<div class="error-message">Fehler: Datei "' + files[i].name + '" hat ein nicht unterstütztes Format. Erlaubte Formate: JPG, JPEG, PNG, GIF, MP4, MOV, AVI, MKV, WEBM, FLV, M4V, 3GP</div>';
+                        previewContainer.innerHTML = '<div class="error-message">Fehler: Datei "' + files[i].name + '" hat ein nicht unterstütztes Format. Erlaubte Formate: JPG, JPEG, PNG, GIF</div>';
                        return; // Stop processing
                    }
                }
+
                for (let i = 0; i < files.length; i++) {
                    const file = files[i];
                    if (file.type.startsWith('image/')) {
@@ -1973,17 +1877,6 @@
                            previewContainer.appendChild(preview);
                        };
                        reader.readAsDataURL(file);
-                    } else if (file.type.startsWith('video/')) {
-                        const preview = document.createElement('div');
-                        preview.className = 'image-preview video-preview';
-                        preview.innerHTML = `
-                            <div class="video-placeholder">
-                                <div class="video-icon">🎥</div>
-                                <div class="video-name">${file.name}</div>
-                            </div>
-                            <button type="button" class="remove-image" onclick="removeImagePreview(this, ${i})">×</button>
-                        `;
-                        previewContainer.appendChild(preview);
                    }
                }
            });
@@ -2049,34 +1942,6 @@
                }
            });
        }
-        
-        // Handle duplication data if available (from sessionStorage or server)
-        if (typeof prefillFormWithDuplicateData === 'function') {
-            setTimeout(() => {
-                prefillFormWithDuplicateData();
-            }, 500); // Wait for all dropdowns to load
-        }
    });
-
-    // Initialize duplication data - handle both server-side and sessionStorage data
-    let duplicateData = null;
-    
-    // First check if serverDuplicateData is defined by the script above
-    if (typeof serverDuplicateData !== 'undefined' && serverDuplicateData) {
-        console.log("Using server-provided duplicateData:", serverDuplicateData);
-        duplicateData = serverDuplicateData;
-        
-        // Ensure images is properly handled as an array
-        if (duplicateData.images) {
-            if (typeof duplicateData.images === 'string') {
-                try {
-                    duplicateData.images = JSON.parse(duplicateData.images);
-                } catch (e) {
-                    console.error("Error parsing duplicate images array:", e);
-                }
-            }
-            console.log("Parsed duplicate images successfully.");
-        }
-    }
 </script>
 {% endblock %}
Author	SHA1	Message	Date
Aiirondev_dev	2528e79895	Slight fix of the displaying of the detailed view, for the bibliothek Release Inventarsystem / release-docker (push) Successful in 2m14s Details	2026-08-16 23:50:24 +02:00
Aiirondev_dev	542caa520f	fix of a redirect error Release Inventarsystem / release-docker (push) Successful in 2m15s Details	2026-08-16 23:21:31 +02:00
Aiirondev_dev	5136e40587	Implementation of a clean up function for a stray collection processing Release Inventarsystem / release-docker (push) Successful in 2m15s Details	2026-08-16 23:08:10 +02:00
Aiirondev_dev	c62b2b553d	improvements in processing the library item uploading Release Inventarsystem / release-docker (push) Successful in 2m16s Details	2026-08-16 22:50:17 +02:00
Aiirondev_dev	8783f97a09	improvements in displaying the Images in the detailed view Release Inventarsystem / release-docker (push) Successful in 2m15s Details	2026-08-16 22:19:41 +02:00
Aiirondev_dev	43e09b41f1	Slight change to the Style for the scnaner Release Inventarsystem / release-docker (push) Successful in 2m16s Details	2026-08-16 21:23:04 +02:00
Aiirondev_dev	84257dc289	Fix / implementation of the according wrapper for the scanner processing Release Inventarsystem / release-docker (push) Successful in 2m18s Details	2026-08-16 21:07:47 +02:00
Aiirondev_dev	c4b3850369	Merge remote-tracking branch 'origin/main' Release Inventarsystem / release-docker (push) Successful in 2m15s Details	2026-08-16 20:06:12 +02:00
Aiirondev_dev	28e9487fe1	Improved implementation of the Klassen processing to havbe the already existing ones in a dropdown.	2026-08-16 20:06:05 +02:00
Aiirondev_dev	fe075938d7	resolve camara scan stream failure Release Inventarsystem / release-docker (push) Successful in 2m15s Details	2026-08-16 15:57:12 +02:00
Aiirondev_dev	0ef928efd8	slight fix of the scanner Release Inventarsystem / release-docker (push) Successful in 2m14s Details	2026-08-16 15:50:48 +02:00
Aiirondev_dev	1299140823	Fix of the encryption processing with the Student class Release Inventarsystem / release-docker (push) Successful in 2m14s Details	2026-08-16 13:17:20 +02:00
Aiirondev_dev	ea48d5c28a	decryption of the parsed fields Release Inventarsystem / release-docker (push) Successful in 2m15s Details	2026-08-16 13:08:34 +02:00
Aiirondev_dev	514065f4af	fixe of a list error Release Inventarsystem / release-docker (push) Successful in 3m7s Details	2026-08-16 12:58:31 +02:00
Aiirondev_dev	90da8487f2	feat(student-cards): add class-specific PDF export with dynamic dropdown Release Inventarsystem / release-docker (push) Successful in 2m16s Details - Implement /student_card_class_barcode_download route to filter student cards by class - Dynamically extract unique class names from the database for frontend selection - Update student_cards_admin.html to replace the text input with a class selection dropdown	2026-08-15 18:10:05 +02:00
Aiirondev_dev	b1ca358d41	Cleanup of the front end and backend of the upload function to only allow images and no videos because of space and memory reasons as well as hardening the uploading process. Release Inventarsystem / release-docker (push) Successful in 2m15s Details	2026-08-15 01:38:35 +02:00
Aiirondev_dev	47cba5865d	Removal of dupolicate function. Release Inventarsystem / release-docker (push) Successful in 4m55s Details	2026-08-15 01:33:38 +02:00
Aiirondev_dev	4a776872e0	Improvement of the style for the Library Module Release Inventarsystem / release-docker (push) Successful in 2m15s Details	2026-08-15 00:08:13 +02:00
Aiirondev_dev	55a74654db	Addition of a missing ',' Release Inventarsystem / release-docker (push) Successful in 2m15s Details	2026-08-14 23:18:29 +02:00
Aiirondev_dev	7473334714	Changes to the Inventarsystem Workflow to Reflekt the new workflow and have an according set of buttons. So this removed all metioning of the duplication function. Release Inventarsystem / release-docker (push) Successful in 2m15s Details	2026-08-14 23:01:01 +02:00
Aiirondev_dev	d746b61a17	feat: integrate Quagga2 scanner, background pagination, and secure fetch API Release Inventarsystem / release-docker (push) Successful in 2m15s Details Configure Quagga2 barcode scanner with environment facing mode Add fallback keyboardScanKeydownHandler for physical keyboard-wedge scanners Secure fetch requests by including X-CSRFToken headers Implement loadRemainingLibraryItemsInBackground for seamless data loading Refactor showItemDetail to accurately render videos, external URLs, and local uploa	2026-08-14 22:33:52 +02:00
Aiirondev_dev	440cafb88f	Merge remote-tracking branch 'origin/main' Release Inventarsystem / release-docker (push) Successful in 2m18s Details	2026-08-14 20:35:44 +02:00
Aiirondev_dev	9fb56e905c	Renaming of the Schülerausweis to the Bibliotheksausweis	2026-08-14 20:35:31 +02:00
Aiirondev_dev	21ad639081	changes to make the default redirect endpoint in chase of page authentication error Release Inventarsystem / release-docker (push) Successful in 2m14s Details	2026-08-14 20:20:59 +02:00