Initial Commit

2026-04-10 14:48:52 +02:00
commit fad7d9a757
81 changed files with 39657 additions and 0 deletions
@@ -0,0 +1,400 @@
+/**
+ * Copyright 2025-2026 AIIrondev
+ *
+ * Licensed under the Inventarsystem EULA (Endbenutzer-Lizenzvertrag).
+ * See Legal/LICENSE for the full license text.
+ * Unauthorized commercial use, SaaS hosting, or removal of branding is prohibited.
+ * For commercial licensing inquiries: https://github.com/AIIrondev
+ */
+
+// Initialize when document is loaded
+document.addEventListener('DOMContentLoaded', function() {
+    if (isIOSDevice()) {
+        console.log('iOS device detected, applying iOS-specific enhancements');
+        applyIOSFixes();
+    }
+});
+
+// Apply all iOS-specific fixes
+function applyIOSFixes() {
+    // Fix file input issues
+    fixIOSFileInputs();
+    
+    // Fix form submission
+    fixIOSFormSubmission();
+    
+    // Fix image handling
+    fixIOSImageHandling();
+    
+    // Fix duplication
+    fixIOSDuplication();
+    
+    // Apply CSS fixes
+    applyIOSCSSFixes();
+}
+
+// Fix iOS file input issues
+function fixIOSFileInputs() {
+    // Find all file inputs
+    const fileInputs = document.querySelectorAll('input[type="file"]');
+    
+    fileInputs.forEach(input => {
+        // Create a touch-friendly wrapper
+        const wrapper = document.createElement('div');
+        wrapper.className = 'ios-file-input-wrapper';
+        wrapper.style.position = 'relative';
+        
+        // Style the original input to be more touch-friendly
+        input.style.padding = '20px 0';
+        
+        // Wrap the input
+        if (input.parentNode) {
+            input.parentNode.insertBefore(wrapper, input);
+            wrapper.appendChild(input);
+            
+            // Add a visible button for better touch target
+            const fakeButton = document.createElement('div');
+            fakeButton.className = 'ios-file-button';
+            fakeButton.textContent = 'Wählen Sie Bilder/Videos aus';
+            fakeButton.style.display = 'inline-block';
+            fakeButton.style.padding = '10px 15px';
+            fakeButton.style.backgroundColor = '#4CAF50';
+            fakeButton.style.color = 'white';
+            fakeButton.style.borderRadius = '4px';
+            fakeButton.style.textAlign = 'center';
+            fakeButton.style.margin = '10px 0';
+            fakeButton.style.fontWeight = 'bold';
+            wrapper.appendChild(fakeButton);
+            
+            // Make sure the real input covers the fake button
+            input.style.position = 'absolute';
+            input.style.top = '0';
+            input.style.left = '0';
+            input.style.width = '100%';
+            input.style.height = '100%';
+            input.style.opacity = '0';
+            input.style.zIndex = '10';
+        }
+        
+        // Add custom event handling
+        input.addEventListener('change', function() {
+            // Update visual feedback
+            const fileCount = this.files ? this.files.length : 0;
+            let fileText = fakeButton.textContent;
+            
+            if (fileCount > 0) {
+                fileText = `${fileCount} Datei${fileCount !== 1 ? 'en' : ''} ausgewählt`;
+                fakeButton.style.backgroundColor = '#2E7D32';
+            } else {
+                fileText = 'Wählen Sie Bilder/Videos aus';
+                fakeButton.style.backgroundColor = '#4CAF50';
+            }
+            
+            fakeButton.textContent = fileText;
+        });
+    });
+}
+
+// Fix iOS form submission issues
+function fixIOSFormSubmission() {
+    // Find upload forms
+    const uploadForms = document.querySelectorAll('form[action*="upload_item"]');
+    
+    uploadForms.forEach(form => {
+        // Add an iOS submission handler
+        form.addEventListener('submit', function(e) {
+            // Only intercept on iOS
+            if (!isIOSDevice()) return;
+            
+            e.preventDefault();
+            
+            // Show that we're processing
+            const loadingMessage = document.createElement('div');
+            loadingMessage.className = 'ios-loading-message';
+            loadingMessage.textContent = 'Wird verarbeitet...';
+            loadingMessage.style.padding = '10px';
+            loadingMessage.style.backgroundColor = '#f0f0f0';
+            loadingMessage.style.borderRadius = '5px';
+            loadingMessage.style.margin = '10px 0';
+            loadingMessage.style.textAlign = 'center';
+            form.appendChild(loadingMessage);
+            
+            // Disable the submit button
+            const submitButton = form.querySelector('button[type="submit"]');
+            if (submitButton) {
+                submitButton.disabled = true;
+            }
+            
+            // Use timeout to allow UI to update before heavy processing
+            setTimeout(() => {
+                // Gather form data with special handling for iOS
+                const formData = new FormData(form);
+                
+                // Add iOS flag
+                formData.append('is_ios', 'true');
+                
+                // Submit with fetch API which works better on iOS
+                fetch(form.action, {
+                    method: 'POST',
+                    body: formData,
+                    credentials: 'same-origin'
+                })
+                .then(response => response.json())
+                .then(data => {
+                    // Remove loading message
+                    if (loadingMessage.parentNode) {
+                        loadingMessage.parentNode.removeChild(loadingMessage);
+                    }
+                    
+                    // Re-enable submit button
+                    if (submitButton) {
+                        submitButton.disabled = false;
+                    }
+                    
+                    if (data.success) {
+                        // Show success and redirect
+                        alert(data.message || 'Element erfolgreich hinzugefügt');
+                        
+                        // Redirect to the appropriate page
+                        if (data.itemId) {
+                            window.location.href = `/home_admin?highlight_item=${data.itemId}`;
+                        } else {
+                            window.location.href = '/home_admin';
+                        }
+                    } else {
+                        // Show error
+                        alert(data.message || 'Ein Fehler ist aufgetreten');
+                    }
+                })
+                .catch(error => {
+                    console.error('iOS form submission error:', error);
+                    
+                    // Remove loading message
+                    if (loadingMessage.parentNode) {
+                        loadingMessage.parentNode.removeChild(loadingMessage);
+                    }
+                    
+                    // Re-enable submit button
+                    if (submitButton) {
+                        submitButton.disabled = false;
+                    }
+                    
+                    // Show error
+                    alert('Ein Netzwerkfehler ist aufgetreten. Bitte versuchen Sie es erneut.');
+                });
+            }, 100);
+        });
+    });
+}
+
+// Fix iOS image handling issues
+function fixIOSImageHandling() {
+    // Reduce image preview quality on iOS
+    if (typeof ImagePreviewGenerator !== 'undefined') {
+        // Override the compression quality for iOS
+        const originalCompressImage = ImagePreviewGenerator.prototype._compressImage;
+        
+        if (originalCompressImage) {
+            ImagePreviewGenerator.prototype._compressImage = function(dataUrl) {
+                // Lower quality for iOS
+                this.quality = 0.5;
+                this.maxWidth = 600;
+                this.maxHeight = 600;
+                
+                return originalCompressImage.call(this, dataUrl);
+            };
+        }
+    }
+    
+    // Fix image preview display
+    document.querySelectorAll('.image-preview-container').forEach(container => {
+        // Add iOS-specific styling
+        container.style.webkitOverflowScrolling = 'touch';
+        container.style.maxHeight = '150px';
+        container.style.overflow = 'auto';
+    });
+}
+
+// Fix iOS duplication issues
+function fixIOSDuplication() {
+    // Override duplicateItem function
+    if (typeof duplicateItem !== 'undefined') {
+        const originalDuplicateItem = duplicateItem;
+        
+        duplicateItem = function(itemId) {
+            // Use localStorage on iOS instead of sessionStorage
+            const useFunction = originalDuplicateItem;
+            
+            useFunction(itemId);
+            
+            // Additional iOS-specific handling
+            const checkForSessionData = setInterval(() => {
+                const sessionData = sessionStorage.getItem('duplicateItemData');
+                if (sessionData) {
+                    // Copy from sessionStorage to localStorage
+                    try {
+                        localStorage.setItem('duplicateItemData', sessionData);
+                        localStorage.setItem('duplicateItemTimestamp', Date.now().toString());
+                        console.log('Copied duplicate data to localStorage for iOS reliability');
+                    } catch (e) {
+                        console.warn('Failed to copy to localStorage:', e);
+                    }
+                    
+                    clearInterval(checkForSessionData);
+                }
+            }, 100);
+            
+            // Clear interval after 3 seconds regardless
+            setTimeout(() => clearInterval(checkForSessionData), 3000);
+        };
+    }
+    
+    // Fix prefill function
+    if (typeof prefillFormWithDuplicateData !== 'undefined') {
+        const originalPrefill = prefillFormWithDuplicateData;
+        
+        prefillFormWithDuplicateData = function() {
+            // Try to get data from localStorage first
+            let data = null;
+            try {
+                const localData = localStorage.getItem('duplicateItemData');
+                if (localData) {
+                    data = JSON.parse(localData);
+                    localStorage.removeItem('duplicateItemData');
+                    localStorage.removeItem('duplicateItemTimestamp');
+                    console.log('Using duplicate data from localStorage');
+                }
+            } catch (e) {
+                console.warn('Error accessing localStorage:', e);
+            }
+            
+            // If we got data from localStorage, manually populate the form
+            if (data) {
+                console.log('Manually populating form with iOS optimization');
+                
+                // Basic fields
+                document.getElementById('name').value = data.name || '';
+                document.getElementById('beschreibung').value = data.description || '';
+                
+                // Handle filters with a delay
+                setTimeout(() => {
+                    // Filter 1
+                    if (data.filter1 && Array.isArray(data.filter1)) {
+                        data.filter1.forEach((val, idx) => {
+                            const field = document.getElementById(`filter1-${idx+1}`);
+                            if (field && val) field.value = val;
+                        });
+                    }
+                    
+                    // Filter 2
+                    if (data.filter2 && Array.isArray(data.filter2)) {
+                        data.filter2.forEach((val, idx) => {
+                            const field = document.getElementById(`filter2-${idx+1}`);
+                            if (field && val) field.value = val;
+                        });
+                    }
+                    
+                    // Filter 3
+                    if (data.filter3 && Array.isArray(data.filter3)) {
+                        data.filter3.forEach((val, idx) => {
+                            const field = document.getElementById(`filter3-${idx+1}`);
+                            if (field && val) field.value = val;
+                        });
+                    }
+                }, 300);
+                
+                // Location
+                setTimeout(() => {
+                    const location = document.getElementById('ort');
+                    if (location && data.location) location.value = data.location;
+                }, 400);
+                
+                // Year and cost
+                const year = document.getElementById('anschaffungsjahr');
+                if (year && data.year) year.value = data.year;
+                
+                const cost = document.getElementById('anschaffungskosten');
+                if (cost && data.cost) cost.value = data.cost;
+                
+                // Handle images - limited for iOS
+                const form = document.querySelector('form');
+                if (form && data.images && Array.isArray(data.images)) {
+                    // Add hidden field to indicate duplication
+                    const isDuplicatingField = document.createElement('input');
+                    isDuplicatingField.type = 'hidden';
+                    isDuplicatingField.name = 'is_duplicating';
+                    isDuplicatingField.value = 'true';
+                    form.appendChild(isDuplicatingField);
+                    
+                    // Only use first 3 images on iOS for performance
+                    const limitedImages = data.images.slice(0, 3);
+                    
+                    limitedImages.forEach(imageName => {
+                        const imageField = document.createElement('input');
+                        imageField.type = 'hidden';
+                        imageField.name = 'duplicate_images';
+                        imageField.value = imageName;
+                        form.appendChild(imageField);
+                    });
+                    
+                    // Add a message about limited images
+                    if (data.images.length > 3) {
+                        const messageDiv = document.createElement('div');
+                        messageDiv.style.margin = '10px 0';
+                        messageDiv.style.padding = '10px';
+                        messageDiv.style.backgroundColor = '#fff3cd';
+                        messageDiv.style.borderRadius = '5px';
+                        messageDiv.style.color = '#856404';
+                        messageDiv.textContent = `Aus Leistungsgründen werden nur ${limitedImages.length} von ${data.images.length} Bildern verwendet`;
+                        
+                        const fileInput = document.getElementById('images');
+                        if (fileInput && fileInput.parentNode) {
+                            fileInput.parentNode.appendChild(messageDiv);
+                        } else {
+                            form.appendChild(messageDiv);
+                        }
+                    }
+                }
+            } else {
+                // Use original function as fallback
+                originalPrefill();
+            }
+        };
+    }
+}
+
+// Apply iOS-specific CSS fixes
+function applyIOSCSSFixes() {
+    // Create a style element
+    const style = document.createElement('style');
+    style.textContent = `
+        /* Improve touch targets for iOS */
+        button, select, input[type="submit"], .ausleihen, .edit-button, 
+        .delete-button, .duplicate-button, .details-button {
+            min-height: 44px !important;
+            padding: 10px 15px !important;
+        }
+        
+        /* Improve scrolling on iOS */
+        .items-container, .filter-options, .modal-content {
+            -webkit-overflow-scrolling: touch !important;
+        }
+        
+        /* Prevent zoom on inputs */
+        input, select, textarea {
+            font-size: 16px !important;
+        }
+        
+        /* Fix iOS image display */
+        .item-image {
+            -webkit-transform: translateZ(0);
+        }
+        
+        /* Improve form fields on iOS */
+        .form-group {
+            margin-bottom: 15px !important;
+        }
+    `;
+    
+    document.head.appendChild(style);
+}
@@ -0,0 +1,285 @@
+/**
+ * Copyright 2025-2026 AIIrondev
+ *
+ * Licensed under the Inventarsystem EULA (Endbenutzer-Lizenzvertrag).
+ * See Legal/LICENSE for the full license text.
+ * Unauthorized commercial use, SaaS hosting, or removal of branding is prohibited.
+ * For commercial licensing inquiries: https://github.com/AIIrondev
+ */
+
+// Detect mobile devices including tablets
+function isMobileDevice() {
+    return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
+}
+
+// Specifically detect iOS devices
+function isIOSDevice() {
+    return /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;
+}
+
+// Mobile-compatible file tracker to replace DataTransfer API
+class MobileCompatFileTracker {
+    constructor() {
+        this.files = [];
+        this.removedIndices = new Set();
+    }
+
+    // Add files from a FileList
+    addFiles(fileList) {
+        // Convert FileList to Array for easier handling
+        Array.from(fileList).forEach(file => {
+            this.files.push(file);
+        });
+    }
+
+    // Remove a file by index
+    removeFile(index) {
+        if (index >= 0 && index < this.files.length) {
+            this.removedIndices.add(index);
+        }
+    }
+
+    // Get all non-removed files
+    getFiles() {
+        return this.files.filter((_, index) => !this.removedIndices.has(index));
+    }
+
+    // Convert to FormData for upload
+    appendToFormData(formData, fieldName) {
+        this.getFiles().forEach(file => {
+            formData.append(fieldName, file);
+        });
+    }
+
+    // Clear all files
+    clear() {
+        this.files = [];
+        this.removedIndices.clear();
+    }
+}
+
+// Mobile optimized image preview generator
+class ImagePreviewGenerator {
+    constructor(options = {}) {
+        this.maxWidth = options.maxWidth || 800;
+        this.maxHeight = options.maxHeight || 600;
+        this.quality = options.quality || 0.8;
+        this.maxPreviewsOnMobile = options.maxPreviewsOnMobile || 3;
+    }
+
+    // Create optimized image preview element
+    createPreview(file, index) {
+        return new Promise((resolve, reject) => {
+            if (!file) {
+                reject(new Error('No file provided'));
+                return;
+            }
+
+            const isVideo = file.type.startsWith('video/');
+            
+            if (isVideo) {
+                this._createVideoPreview(file, index).then(resolve).catch(reject);
+            } else if (file.type.startsWith('image/')) {
+                this._createImagePreview(file, index).then(resolve).catch(reject);
+            } else {
+                reject(new Error('Unsupported file type'));
+            }
+        });
+    }
+
+    // Create image preview with optimization for mobile
+    _createImagePreview(file, index) {
+        return new Promise((resolve, reject) => {
+            const reader = new FileReader();
+            
+            reader.onload = (e) => {
+                // For mobile, we'll compress the image before creating the preview
+                if (isMobileDevice()) {
+                    this._compressImage(e.target.result)
+                        .then(compressedDataUrl => {
+                            const previewElement = this._createPreviewElement(compressedDataUrl, file.name, index, false);
+                            resolve(previewElement);
+                        })
+                        .catch(err => {
+                            // Fallback to original if compression fails
+                            console.warn('Image compression failed, using original:', err);
+                            const previewElement = this._createPreviewElement(e.target.result, file.name, index, false);
+                            resolve(previewElement);
+                        });
+                } else {
+                    // For desktop, use the original image
+                    const previewElement = this._createPreviewElement(e.target.result, file.name, index, false);
+                    resolve(previewElement);
+                }
+            };
+            
+            reader.onerror = () => reject(new Error('Failed to read file'));
+            reader.readAsDataURL(file);
+        });
+    }
+
+    // Create video preview with thumbnail generation
+    _createVideoPreview(file, index) {
+        return new Promise((resolve, reject) => {
+            const videoUrl = URL.createObjectURL(file);
+            const video = document.createElement('video');
+            
+            video.src = videoUrl;
+            video.onloadedmetadata = () => {
+                // Create preview element
+                const previewElement = this._createPreviewElement(videoUrl, file.name, index, true);
+                resolve(previewElement);
+                
+                // Revoke object URL after a delay to ensure it's loaded
+                setTimeout(() => {
+                    URL.revokeObjectURL(videoUrl);
+                }, 3000);
+            };
+            
+            video.onerror = () => {
+                URL.revokeObjectURL(videoUrl);
+                reject(new Error('Failed to load video'));
+            };
+            
+            // Set a timeout in case the video never loads
+            setTimeout(() => {
+                if (!video.videoWidth) {
+                    URL.revokeObjectURL(videoUrl);
+                    reject(new Error('Video load timeout'));
+                }
+            }, 5000);
+        });
+    }
+
+    // Create HTML element for preview
+    _createPreviewElement(src, fileName, index, isVideo) {
+        const previewDiv = document.createElement('div');
+        previewDiv.className = 'image-preview-item';
+        
+        if (isVideo) {
+            const video = document.createElement('video');
+            video.src = src;
+            video.controls = true;
+            video.preload = 'metadata';
+            video.style.maxWidth = '150px';
+            video.style.maxHeight = '150px';
+            video.style.objectFit = 'cover';
+            previewDiv.appendChild(video);
+        } else {
+            const img = document.createElement('img');
+            img.src = src;
+            img.alt = fileName;
+            img.style.maxWidth = '150px';
+            img.style.maxHeight = '150px';
+            img.style.objectFit = 'cover';
+            previewDiv.appendChild(img);
+        }
+        
+        const controlsDiv = document.createElement('div');
+        controlsDiv.className = 'image-controls';
+        
+        const removeButton = document.createElement('button');
+        removeButton.type = 'button';
+        removeButton.textContent = 'Entfernen';
+        removeButton.style.background = '#dc3545';
+        removeButton.style.color = 'white';
+        removeButton.style.border = 'none';
+        removeButton.style.padding = '5px 10px';
+        removeButton.style.borderRadius = '3px';
+        removeButton.style.cursor = 'pointer';
+        removeButton.style.marginLeft = '10px';
+        removeButton.dataset.index = index;
+        removeButton.addEventListener('click', function() {
+            const indexToRemove = parseInt(this.dataset.index, 10);
+            // We'll define removeImagePreview elsewhere
+            if (typeof window.removeImagePreview === 'function') {
+                window.removeImagePreview(indexToRemove);
+            }
+        });
+        
+        controlsDiv.appendChild(removeButton);
+        previewDiv.appendChild(controlsDiv);
+        
+        return previewDiv;
+    }
+
+    // Compress image for mobile devices
+    _compressImage(dataUrl) {
+        return new Promise((resolve, reject) => {
+            const img = new Image();
+            img.onload = () => {
+                const canvas = document.createElement('canvas');
+                let width = img.width;
+                let height = img.height;
+                
+                // Scale down if needed
+                if (width > this.maxWidth || height > this.maxHeight) {
+                    const ratio = Math.min(this.maxWidth / width, this.maxHeight / height);
+                    width *= ratio;
+                    height *= ratio;
+                }
+                
+                canvas.width = width;
+                canvas.height = height;
+                const ctx = canvas.getContext('2d');
+                ctx.drawImage(img, 0, 0, width, height);
+                
+                // Get compressed data URL
+                const compressedDataUrl = canvas.toDataURL('image/jpeg', this.quality);
+                
+                // Clean up
+                canvas.width = 0;
+                canvas.height = 0;
+                
+                resolve(compressedDataUrl);
+            };
+            
+            img.onerror = () => reject(new Error('Failed to load image for compression'));
+            img.src = dataUrl;
+        });
+    }
+}
+
+// Mobile-optimized debounce function for event handlers
+function debounce(func, wait = 300) {
+    let timeout;
+    return function(...args) {
+        clearTimeout(timeout);
+        timeout = setTimeout(() => func.apply(this, args), wait);
+    };
+}
+
+// Mobile-safe promise-based setTimeout
+function delay(ms) {
+    return new Promise(resolve => setTimeout(resolve, ms));
+}
+
+// Log mobile-specific issues to console or server
+function logMobileIssue(action, error) {
+    if (isMobileDevice()) {
+        const diagnosticInfo = {
+            action: action,
+            error: error.message,
+            browser: navigator.userAgent,
+            timestamp: new Date().toISOString(),
+            memoryInfo: performance?.memory ? {
+                jsHeapSizeLimit: performance.memory.jsHeapSizeLimit,
+                totalJSHeapSize: performance.memory.totalJSHeapSize,
+                usedJSHeapSize: performance.memory.usedJSHeapSize
+            } : 'Not available'
+        };
+        
+        console.error('Mobile Issue:', diagnosticInfo);
+        
+        // Optionally send to server
+        fetch('/log_mobile_issue', {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json',
+            },
+            body: JSON.stringify(diagnosticInfo)
+        }).catch(() => {
+            // Silently fail if logging fails
+        });
+    }
+}
@@ -0,0 +1,24 @@
+/**
+ * Copyright 2025-2026 AIIrondev
+ *
+ * Licensed under the Inventarsystem EULA (Endbenutzer-Lizenzvertrag).
+ * See Legal/LICENSE for the full license text.
+ * Unauthorized commercial use, SaaS hosting, or removal of branding is prohibited.
+ * For commercial licensing inquiries: https://github.com/AIIrondev
+ */
+chatBox = document.getElementById('chatBox');
+
+function fetchMessages() {
+    fetch('/messages')
+        .then(response => response.json())
+        .then(data => {
+            chatBox.innerHTML = '';
+            data.messages.forEach(msg => {
+                const messageElement = document.createElement('div');
+                messageElement.textContent = msg;
+                chatBox.appendChild(messageElement);
+            });
+        });
+}
+
+setInterval(fetchMessages, 1000);