up traffic

oedb/resources/demo/static/traffic.js

@@ -140,11 +140,11 @@ document.addEventListener('DOMContentLoaded', function () {
         }
 
         // Set up form submission after DOM is loaded
-        const reportForm = document.getElementById('trafficForm');
+        const reportForm = document.getElementById('reportForm');
         if (reportForm) {
             reportForm.addEventListener('submit', submitReport);
         } else {
-            console.warn('Traffic form not found in DOM');
+            console.warn('Report form not found in DOM');
         }
     }
 
@@ -251,13 +251,26 @@ document.addEventListener('DOMContentLoaded', function () {
                 }
             }
 
-            // Submit the event to the API
-            const response = await fetch('/event', {
+            // Submit the event to the OEDB API
+            const response = await fetch('https://api.openeventdatabase.org/event', {
                 method: 'POST',
                 headers: {
                     'Content-Type': 'application/json'
                 },
-                body: JSON.stringify(eventData)
+                body: JSON.stringify({
+                    type: 'Feature',
+                    geometry: eventData.geometry,
+                    properties: {
+                        type: eventData.type,
+                        what: eventData.what,
+                        label: eventData.label,
+                        description: eventData.description,
+                        start: eventData.start,
+                        stop: eventData.stop,
+                        ...(eventData.source && { source: eventData.source }),
+                        ...(eventData.media && { media: eventData.media })
+                    }
+                })
             });
 
             if (!response.ok) {
@@ -267,8 +280,44 @@ document.addEventListener('DOMContentLoaded', function () {
 
             const data = await response.json();
 
-            // Show success message
-            resultElement.textContent = `Report submitted successfully! Event ID: ${data.id}`;
+            // Extract event ID from response (handle different response structures)
+            let eventId = null;
+            if (data.properties && data.properties.id) {
+                eventId = data.properties.id;
+            } else if (data.id) {
+                eventId = data.id;
+            } else if (typeof data === 'string') {
+                eventId = data;
+            }
+
+            console.log('📅 Réponse API complète:', data);
+            console.log('🆔 ID événement extrait:', eventId);
+
+            // Show success message with links
+            let successHtml = `
+                <div style="color: #28a745; padding: 15px; background: #d4edda; border: 1px solid #c3e6cb; border-radius: 4px;">
+                    <i class="fas fa-check-circle"></i>
+                    <strong>✅ Événement créé avec succès !</strong>
+            `;
+
+            if (eventId) {
+                successHtml += `<br>ID: ${eventId}<br><br>
+                    <a href="/demo/by_id/${eventId}" style="color: #0078ff; text-decoration: none; font-weight: bold;">
+                        <i class="fas fa-eye"></i> Voir l'événement
+                    </a>
+                    |`;
+            } else {
+                successHtml += `<br><small>ID d'événement non disponible dans la réponse</small><br><br>`;
+            }
+
+            successHtml += `
+                    <a href="/demo" style="color: #0078ff; text-decoration: none; font-weight: bold;">
+                        <i class="fas fa-map"></i> Retour à la carte
+                    </a>
+                </div>
+            `;
+
+            resultElement.innerHTML = successHtml;
             resultElement.className = 'success';
 
             // Reset the form
@@ -280,11 +329,29 @@ document.addEventListener('DOMContentLoaded', function () {
                 previewContainer.style.display = 'none';
             }
 
+            // Remove marker from map
+            if (marker) {
+                marker.remove();
+                marker = null;
+                currentPosition = null;
+            }
+
             // Initialize the form again
             initForm();
+
+            // Re-validate form to disable submit button
+            validateForm();
         } catch (error) {
+            console.error('❌ Erreur lors de la création d\'événement:', error);
+
             // Show error message
-            resultElement.textContent = `Error: ${error.message}`;
+            resultElement.innerHTML = `
+                <div style="color: #dc3545; padding: 15px; background: #f8d7da; border: 1px solid #f5c6cb; border-radius: 4px;">
+                    <i class="fas fa-exclamation-triangle"></i>
+                    <strong>❌ Erreur lors de la création de l'événement</strong>
+                    <br><small>${error.message}</small>
+                </div>
+            `;
             resultElement.className = 'error';
         }
     }
@@ -325,7 +392,7 @@ document.addEventListener('DOMContentLoaded', function () {
 
 // Setup form validation
     function setupFormValidation() {
-        const form = document.getElementById('trafficForm');
+        const form = document.getElementById('reportForm');
         if (!form) return;
 
         // Get all form fields that need validation
@@ -359,7 +426,7 @@ document.addEventListener('DOMContentLoaded', function () {
         }
 
         // Initial validation
-        validateForm();
+        // validateForm();
     }
 
 
@@ -376,7 +443,7 @@ function clearFieldError(element) {
 }
 // Validate the entire form
 function validateForm() {
-    const form = document.getElementById('trafficForm');
+    const form = document.getElementById('reportForm');
     const submitButton = document.getElementById('report_issue_button');
 
     if (!form || !submitButton) {