Add files via upload

RobbieFR · web-flow · commit 62ff2bca5eaa · 2023-12-22T16:08:53.000+01:00
diff --git a/quizz/EsiQuizzPNG.png b/quizz/EsiQuizzPNG.png
diff --git a/quizz/index.html b/quizz/index.html
@@ -2,7 +2,7 @@
 <html>
 <head>
 
-  <title>EsarQuizz</title>
+  <title>EsiQuizz</title>
   <link rel="stylesheet" href="styles.css">
   <link rel="icon" href="EsarQuizzPNG.png">
 
@@ -21,7 +21,7 @@
  <div class="app">
       
       <!-- <img src="EsarQuizzPNG.png" vertical-align: middle; width="50"  height="50" > </img> -->
-      <h1>  EsarQuizz </h1>
+      <h1>  EsiQuizz </h1>
       <div class="quizz">
         <h2 id="question"> Questions ici </h2>
         <div id="answer-buttons">
diff --git a/quizz/script.js b/quizz/script.js
@@ -84,6 +84,23 @@ function showQuestion(){
       }
     };
 
+    for (let i = 0; i < questions[0].content.length; i++ ){
+      var currentQuestion = document.getElementById(i);
+      console.log(currentQuestion);
+      if( i == currentQuestionIndex ){
+        currentQuestion.style.width = "35px";
+        currentQuestion.style.height = "35px";
+        currentQuestion.style.borderRadius = "15px";
+        currentQuestion.style.background = "#5b52bf";
+        currentQuestion.style.color = "#FFF";
+        currentQuestion.style.fontWeight = "bold";
+      }else{
+        currentQuestion.style.width = "30px";
+        currentQuestion.style.height = "30px";
+        currentQuestion.style.borderRadius = "12px";
+      }
+    }
+
     renderMathInElement(document.body);
     if(answer.correct){
       button.dataset.correct = answer.correct;
@@ -111,33 +128,18 @@ function showIndex(){
     var number = i;
     index.setAttribute('id', number);
 
-    indexButton.addEventListener("click", goToIdex);
-
 
     let currentQuestion = questions[0].content[currentQuestionIndex]; 
     //console.log(currentQuestion + "  " + currentQuestionIndex );
     indexButton.appendChild(index);
   }
 }
 
-function colorIndex(){
-  for(let i=0; i <= questions[0].content.length ; i++ ){
-    var index = document.getElementById('0');
-    //console.log(index.id);
-    if (tableVerite[i]=-1){index.style.backgroundColor = "#7e74e2";}
-    //else{index.style.backgroundColor = "#FAF";}
-    //data-answer-btn = "btn-" + i;
-  }
-  //console.log(tableVerite);
-  
-}
-
-function goToIdex(event){
-  const clickedButton = event.target
-  //console.log(clickedButton);
-  var questionDemandee = parseInt(clickedButton.dataset.index, 10);
-  currentQuestionIndex = questionDemandee -1
-  showQuestion();
+function colorIndex(index){
+  var button = document.getElementById(index);
+  if (tableVerite[index]== -1 ){button.style.backgroundColor = "#7e74e2";}
+  if (tableVerite[index]==  0 ){button.style.backgroundColor = "#ea9a9a";}
+  if (tableVerite[index]==  1 ){button.style.backgroundColor = "#9AEABC";}
 }
 
 
@@ -164,13 +166,16 @@ function selectAnswer(e){
   const isCorrect = selectedBtn.dataset.correct === "true";
   if(isCorrect){
     selectedBtn.classList.add("correct");
-    tableVerite[currentQuestionIndex]=1;
-    console.log(tableVerite);
+    tableVerite[currentQuestionIndex] = 1;
+    console.log("correct " + tableVerite)
     score++;
   }else{
     selectedBtn.classList.add("incorrect");
-    tableVerite[currentQuestionIndex]=0;
+    tableVerite[currentQuestionIndex] = 0;
+    console.log("incorrect " + tableVerite)
   }
+  console.log("colorindex " + tableVerite)
+  colorIndex(currentQuestionIndex);
   Array.from(answerButtons.children).forEach(button => {
     if(button.dataset.correct === "true"){
       button.classList.add("correct");
@@ -198,7 +203,6 @@ function handleNextButton(){
   currentQuestionIndex++;
   if(currentQuestionIndex < questions[0].content.length){
     showQuestion();
-    colorIndex()
   }else{
     showScore();
   }
@@ -209,6 +213,11 @@ nextButton.addEventListener("click", ()=>{
   if(currentQuestionIndex < questions[0].content.length){
     handleNextButton();
   }else{
+    for (let i=0; i<questions[0].content.length; i++){
+      var button = document.getElementById(i);
+      button.style.backgroundColor = "#7e74e2";
+    }
+    
     startQuizz();
   }
 });
diff --git a/quizz/styles.css b/quizz/styles.css
@@ -93,6 +93,8 @@ body{
   transition : all 0.3s;
   text-align: center;
   transition : all 0.3s;
+  cursor : pointer;
+  font-weight: bold;
 }
 
 .index:hover{

Original file line number	Diff line number	Diff line change
`@@ -93,6 +93,8 @@ body{`
`93`	`93`	`transition : all 0.3s;`
`94`	`94`	`text-align: center;`
`95`	`95`	`transition : all 0.3s;`
	`96`	`+ cursor : pointer;`
	`97`	`+ font-weight: bold;`
`96`	`98`	`}`
`97`	`99`
`98`	`100`	`.index:hover{`