Spaces:

Docfile
/

Flasksite

Running

App Files Files Community

Docfile commited on 17 days ago

Commit

0818a0a

verified ·

1 Parent(s): 533067f

Upload philosophie.html

Browse files

Files changed (1) hide show

templates/philosophie.html +88 -111

templates/philosophie.html CHANGED Viewed

@@ -1,4 +1,4 @@
-<!DOCTYPE html>
 <html lang="fr">
 <head>
     <meta charset="UTF-8">
@@ -110,6 +110,7 @@
             font-size: 0.875em;
         }
         .active, .collapsible:hover {
             background-color: #ddd;
         }
@@ -185,6 +186,7 @@
             padding: 0.5rem 0.75rem;
         }
          .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable{
              background-color: #ede9fe;
              color:#374151;
@@ -241,16 +243,14 @@
                 <!-- Content Section -->
                 <div class="p-8 space-y-8">
-                  <form id="philo-form" method="POST" action="/submit_philo" enctype="multipart/form-data">
                     <!-- Type Selection -->
                     <div class="space-y-3">
                         <label class="block text-sm font-medium text-gray-700">Type de dissertation</label>
                         <div class="relative">
-                            <select id="type-select" name="type" class="w-full rounded-xl border-gray-200 shadow-sm focus:border-violet-500 focus:ring-violet-500 appearance-none bg-white py-3 px-4 pr-10">
                                 <option value="1">Type 1</option>
                                 <option value="2">Type 2</option>
                                 <option value="3">Synthèse</option>
-                                <option value="4">Image</option>
                             </select>
                             <div class="absolute inset-y-0 right-0 flex items-center px-4 pointer-events-none">
                                 <svg class="h-5 w-5 text-gray-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
@@ -264,9 +264,9 @@
                     </div>
                     <!-- Course Selection -->
-                     <div id="course-selection" class="space-y-3">
                         <label class="block text-sm font-medium text-gray-700">Sélection du cours</label>
-                            <select id="course-select" name="courseId" class="w-full">
                                 <option value="">Choisir un cours...</option>
                              </select>
                             <div class="course-meta hidden">
@@ -289,21 +289,12 @@
                         </div>
                     </div>
-                     <!-- Image Upload -->
-                    <div id="image-upload" class="space-y-3 hidden">
-                        <label class="block text-sm font-medium text-gray-700">Télécharger des images</label>
-                        <input type="file" name="file" id="file-input" multiple accept=".jpg,.jpeg,.png" class="hidden">
-                        <label for="file-input" class="cursor-pointer bg-white py-2 px-4 border border-gray-300 rounded-md shadow-sm text-sm font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
-                            <span>Choisir des fichiers</span>
-                        </label>
-                        <div id="selected-files" class="mt-2 text-sm text-gray-500"></div>
-                    </div>
                     <!-- Question Input -->
-                    <div id="question-input" class="space-y-3 hidden">
                         <label class="block text-sm font-medium text-gray-700">Sujet de dissertation</label>
                         <div class="relative">
-                            <textarea id="question" name="question" rows="4"
                                 class="w-full rounded-xl border-gray-200 shadow-sm focus:border-violet-500 focus:ring-violet-500 resize-none bg-white py-3 px-4"
                                 placeholder="Saisissez votre sujet de dissertation..."></textarea>
                             <div class="absolute bottom-3 right-3 flex items-center space-x-2 text-gray-400">
@@ -315,7 +306,7 @@
                     </div>
                     <!-- Submit Button -->
-                    <button id="submit-btn" type="submit" class="w-full py-4 px-6 rounded-xl bg-gradient-to-r from-violet-600 to-indigo-600 text-white font-medium shadow-lg shadow-violet-200 hover:shadow-xl hover:shadow-violet-300 transform hover:-translate-y-0.5 transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-violet-500 focus:ring-offset-2">
                         <span class="flex items-center justify-center space-x-2">
                             <svg class="h-5 w-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                 <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z" />
@@ -323,7 +314,6 @@
                             <span>Générer la dissertation</span>
                         </span>
                     </button>
-                  </form>
                     <!-- Response Section -->
                     <div id="response" class="hidden mt-8 prose prose-violet max-w-none">
@@ -420,103 +410,13 @@
             let labelText;
                 if(type === '3') {
                      labelText = 'S - Synthèse';
-                } else if (type === '4') {
-                 $('#image-upload').removeClass('hidden');
-                 $('#question-input').addClass('hidden');
-                 $('#course-selection').addClass('hidden');
-                 labelText = 'Image';
-            } else {
-                $('#image-upload').addClass('hidden');
-                $('#question-input').removeClass('hidden');
-                $('#course-selection').removeClass('hidden');
                   labelText = `Type ${type} - ${typeLabel}`;
                 }
             $('#current-type-label').text(labelText);
          });
-        $('#file-input').change(function() {
-            const files = this.files;
-            const fileNames = Array.from(files).map(file => file.name).join(', ');
-            $('#selected-files').text(fileNames);
-        });
-        // Gestion de la soumission avec conversion en Markdown et sauvegarde
-        $('#philo-form').on('submit', function(e) {
-            e.preventDefault();
-            const question = $('#question').val().trim();
-            const type = $('#type-select').val();
-            if (!question && type !== '4') {
-                // Gestion de l'erreur si la question est vide (inchangée)
-                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>
-                        </div>
-                    </div>
-                `,
-                allowOutsideClick: false,
-                showConfirmButton: false,
-                customClass: {
-                    popup: 'rounded-2xl'
-                }
-            });
-            const formData = new FormData(this);
-            $.ajax({
-                url: '/submit_philo',
-                method: 'POST',
-                data: formData,
-                processData: false,
-                contentType: false,
-                success: function(data) {
-                    Swal.close();
-                    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');
-                    // Sauvegarder la dissertation
-                    saveDissertation(question, data.response);
-                    Toast.fire({
-                        icon: 'success',
-                        title: 'Dissertation générée et sauvegardée avec succès',
-                        timer: 2000
-                    });
-                },
-                error: function() {
-                    Swal.fire({
-                        icon: 'error',
-                        title: 'Erreur de génération',
-                        text: 'Une erreur est survenue lors de la génération de votre dissertation.',
-                        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'
-                        }
-                    });
-                }
-            });
-        });
         // Chargement des cours avec animation
           function loadCourses() {
             return $.ajax({
@@ -594,6 +494,83 @@
         });
        function saveDissertation(title, content) {
             let savedDissertations = JSON.parse(localStorage.getItem('dissertations')) || [];
             savedDissertations.push({ title, content, timestamp: Date.now() });
@@ -720,7 +697,7 @@
                             textarea.value = textToCopy;
                             textarea.style.position = 'fixed'; // Évite le défilement
                             textarea.style.opacity = '0';
-                                                        document.body.appendChild(textarea);
                             // Sélectionner et copier le texte
                             textarea.select();

+ <!DOCTYPE html>
 <html lang="fr">
 <head>
     <meta charset="UTF-8">
             font-size: 0.875em;
         }
         .active, .collapsible:hover {
             background-color: #ddd;
         }
             padding: 0.5rem 0.75rem;
         }
          .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable{
              background-color: #ede9fe;
              color:#374151;
                 <!-- Content Section -->
                 <div class="p-8 space-y-8">
                     <!-- Type Selection -->
                     <div class="space-y-3">
                         <label class="block text-sm font-medium text-gray-700">Type de dissertation</label>
                         <div class="relative">
+                            <select id="type-select" class="w-full rounded-xl border-gray-200 shadow-sm focus:border-violet-500 focus:ring-violet-500 appearance-none bg-white py-3 px-4 pr-10">
                                 <option value="1">Type 1</option>
                                 <option value="2">Type 2</option>
                                 <option value="3">Synthèse</option>
                             </select>
                             <div class="absolute inset-y-0 right-0 flex items-center px-4 pointer-events-none">
                                 <svg class="h-5 w-5 text-gray-400" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
                     </div>
                     <!-- Course Selection -->
+                     <div class="space-y-3">
                         <label class="block text-sm font-medium text-gray-700">Sélection du cours</label>
+                            <select id="course-select" class="w-full">
                                 <option value="">Choisir un cours...</option>
                              </select>
                             <div class="course-meta hidden">
                         </div>
                     </div>
                     <!-- Question Input -->
+                    <div class="space-y-3">
                         <label class="block text-sm font-medium text-gray-700">Sujet de dissertation</label>
                         <div class="relative">
+                            <textarea id="question" rows="4"
                                 class="w-full rounded-xl border-gray-200 shadow-sm focus:border-violet-500 focus:ring-violet-500 resize-none bg-white py-3 px-4"
                                 placeholder="Saisissez votre sujet de dissertation..."></textarea>
                             <div class="absolute bottom-3 right-3 flex items-center space-x-2 text-gray-400">
                     </div>
                     <!-- Submit Button -->
+                    <button id="submit-btn" class="w-full py-4 px-6 rounded-xl bg-gradient-to-r from-violet-600 to-indigo-600 text-white font-medium shadow-lg shadow-violet-200 hover:shadow-xl hover:shadow-violet-300 transform hover:-translate-y-0.5 transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-violet-500 focus:ring-offset-2">
                         <span class="flex items-center justify-center space-x-2">
                             <svg class="h-5 w-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                 <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z" />
                             <span>Générer la dissertation</span>
                         </span>
                     </button>
                     <!-- Response Section -->
                     <div id="response" class="hidden mt-8 prose prose-violet max-w-none">
             let labelText;
                 if(type === '3') {
                      labelText = 'S - Synthèse';
+                } else {
                   labelText = `Type ${type} - ${typeLabel}`;
                 }
             $('#current-type-label').text(labelText);
          });
         // Chargement des cours avec animation
           function loadCourses() {
             return $.ajax({
         });
+        // Gestion de la soumission avec conversion en Markdown et sauvegarde
+         $('#submit-btn').click(function() {
+            const question = $('#question').val().trim();
+            if (!question) {
+                // Gestion de l'erreur si la question est vide (inchangée)
+                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>
+                            </div>
+                        </div>
+                    `,
+                    allowOutsideClick: false,
+                    showConfirmButton: false,
+                    customClass: {
+                        popup: 'rounded-2xl'
+                    }
+                });
+            const data = {
+                question: question,
+                type: $('#type-select').val(),
+                courseId: $('#course-select').val() || null
+            };
+            $.ajax({
+                url: '/submit_philo',
+                method: 'POST',
+                contentType: 'application/json',
+                data: JSON.stringify(data),
+                success: function(data) {
+                    Swal.close();
+                    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');
+                    // Sauvegarder la dissertation
+                    saveDissertation(question, data.response);
+                    Toast.fire({
+                        icon: 'success',
+                        title: 'Dissertation générée et sauvegardée avec succès',
+                        timer: 2000
+                    });
+                },
+                error: function() {
+                     Swal.fire({
+                        icon: 'error',
+                        title: 'Erreur de génération',
+                        text: 'Une erreur est survenue lors de la génération de votre dissertation.',
+                        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'
+                        }
+                    });
+                }
+            });
+        });
        function saveDissertation(title, content) {
             let savedDissertations = JSON.parse(localStorage.getItem('dissertations')) || [];
             savedDissertations.push({ title, content, timestamp: Date.now() });
                             textarea.value = textToCopy;
                             textarea.style.position = 'fixed'; // Évite le défilement
                             textarea.style.opacity = '0';
+                            document.body.appendChild(textarea);
                             // Sélectionner et copier le texte
                             textarea.select();