Hugging Face's logo

Spaces:
Docfile
/
Serveur
Runtime error

App Files Community
1
Docfile commited on
Commit
0696ad1
·
verified ·
1 Parent(s): c00a085

Update templates/math.html

Browse files
Files changed (1) hide show
  1. templates/math.html +103 -39
templates/math.html CHANGED
@@ -15,6 +15,9 @@
15
  <!-- Font Awesome pour les icônes -->
16
  <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
17
 
 
 
 
18
  <style>
19
  /* Styles personnalisés */
20
  .dropzone {
@@ -62,6 +65,25 @@
62
  .math-hidden {
63
  visibility: hidden;
64
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
65
  </style>
66
 
67
  <!-- Configuration de MathJax -->
@@ -125,6 +147,7 @@
125
 
126
  <!-- localForage pour le stockage local -->
127
  <script src="https://cdn.jsdelivr.net/npm/localforage@1.10.0/dist/localforage.min.js"></script>
 
128
  </head>
129
 
130
  <body class="min-h-screen bg-gradient-to-br from-blue-50 to-white">
@@ -181,13 +204,16 @@
181
 
182
  <!-- Réponses sauvegardées -->
183
  <div id="savedResponsesSection" class="mt-8">
184
- <h2 class="text-2xl font-semibold text-blue-800 mb-4">Réponses Sauvegardées</h2>
185
- <div id="savedResponses" class="space-y-4">
 
 
 
 
 
 
186
  <!-- Les réponses sauvegardées seront affichées ici -->
187
  </div>
188
- <button id="clearSavedResponses" class="mt-4 px-4 py-2 bg-red-600 hover:bg-red-700 text-white rounded-lg transition-colors duration-200">
189
- Effacer les réponses sauvegardées
190
- </button>
191
  </div>
192
 
193
  <!-- Message d'erreur -->
@@ -348,55 +374,93 @@
348
 
349
  // Fonction pour effacer toutes les réponses sauvegardées
350
  async function clearSavedResponses() {
351
- try {
352
- await localforage.clear();
353
- console.log('Réponses sauvegardées effacées');
354
- // Recharger les réponses affichées après l'effacement
355
- loadSavedResponses();
356
- } catch (error) {
357
- console.error('Erreur lors de l\'effacement des réponses sauvegardées:', error);
358
- showError('Erreur lors de l\'effacement des réponses sauvegardées');
359
- }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
360
  }
361
 
362
  // Fonction pour charger et afficher les réponses sauvegardées
363
  async function loadSavedResponses() {
364
  try {
365
- savedResponsesContainer.innerHTML = ''; // Effacer les réponses précédentes
366
  const keys = await localforage.keys();
367
  keys.sort((a, b) => parseInt(b.replace('response-', '')) - parseInt(a.replace('response-', '')));
368
 
369
  for (const key of keys) {
370
  const response = await localforage.getItem(key);
371
- const responseDiv = document.createElement('div');
372
- responseDiv.className = 'bg-white rounded-lg shadow-md p-4';
373
-
374
- const responseContent = document.createElement('div');
375
- responseContent.className = 'math-content math-hidden';
376
- responseContent.innerHTML = marked.parse(response);
377
- responseDiv.appendChild(responseContent);
378
-
379
- // Bouton de suppression pour chaque réponse
380
- const deleteButton = document.createElement('button');
381
- deleteButton.innerHTML = '<i class="fas fa-trash"></i>'; // Icône Font Awesome pour la poubelle
382
- deleteButton.className = 'mt-2 px-2 py-1 bg-red-500 hover:bg-red-700 text-white rounded-sm text-xs';
383
- deleteButton.onclick = async function () {
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
384
  try {
385
  await localforage.removeItem(key);
386
  console.log('Réponse supprimée:', key);
387
- responseDiv.remove(); // Supprimer la réponse de l'affichage
388
  } catch (error) {
389
  console.error('Erreur lors de la suppression de la réponse:', error);
390
  showError('Erreur lors de la suppression de la réponse');
391
  }
392
- };
393
- responseDiv.appendChild(deleteButton); // Ajouter le bouton de suppression à la réponse
394
-
395
- await MathJax.typesetPromise([responseContent]);
396
- responseContent.classList.remove('math-hidden');
397
-
398
- savedResponsesContainer.appendChild(responseDiv);
399
 
 
 
400
  }
401
  } catch (error) {
402
  console.error('Erreur lors du chargement des réponses sauvegardées:', error);
@@ -440,7 +504,7 @@
440
 
441
  } catch (error) {
442
  console.error('Erreur:', error);
443
- showError(error.message || 'Une erreur est survenue lors du traitement');
444
  } finally {
445
  loading.classList.remove('active');
446
  submitButton.disabled = false;
@@ -452,10 +516,10 @@
452
 
453
  // Gestionnaire d'événement pour effacer les réponses sauvegardées
454
  clearSavedResponsesButton.addEventListener('click', clearSavedResponses);
 
455
  });
456
 
457
  </script>
458
  </body>
459
 
460
- </html>
461
-
 
15
  <!-- Font Awesome pour les icônes -->
16
  <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
17
 
18
+ <!-- SweetAlert2 -->
19
+ <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
20
+
21
  <style>
22
  /* Styles personnalisés */
23
  .dropzone {
 
65
  .math-hidden {
66
  visibility: hidden;
67
  }
68
+
69
+ .saved-response-header {
70
+ cursor: pointer;
71
+ display: flex;
72
+ justify-content: space-between;
73
+ align-items: center;
74
+ padding: 0.75rem 1rem;
75
+ background-color: #f3f4f6;
76
+ border-bottom: 1px solid #e5e7eb;
77
+ }
78
+
79
+ .saved-response-content {
80
+ padding: 1rem;
81
+ display: none;
82
+ }
83
+
84
+ .saved-response-item.open .saved-response-content {
85
+ display: block;
86
+ }
87
  </style>
88
 
89
  <!-- Configuration de MathJax -->
 
147
 
148
  <!-- localForage pour le stockage local -->
149
  <script src="https://cdn.jsdelivr.net/npm/localforage@1.10.0/dist/localforage.min.js"></script>
150
+
151
  </head>
152
 
153
  <body class="min-h-screen bg-gradient-to-br from-blue-50 to-white">
 
204
 
205
  <!-- Réponses sauvegardées -->
206
  <div id="savedResponsesSection" class="mt-8">
207
+ <div class="flex justify-between items-center mb-4">
208
+ <h2 class="text-2xl font-semibold text-blue-800">Réponses Sauvegardées</h2>
209
+ <button id="clearSavedResponses"
210
+ class="px-4 py-2 bg-red-600 hover:bg-red-700 text-white rounded-lg transition-colors duration-200">
211
+ <i class="fas fa-trash-alt"></i> Effacer Tout
212
+ </button>
213
+ </div>
214
+ <div id="savedResponses" class="space-y-2">
215
  <!-- Les réponses sauvegardées seront affichées ici -->
216
  </div>
 
 
 
217
  </div>
218
 
219
  <!-- Message d'erreur -->
 
374
 
375
  // Fonction pour effacer toutes les réponses sauvegardées
376
  async function clearSavedResponses() {
377
+ Swal.fire({
378
+ title: 'Êtes-vous sûr?',
379
+ text: "Vous ne pourrez pas revenir en arrière!",
380
+ icon: 'warning',
381
+ showCancelButton: true,
382
+ confirmButtonColor: '#d33',
383
+ cancelButtonColor: '#3085d6',
384
+ confirmButtonText: 'Oui, effacer!',
385
+ cancelButtonText: 'Annuler'
386
+ }).then(async (result) => {
387
+ if (result.isConfirmed) {
388
+ try {
389
+ await localforage.clear();
390
+ console.log('Réponses sauvegardées effacées');
391
+ loadSavedResponses();
392
+ Swal.fire(
393
+ 'Effacé!',
394
+ 'Les réponses ont été supprimées.',
395
+ 'success'
396
+ );
397
+ } catch (error) {
398
+ console.error('Erreur lors de l\'effacement des réponses sauvegardées:', error);
399
+ showError('Erreur lors de l\'effacement des réponses sauvegardées');
400
+ Swal.fire(
401
+ 'Erreur!',
402
+ 'Une erreur est survenue lors de la suppression.',
403
+ 'error'
404
+ );
405
+ }
406
+ }
407
+ });
408
  }
409
 
410
  // Fonction pour charger et afficher les réponses sauvegardées
411
  async function loadSavedResponses() {
412
  try {
413
+ savedResponsesContainer.innerHTML = '';
414
  const keys = await localforage.keys();
415
  keys.sort((a, b) => parseInt(b.replace('response-', '')) - parseInt(a.replace('response-', '')));
416
 
417
  for (const key of keys) {
418
  const response = await localforage.getItem(key);
419
+ const responseItem = document.createElement('div');
420
+ responseItem.className = 'saved-response-item bg-white rounded-lg shadow-md overflow-hidden';
421
+
422
+ const header = document.createElement('div');
423
+ header.className = 'saved-response-header';
424
+ header.innerHTML = `
425
+ <span class="text-blue-800 font-medium">Réponse du ${new Date(parseInt(key.replace('response-', ''))).toLocaleString()}</span>
426
+ <div>
427
+ <button class="toggle-content px-1 py-0.5 rounded-md text-xs bg-blue-500 hover:bg-blue-700 text-white mr-1"><i class="fas fa-chevron-down"></i></button>
428
+ <button class="delete-response px-1 py-0.5 rounded-md text-xs bg-red-500 hover:bg-red-700 text-white"><i class="fas fa-trash-alt"></i></button>
429
+ </div>
430
+ `;
431
+ responseItem.appendChild(header);
432
+
433
+ const content = document.createElement('div');
434
+ content.className = 'saved-response-content math-content math-hidden';
435
+ content.innerHTML = marked.parse(response);
436
+ responseItem.appendChild(content);
437
+
438
+ savedResponsesContainer.appendChild(responseItem);
439
+
440
+ // Gestionnaire d'événement pour afficher/masquer le contenu
441
+ header.querySelector('.toggle-content').addEventListener('click', () => {
442
+ responseItem.classList.toggle('open');
443
+ header.querySelector('i').classList.toggle('fa-chevron-down');
444
+ header.querySelector('i').classList.toggle('fa-chevron-up');
445
+ MathJax.typesetPromise([content]);
446
+ content.classList.remove('math-hidden');
447
+
448
+ });
449
+
450
+ // Gestionnaire d'événement pour supprimer la réponse
451
+ header.querySelector('.delete-response').addEventListener('click', async () => {
452
  try {
453
  await localforage.removeItem(key);
454
  console.log('Réponse supprimée:', key);
455
+ responseItem.remove();
456
  } catch (error) {
457
  console.error('Erreur lors de la suppression de la réponse:', error);
458
  showError('Erreur lors de la suppression de la réponse');
459
  }
460
+ });
 
 
 
 
 
 
461
 
462
+ MathJax.typesetPromise([content]);
463
+ content.classList.remove('math-hidden');
464
  }
465
  } catch (error) {
466
  console.error('Erreur lors du chargement des réponses sauvegardées:', error);
 
504
 
505
  } catch (error) {
506
  console.error('Erreur:', error);
507
+ showError(error.message || 'Une erreur est survenue lors du traitement');
508
  } finally {
509
  loading.classList.remove('active');
510
  submitButton.disabled = false;
 
516
 
517
  // Gestionnaire d'événement pour effacer les réponses sauvegardées
518
  clearSavedResponsesButton.addEventListener('click', clearSavedResponses);
519
+
520
  });
521
 
522
  </script>
523
  </body>
524
 
525
+ </html>