Docfile commited on
Commit
dc3a9d2
·
verified ·
1 Parent(s): e308f1f

Update templates/index.html

Browse files
Files changed (1) hide show
  1. templates/index.html +17 -19
templates/index.html CHANGED
@@ -603,14 +603,13 @@
603
  header.className = 'mb-8 text-center';
604
  header.innerHTML = `
605
  <h2 class="text-3xl font-bold text-gray-800 mb-2">Vos Flashcards (${flashcards.length})</h2>
606
- <p class="text-gray-600">Cliquez sur une carte pour la retourner et voir la réponse</p>
 
 
 
 
 
607
  <div class="flex items-center justify-center space-x-4 mt-6">
608
- <button id="printBtn" class="btn-secondary text-sm">
609
- <i class="fas fa-print mr-2"></i> Imprimer
610
- </button>
611
- <button id="saveBtn" class="btn-secondary text-sm">
612
- <i class="fas fa-save mr-2"></i> Enregistrer
613
- </button>
614
  <button id="shareBtn" class="btn-secondary text-sm">
615
  <i class="fas fa-share-alt mr-2"></i> Partager
616
  </button>
@@ -666,11 +665,7 @@
666
  <i class="fas fa-plus mr-2"></i> Nouveau sujet
667
  </button>
668
  </div>
669
- <div class="text-center mt-2">
670
- <p class="text-gray-500 text-sm">
671
- <i class="far fa-lightbulb mr-1"></i> Astuce : Essayez de répondre mentalement avant de retourner la carte
672
- </p>
673
- </div>
674
  `;
675
  flashcardsContainer.appendChild(controls);
676
 
@@ -782,23 +777,25 @@
782
  const explanationElement = document.getElementById(`explanation-${qIdx}`);
783
 
784
  // Vérifier la réponse
 
785
  if (selected === correct) {
786
  // Réponse correcte
787
  document.getElementById(`option-${qIdx}-${oIdx}`).classList.add('correct');
788
  currentScore++;
789
  document.getElementById('score').textContent = currentScore;
790
-
791
  // Afficher une animation de succès
792
  const successIcon = this.nextElementSibling.querySelector('.success-icon');
793
  successIcon.classList.remove('hidden');
 
794
  } else {
795
  // Réponse incorrecte
796
  document.getElementById(`option-${qIdx}-${oIdx}`).classList.add('incorrect');
797
-
798
  // Afficher une animation d'erreur
799
  const errorIcon = this.nextElementSibling.querySelector('.error-icon');
800
  errorIcon.classList.remove('hidden');
801
-
802
  // Mettre en évidence la bonne réponse
803
  options.forEach((opt, idx) => {
804
  if (opt.value === correct) {
@@ -807,18 +804,19 @@
807
  successIcon.classList.remove('hidden');
808
  }
809
  });
 
810
  }
811
-
812
  // Désactiver toutes les autres options
813
  options.forEach((opt) => {
814
  if (opt !== this) {
815
  opt.disabled = true;
816
  }
817
  });
818
-
819
  // Afficher l'explication
820
  explanationElement.classList.remove('hidden');
821
-
822
  // Animer le passage à la question suivante
823
  setTimeout(() => {
824
  const nextQuestion = document.getElementById(`question-${parseInt(qIdx) + 1}`);
@@ -833,7 +831,7 @@
833
  displayQuizResults(currentScore, quizQuestions.length);
834
  }
835
  }
836
- }, 1500);
837
  });
838
  });
839
  });
 
603
  header.className = 'mb-8 text-center';
604
  header.innerHTML = `
605
  <h2 class="text-3xl font-bold text-gray-800 mb-2">Vos Flashcards (${flashcards.length})</h2>
606
+ <p >Cliquez sur une carte pour la retourner et voir la réponse.</p>
607
+ <p class="text-gray-600">
608
+ <i class="far fa-lightbulb mr-1"></i> Astuce : Essayez de répondre mentalement avant de retourner la carte
609
+ </p>
610
+ <p><div class="flex items-center justify-center space-x-4 mt-6">
611
+ </div></p>
612
  <div class="flex items-center justify-center space-x-4 mt-6">
 
 
 
 
 
 
613
  <button id="shareBtn" class="btn-secondary text-sm">
614
  <i class="fas fa-share-alt mr-2"></i> Partager
615
  </button>
 
665
  <i class="fas fa-plus mr-2"></i> Nouveau sujet
666
  </button>
667
  </div>
668
+
 
 
 
 
669
  `;
670
  flashcardsContainer.appendChild(controls);
671
 
 
777
  const explanationElement = document.getElementById(`explanation-${qIdx}`);
778
 
779
  // Vérifier la réponse
780
+ let delay = 0; // Initialiser le délai
781
  if (selected === correct) {
782
  // Réponse correcte
783
  document.getElementById(`option-${qIdx}-${oIdx}`).classList.add('correct');
784
  currentScore++;
785
  document.getElementById('score').textContent = currentScore;
786
+
787
  // Afficher une animation de succès
788
  const successIcon = this.nextElementSibling.querySelector('.success-icon');
789
  successIcon.classList.remove('hidden');
790
+ delay = 2000; // 2 secondes pour une réponse correcte
791
  } else {
792
  // Réponse incorrecte
793
  document.getElementById(`option-${qIdx}-${oIdx}`).classList.add('incorrect');
794
+
795
  // Afficher une animation d'erreur
796
  const errorIcon = this.nextElementSibling.querySelector('.error-icon');
797
  errorIcon.classList.remove('hidden');
798
+
799
  // Mettre en évidence la bonne réponse
800
  options.forEach((opt, idx) => {
801
  if (opt.value === correct) {
 
804
  successIcon.classList.remove('hidden');
805
  }
806
  });
807
+ delay = 5000; // 5 secondes pour une réponse incorrecte
808
  }
809
+
810
  // Désactiver toutes les autres options
811
  options.forEach((opt) => {
812
  if (opt !== this) {
813
  opt.disabled = true;
814
  }
815
  });
816
+
817
  // Afficher l'explication
818
  explanationElement.classList.remove('hidden');
819
+
820
  // Animer le passage à la question suivante
821
  setTimeout(() => {
822
  const nextQuestion = document.getElementById(`question-${parseInt(qIdx) + 1}`);
 
831
  displayQuizResults(currentScore, quizQuestions.length);
832
  }
833
  }
834
+ }, delay);
835
  });
836
  });
837
  });