From fb0e00f2a020712b795a1166a5a004d754b0d3bf Mon Sep 17 00:00:00 2001
From: Till Tomczak <till.tmk@gmail.com>
Date: Thu, 29 May 2025 11:41:21 +0200
Subject: [PATCH] "Feature: Update guest request template design"

---
 backend/app/app.py                       | 12 -----
 backend/app/templates/guest_request.html | 68 ++++++++++++++++++++++++
 2 files changed, 68 insertions(+), 12 deletions(-)

diff --git a/backend/app/app.py b/backend/app/app.py
index 846498e5e..964268de9 100644
--- a/backend/app/app.py
+++ b/backend/app/app.py
@@ -50,18 +50,6 @@ app.config["WTF_CSRF_ENABLED"] = True
 # CSRF-Schutz initialisieren
 csrf = CSRFProtect(app)
 
-# CSRF-Exemption für Guest-API-Endpunkte
-@app.before_request
-def csrf_exempt_for_guest_api():
-    """Befreit bestimmte API-Endpunkte vom CSRF-Schutz."""
-    if request.endpoint and (
-        request.endpoint.startswith('guest.api_') or 
-        request.path.startswith('/api/guest/') or
-        request.path.startswith('/api/jobs/start/')
-    ):
-        # CSRF-Schutz für diese Endpunkte deaktivieren
-        csrf._exempt_views.add(request.endpoint)
-
 # CSRF-Error-Handler
 @csrf.error_handler
 def csrf_error(reason):
diff --git a/backend/app/templates/guest_request.html b/backend/app/templates/guest_request.html
index 33ba307fc..94c6ea2de 100644
--- a/backend/app/templates/guest_request.html
+++ b/backend/app/templates/guest_request.html
@@ -191,4 +191,72 @@
         </div>
     </div>
 </div>
+
+<script>
+    // Form Submit Handler
+    document.getElementById('guestRequestForm').addEventListener('submit', async function(e) {
+        e.preventDefault();
+        
+        // Button Animation
+        document.getElementById('submitBtn').disabled = true;
+        document.getElementById('submitBtn').innerHTML = '<span class="flex items-center justify-center"><svg class="animate-spin w-5 h-5 mr-3" fill="none" viewBox="0 0 24 24"><circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle><path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path></svg>📡 Wird übertragen...</span>';
+        
+        try {
+            const formData = new FormData(this);
+            const data = {
+                name: formData.get('name'),
+                email: formData.get('email'),
+                reason: formData.get('reason'),
+                duration_min: parseInt(formData.get('duration_min')) || 60,
+                printer_id: formData.get('preferred_printer') ? parseInt(formData.get('preferred_printer')) : null
+            };
+            
+            // CSRF-Token aus Meta-Tag holen
+            const csrfToken = document.querySelector('meta[name="csrf-token"]')?.getAttribute('content');
+            
+            const headers = {
+                'Content-Type': 'application/json',
+            };
+            
+            // CSRF-Token hinzufügen falls verfügbar
+            if (csrfToken) {
+                headers['X-CSRFToken'] = csrfToken;
+            }
+            
+            const response = await fetch('/api/guest/requests', {
+                method: 'POST',
+                headers: headers,
+                body: JSON.stringify(data)
+            });
+            
+            const result = await response.json();
+            
+            if (result.success) {
+                // Status-URL anzeigen
+                const url = window.location.origin + `/request/${result.request_id}`;
+                document.getElementById('statusUrl').textContent = url;
+                
+                // Success Modal mit Animation anzeigen
+                document.getElementById('successModal').classList.remove('hidden');
+                setTimeout(() => {
+                    document.getElementById('successModalContent').classList.remove('scale-95', 'opacity-0');
+                    document.getElementById('successModalContent').classList.add('scale-100', 'opacity-100');
+                }, 10);
+                
+                // Formular zurücksetzen
+                this.reset();
+                document.getElementById('durationProgress').style.width = '12.5%';
+            } else {
+                alert('❌ Fehler: ' + (result.error || 'Unbekannter Fehler'));
+            }
+        } catch (error) {
+            console.error('Fehler beim Senden der Anfrage:', error);
+            alert('❌ Fehler beim Senden der Anfrage. Bitte versuchen Sie es später erneut.');
+        } finally {
+            // Button zurücksetzen
+            document.getElementById('submitBtn').disabled = false;
+            document.getElementById('submitBtn').innerHTML = '<span class="flex items-center justify-center"><svg class="w-5 h-5 mr-3 group-hover:rotate-12 transition-transform duration-300" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 19l9 2-9-18-9 18 9-2zm0 0v-8"/></svg>🚀 Anfrage übermitteln</span>';
+        }
+    });
+</script>
 {% endblock %} 
\ No newline at end of file