Upload philosophie.html

templates/philosophie.html

@@ -110,7 +110,6 @@
             font-size: 0.875em;
         }
 
-
         .active, .collapsible:hover {
             background-color: #ddd;
         }
@@ -186,7 +185,6 @@
             padding: 0.5rem 0.75rem;
         }
 
-
          .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable{
              background-color: #ede9fe;
              color:#374151;
@@ -289,7 +287,6 @@
                         </div>
                     </div>
 
-
                     <!-- Question Input -->
                     <div class="space-y-3">
                         <label class="block text-sm font-medium text-gray-700">Sujet de dissertation</label>
@@ -490,38 +487,38 @@
 
         });
 
-        // Gestion de la soumission avec conversion en Markdown et sauvegarde
-         $('#submit-btn').click(function() {
+         // Gestion de la soumission avec streaming
+        $('#submit-btn').click(function() {
             const question = $('#question').val().trim();
 
             if (!question) {
-                // Gestion de l'erreur si la question est vide (inchangée)
+                // Gestion de l'erreur si la question est vide
                 return;
             }
 
             // Animation de chargement sophistiquée
-                Swal.fire({
-                    title: 'Génération en cours',
-                    html: `
-                        <div class="space-y-4">
-                            <div class="flex justify-center">
-                                <div class="w-16 h-16 relative">
-                                    <div class="absolute inset-0 rounded-full border-4 border-violet-200 animate-ping"></div>
-                                    <div class="absolute inset-0 rounded-full border-4 border-violet-500 animate-pulse"></div>
-                                </div>
-                            </div>
-                            <div class="text-gray-600">
-                                <p class="animate-pulse">Analyse philosophique en cours...</p>
-                                <p class="text-sm mt-2 text-gray-500">Veuillez patienter quelques instants</p>
+            Swal.fire({
+                title: 'Génération en cours',
+                html: `
+                    <div class="space-y-4">
+                        <div class="flex justify-center">
+                            <div class="w-16 h-16 relative">
+                                <div class="absolute inset-0 rounded-full border-4 border-violet-200 animate-ping"></div>
+                                <div class="absolute inset-0 rounded-full border-4 border-violet-500 animate-pulse"></div>
                             </div>
                         </div>
-                    `,
-                    allowOutsideClick: false,
-                    showConfirmButton: false,
-                    customClass: {
-                        popup: 'rounded-2xl'
-                    }
-                });
+                        <div class="text-gray-600">
+                            <p class="animate-pulse">Analyse philosophique en cours...</p>
+                            <p class="text-sm mt-2 text-gray-500">Veuillez patienter quelques instants</p>
+                        </div>
+                    </div>
+                `,
+                allowOutsideClick: false,
+                showConfirmButton: false,
+                customClass: {
+                    popup: 'rounded-2xl'
+                }
+            });
 
             const data = {
                 question: question,
@@ -529,43 +526,59 @@
                 courseId: $('#course-select').val() || null
             };
 
-            $.ajax({
-                url: '/submit_philo',
-                method: 'POST',
-                contentType: 'application/json',
-                data: JSON.stringify(data),
-                success: function(data) {
-                    Swal.close();
+            // Utilisation de EventSource pour le streaming
+            const source = new EventSource('/submit_philo?data=' + encodeURIComponent(JSON.stringify(data)));
 
-                    const htmlContent = marked.parse(data.response);
-                     // Afficher la dissertation
-                    $('#response > div').html(htmlContent);
-                    $('#response').removeClass('hidden').addClass('animate-fadeIn');
-                    $('#copy-btn').removeClass('hidden').addClass('animate-slideUp');
+            let fullResponse = '';
+            $('#response > div').html(''); // Effacer le contenu précédent
+            $('#response').removeClass('hidden').addClass('animate-fadeIn');
+            $('#copy-btn').removeClass('hidden').addClass('animate-slideUp');
 
-                    // Sauvegarder la dissertation
-                    saveDissertation(question, data.response);
+            source.onmessage = function(event) {
+                const parsedData = JSON.parse(event.data);
 
-                    Toast.fire({
-                        icon: 'success',
-                        title: 'Dissertation générée et sauvegardée avec succès',
-                        timer: 2000
-                    });
-                },
-                error: function() {
-                     Swal.fire({
+                if (parsedData.error) {
+                    source.close();
+                    Swal.fire({
                         icon: 'error',
                         title: 'Erreur de génération',
-                        text: 'Une erreur est survenue lors de la génération de votre dissertation.',
+                        text: parsedData.error,
                         customClass: {
                             popup: 'rounded-2xl',
                             confirmButton: 'bg-violet-600 hover:bg-violet-700 text-white font-medium py-2 px-4 rounded-lg transition-colors duration-200'
                         }
                     });
+                } else {
+                    fullResponse += parsedData.response;
+                    const htmlContent = marked.parse(fullResponse);
+                    $('#response > div').html(htmlContent);
                 }
-            });
-        });
+            };
 
+            source.onerror = function(err) {
+                console.error("EventSource failed:", err);
+                source.close();
+                Swal.fire({
+                    icon: 'error',
+                    title: 'Erreur de connexion',
+                    text: 'Une erreur est survenue lors de la connexion au serveur.',
+                    customClass: {
+                        popup: 'rounded-2xl',
+                        confirmButton: 'bg-violet-600 hover:bg-violet-700 text-white font-medium py-2 px-4 rounded-lg transition-colors duration-200'
+                    }
+                });
+            };
+            
+            source.onclose = function() {
+                Swal.close();
+                saveDissertation(question, fullResponse);
+                Toast.fire({
+                    icon: 'success',
+                    title: 'Dissertation générée et sauvegardée avec succès',
+                    timer: 2000
+                });
+            }
+        });
 
        function saveDissertation(title, content) {
             let savedDissertations = JSON.parse(localStorage.getItem('dissertations')) || [];
@@ -727,7 +740,7 @@
                             Toast.fire({
                                 icon: 'error',
                                 title: 'Erreur de copie',
-                                text: 'Impossible de copier le contenu',
+                                        text: 'Impossible de copier le contenu',
                                 timer: 3000
                             });
                         }