Merge pull request #50 from Garima-149/main

My first commit
SnowScriptWinterOfCode · Jan 15, 2024 · 7758ccb · 7758ccb
2 parents 37c5acd + 8e194a9
commit 7758ccb
Show file tree

Hide file tree

Showing 7 changed files with 102 additions and 6 deletions.
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+    "liveServer.settings.port": 5501
+}
diff --git a/Dark/game.css b/Dark/game.css
@@ -85,7 +85,20 @@
   background-color: #56a5eb;
   width: 0%;
 }
-
+#display{
+  border:2px solid black;
+  border-radius: 5px;
+  width:100%;
+  margin-bottom:2px;
+  display:block;
+}
+#display{
+  border:2px solid black;
+  border-radius: 5px;
+  width:100%;
+  margin-bottom:2px;
+  display:block;
+}
 /* LOADER */
 #loader {
   border: 1.6rem solid white;

diff --git a/Dark/game.html b/Dark/game.html
@@ -37,7 +37,7 @@ <h1 class="hud-main-text" id="score">
             </h1>
           </div>
         </div>
-        <h2 id="question"></h2>
+        <h2 id="question1">Question </h2><h2 id="question"></h2>
         <div class="choice-container">
           <p class="choice-prefix">A</p>
           <p class="choice-text" data-number="1"></p>
@@ -54,12 +54,15 @@ <h2 id="question"></h2>
           <p class="choice-prefix">D</p>
           <p class="choice-text" data-number="4"></p>
         </div>
+
+        <h2 id="display">Correct option :</h2>
+
         <label for="un-mute" class="unmute" onclick="playpause()" id="playpauseBTN">
     <img src="http://upload.wikimedia.org/wikipedia/commons/3/3f/Mute_Icon.svg" alt="Mute_Icon.svg" title="Mute icon">
 </label>
 <label for="un-mute" class="mute" onclick="playpause()" id="playpauseBTN">
     <img src="http://upload.wikimedia.org/wikipedia/commons/2/21/Speaker_Icon.svg" alt="Speaker_Icon.svg" title="Unmute/speaker icon">
-</label>
+  </label>
         <footer>
           <button class="next_btn">Next Ques</button>
       </footer>

diff --git a/Dark/game.js b/Dark/game.js
@@ -9,6 +9,9 @@ const time_line = document.querySelector(".time .time_line");
 const timeText = document.querySelector(".timer .time_left_txt");
 const timeCount = document.querySelector(".timer .timer_sec");
 
+const question1= document.getElementById('question1');
+
+
 var soundCorrect = new Audio("sounds/correctAns.mp3");
 var soundIncorrect = new Audio("sounds/wrongAns.mp3");
 var myMusic = new Audio("sounds/gametheme.mp3");
@@ -82,6 +85,7 @@ getNewQuestion = () => {
         return window.location.assign('end.html');
     }
     questionCounter++;
+    question1.innerText = `Question  ${questionCounter}`;//update question number
     progressText.innerText = `Question ${questionCounter}/${MAX_QUESTIONS}`;
     //Update the progress bar
     progressBarFull.style.width = `${(questionCounter / MAX_QUESTIONS) * 100}%`;
@@ -137,7 +141,10 @@ choices.forEach((choice) => {
             soundCorrect.play();
         } else {
             soundIncorrect.play();
+            display(currentQuestion.answer);
         }
+        setInterval(displaynone,4000);
+
 
         selectedChoice.parentElement.classList.add(classToApply);
         setTimeout(() => {
@@ -194,7 +201,27 @@ function startTimerLine(time) {
         }
     }
 }
+let string;
+function display(string) {
+    let display = document.getElementById('display');
+    if (string == 1) { 
+    display.innerText = `Correct option : A`;
+    }
+    if (string == 2) { 
+        display.innerText = `Correct option : B`;
+    }
+    if (string == 3) { 
+        display.innerText = `Correct option : C`;
+    }
+    if (string == 4) { 
+        display.innerText = `Correct option : D`;
+        }
 
+}
+function displaynone() {
+    let display = document.getElementById('display');
+    display.innerText = `Correct option : `;
+}
 incrementScore = (num) => {
     score += num;
     scoreText.innerText = score;

diff --git a/Light/game.css b/Light/game.css
@@ -82,7 +82,13 @@
   background-color: #56a5eb;
   width: 0%;
 }
-
+#display{
+  border:2px solid black;
+  border-radius: 5px;
+  width:100%;
+  margin-bottom:2px;
+  display:block;
+}
 /* LOADER */
 #loader {
   border: 1.6rem solid white;

diff --git a/Light/game.html b/Light/game.html
@@ -7,6 +7,7 @@
     <title>Game-play</title>
     <link rel="stylesheet" href="style.css" />
     <link rel="stylesheet" href="game.css" />
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css">
   </head>
   <body>
     <div class="container">
@@ -21,6 +22,9 @@
               <div id="progressBarFull"></div>
             </div>
           </div>
+
+          <div id="hud-item">
+
           <div id="hud-item" class="time">
             <div class="timer">
               <div class="time_left_txt">Time Left</div>
@@ -29,6 +33,7 @@
           <div class="time_line"></div>  
           </div>
             <div id="hud-item">
+
             <p class="hud-prefix">
               Score
             </p>
@@ -37,7 +42,7 @@ <h1 class="hud-main-text" id="score">
             </h1>
           </div>
         </div>
-        <h2 id="question"></h2>
+        <h2 id="question1">Question </h2><h2 id="question"></h2>
         <div class="choice-container">
           <p class="choice-prefix">A</p>
           <p class="choice-text" data-number="1"></p>
@@ -54,6 +59,7 @@ <h2 id="question"></h2>
           <p class="choice-prefix">D</p>
           <p class="choice-text" data-number="4"></p>
         </div>
+
         <label for="un-mute" class="unmute" onclick="playpause()" id="playpauseBTN">
     <img src="http://upload.wikimedia.org/wikipedia/commons/3/3f/Mute_Icon.svg" alt="Mute_Icon.svg" title="Mute icon">
 </label>
@@ -63,8 +69,21 @@ <h2 id="question"></h2>
         <footer>
           <button class="next_btn">Next Ques</button>
       </footer>
+
       </div>
     </div>
+
+    <div>
+      <input type="checkbox" class="checkbox" id="checkbox">
+      <label for="checkbox" class="label">
+        <i class="fas fa-moon"></i>
+        <i class='fas fa-sun'></i>
+        <div class='ball'>
+      </label>
+    </div>
+  </div>
+
+    <script src="toggle.js"></script>
     <script src="game.js"></script>
   </body>
 </html>
diff --git a/Light/game.js b/Light/game.js
@@ -9,6 +9,9 @@ const time_line = document.querySelector(".time .time_line");
 const timeText = document.querySelector(".timer .time_left_txt");
 const timeCount = document.querySelector(".timer .timer_sec");
 
+const question1 = document.getElementById('question1');
+
+
 var soundCorrect = new Audio("sounds/correctAns.mp3");
 var soundIncorrect = new Audio("sounds/wrongAns.mp3");
 var myMusic = new Audio("sounds/gametheme.mp3");
@@ -82,6 +85,7 @@ getNewQuestion = () => {
         return window.location.assign('end.html');
     }
     questionCounter++;
+    question1.innerText = `Question  ${questionCounter}`;//update question number
     progressText.innerText = `Question ${questionCounter}/${MAX_QUESTIONS}`;
     //Update the progress bar
     progressBarFull.style.width = `${(questionCounter / MAX_QUESTIONS) * 100}%`;
@@ -137,8 +141,9 @@ choices.forEach((choice) => {
             soundCorrect.play();
         } else {
             soundIncorrect.play();
+            display(currentQuestion.answer);
         }
-
+        setInterval(displaynone,4000);
         selectedChoice.parentElement.classList.add(classToApply);
         setTimeout(() => {
             selectedChoice.parentElement.classList.remove(classToApply);
@@ -194,7 +199,27 @@ function startTimerLine(time) {
         }
     }
 }
+let string;
+function display(string) {
+    let display = document.getElementById('display');
+    if (string == 1) { 
+    display.innerText = `Correct option : A`;
+    }
+    if (string == 2) { 
+        display.innerText = `Correct option : B`;
+    }
+    if (string == 3) { 
+        display.innerText = `Correct option : C`;
+    }
+    if (string == 4) { 
+        display.innerText = `Correct option : D`;
+        }
 
+}
+function displaynone() {
+    let display = document.getElementById('display');
+    display.innerText = `Correct option : `;
+}
 incrementScore = (num) => {
     score += num;
     scoreText.innerText = score;