Merge pull request #1192 from meetarora10/tie-branch

feat: Number of ties are now displayed along with wins and loses .
apu52 · Aug 3, 2024 · dc14334 · dc14334
2 parents 08fa67e + 7957100
commit dc14334
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 4 deletions.
diff --git a/Projects/Rock-Paper-Scissors/index.html b/Projects/Rock-Paper-Scissors/index.html
@@ -33,6 +33,8 @@
         <span class="score_board">Computer Score: </span>
         <span id="comp_score">0</span>
     </div>
+    <span class="score_board tie">Ties: </span>
+    <span id="tie_score">0</span>
     <button id="reset" >Reset</button>
 
 

diff --git a/Projects/Rock-Paper-Scissors/index.js b/Projects/Rock-Paper-Scissors/index.js
@@ -1,7 +1,9 @@
 let userScore=0;
 let compScore= 0;
+let tieScore= 0;
 const userScore_span=document.getElementById("user_score");
 const compScore_span=document.getElementById("comp_score");
+const tieScore_span=document.getElementById("tie_score");
 const scoreBoard_div=document.querySelector(".score_board");
 const result_p=document.querySelector(".result>p");
 const rock_div=document.getElementById("rock")
@@ -41,6 +43,8 @@ function lose(userChoice,compChoice){
 
 //here we are making a function where the user and the computer ties
 function tie(userChoice,compChoice){
+    tieScore++;
+    tieScore_span.innerHTML = tieScore;
     result_p.innerHTML = `${convertToWord(userChoice)} equals ${convertToWord(compChoice)}. It's a DRAW!`;
 
 }
@@ -77,8 +81,10 @@ function game(userChoice){
 function resetButton(){
     userScore = 0;
   compScore = 0;
+  tieScore = 0;
   userScore_span.innerHTML = userScore;
   compScore_span.innerHTML = compScore;
+  tieScore_span.innerHTML = tieScore;
   result_p.innerHTML = "";
 
 }

diff --git a/Projects/Rock-Paper-Scissors/style.css b/Projects/Rock-Paper-Scissors/style.css
@@ -67,10 +67,11 @@ body{
     font-weight: bold;
     font-size: 25px;
     color: rgb(22, 21, 21);
-    margin-bottom: 50px;
-
+    margin-bottom: 50px;  
+}
+.tie{
+    margin-left: 445px;
 }
-
 .result{
     color: rgb(14, 14, 14);
     font-weight: bold;
@@ -94,7 +95,13 @@ body{
     font-weight: bold;
     font-size: 25px;
 }
-
+#tie_score{
+    color: rgb(236, 18, 232);
+    text-align: center;
+    margin-top: 25px;
+    font-weight: bold;
+    font-size: 25px;
+}
 #reset {
     background-color: rgb(154, 25, 25);
     color: white;