From f2491f0c0362c4dc055d8a75995c363e0a140f79 Mon Sep 17 00:00:00 2001
From: Kunal-Shahi <shahikunal436@gmail.com>
Date: Sat, 30 Jan 2021 12:15:22 +0530
Subject: [PATCH 1/2] Kunal 507

---
 index.html | 102 ++++++++++++++++++++++++++++++++++++++++++++++++-----
 1 file changed, 93 insertions(+), 9 deletions(-)

diff --git a/index.html b/index.html
index f5b3c84..48d25cc 100644
--- a/index.html
+++ b/index.html
@@ -10,18 +10,29 @@
       <h2>The Great</h2>
       <h1 id="header-clue">rgb(xxx,xxx,xxx)</h1>
       <h2>Guessing Game</h2>
+      <div>The number of tries:<div id="c"></div></div>
     </div>
     <div id="container">
       <div class="tile" id="1"></div>
       <div class="tile" id="2"></div>
+      <div class="tile" id="3"></div>
+      <div class="tile" id="4"></div>
+      <div class="tile" id="5"></div>
+      <div class="tile" id="6"></div>
+      <button type="button" id="button">New Game </button>
     </div>
 
     <script>
       var t1 = document.getElementById("1");
       var t2 = document.getElementById("2");
+      var t3 = document.getElementById("3");
+      var t4 = document.getElementById("4");
+      var t5 = document.getElementById("5");
+      var t6 = document.getElementById("6");
+      var button=document.getElementById("button")
       var x;
       var correctColor;
-
+      var c=0;
       function getRandomColor() {
         var letters = "0123456789ABCDEF";
         var color = "#";
@@ -31,16 +42,21 @@ <h2>Guessing Game</h2>
         return color;
       }
 
-      function newGame() {
+       function newGame() {
         t1.style.background = getRandomColor();
         t2.style.background = getRandomColor();
+        t3.style.background = getRandomColor();
+        t4.style.background = getRandomColor();
+        t5.style.background = getRandomColor();
+        t6.style.background = getRandomColor();
+
+        x = Math.floor(Math.random() * 6 + 1);
+        array=[t1,t2,t3,t4,t5,t6]
 
-        x = Math.floor(Math.random() * 2 + 1);
+         correctColor = array[x-1].style.background;
 
-        if (x == 1) correctColor = t1.style.background;
-        else correctColor = t2.style.background;
-        /* console.log(x);
-        console.log(correctColor); */
+        console.log(array[x-1]);
+        console.log(correctColor);
 
         document.getElementById("header-clue").innerHTML = correctColor;
       }
@@ -48,20 +64,88 @@ <h2>Guessing Game</h2>
       t1.addEventListener("click", function () {
         if (t1.style.background == correctColor) {
           t2.style.background = correctColor;
+          t3.style.background = correctColor;
+          t4.style.background = correctColor;
+          t5.style.background = correctColor;
+          t6.style.background = correctColor;
           document.getElementById("header").style.background = correctColor;
-        } else {
+        } else {c=c+1;
           t1.style.background = "black";
+          document.getElementById("c").innerHTML = c;
         }
       });
 
       t2.addEventListener("click", function () {
         if (t2.style.background == correctColor) {
           t1.style.background = correctColor;
+          t3.style.background = correctColor;
+          t4.style.background = correctColor;
+          t5.style.background = correctColor;
+          t6.style.background = correctColor;
           document.getElementById("header").style.background = correctColor;
-        } else {
+        } else {c=c+1;
           t2.style.background = "black";
+          document.getElementById("c").innerHTML = c;
         }
       });
+      t3.addEventListener("click", function () {
+        if (t3.style.background == correctColor) {
+          t1.style.background = correctColor;
+          t2.style.background = correctColor;
+          t4.style.background = correctColor;
+          t5.style.background = correctColor;
+          t6.style.background = correctColor;
+          document.getElementById("header").style.background = correctColor;
+        } else {
+          c=c+1;
+          t3.style.background = "black";
+          document.getElementById("c").innerHTML = c;
+        }
+      });
+      t4.addEventListener("click", function () {
+        if (t4.style.background == correctColor) {
+          t1.style.background = correctColor;
+          t2.style.background = correctColor;
+          t3.style.background = correctColor;
+          t5.style.background = correctColor;
+          t6.style.background = correctColor;
+          document.getElementById("header").style.background = correctColor;
+        } else {
+          t4.style.background = "black";
+          c=c+1;
+          document.getElementById("c").innerHTML = c;
+        }
+      });
+      t5.addEventListener("click", function () {
+        if (t5.style.background == correctColor) {
+          t1.style.background = correctColor;
+          t2.style.background = correctColor;
+          t3.style.background = correctColor;
+          t4.style.background = correctColor;
+          t6.style.background = correctColor;
+          document.getElementById("header").style.background = correctColor;
+        } else {
+          t5.style.background = "black";
+          c=c+1;
+          document.getElementById("c").innerHTML = c;
+        }
+      });
+      t6.addEventListener("click", function () {
+        if (t6.style.background == correctColor) {
+          t1.style.background = correctColor;
+          t2.style.background = correctColor;
+          t3.style.background = correctColor;
+          t4.style.background = correctColor;
+          t5.style.background = correctColor;
+          document.getElementById("header").style.background = correctColor;
+        } else {
+          t6.style.background = "black";
+          c = c+1;
+          document.getElementById("c").innerHTML = c;
+        }
+      });
+      button.addEventListener("click",function(){newGame()});
+
     </script>
   </body>
 </html>

From c24a6fbe3de0788db056ff8c929a522f87c740ed Mon Sep 17 00:00:00 2001
From: Kunal-Shahi <shahikunal436@gmail.com>
Date: Tue, 2 Feb 2021 10:57:54 +0530
Subject: [PATCH 2/2] Kunal 507

---
 index.css  |   5 ++
 index.html | 147 +++++++++++++----------------------------------------
 2 files changed, 41 insertions(+), 111 deletions(-)

diff --git a/index.css b/index.css
index 373135f..c27f035 100644
--- a/index.css
+++ b/index.css
@@ -25,3 +25,8 @@
   width: 200px;
   background-color: aliceblue;
 }
+#button{
+  background-color: green;
+  height:10vh;
+
+}
diff --git a/index.html b/index.html
index 48d25cc..9d62375 100644
--- a/index.html
+++ b/index.html
@@ -10,7 +10,7 @@
       <h2>The Great</h2>
       <h1 id="header-clue">rgb(xxx,xxx,xxx)</h1>
       <h2>Guessing Game</h2>
-      <div>The number of tries:<div id="c"></div></div>
+      <div>The number of tries: <div id="c">0</div></div>
     </div>
     <div id="container">
       <div class="tile" id="1"></div>
@@ -22,130 +22,55 @@ <h2>Guessing Game</h2>
       <button type="button" id="button">New Game </button>
     </div>
 
+
+
+
     <script>
-      var t1 = document.getElementById("1");
-      var t2 = document.getElementById("2");
-      var t3 = document.getElementById("3");
-      var t4 = document.getElementById("4");
-      var t5 = document.getElementById("5");
-      var t6 = document.getElementById("6");
-      var button=document.getElementById("button")
+      var array=["1","2","3","4","5","6"]
+      var z=array.map(function(i){return document.getElementById(i);});
       var x;
-      var correctColor;
       var c=0;
+      var correctColor;
+
       function getRandomColor() {
         var letters = "0123456789ABCDEF";
         var color = "#";
-        for (var i = 0; i < 6; i++) {
+        for (let i = 0; i < 6; i++) {
           color += letters[Math.floor(Math.random() * 16)];
         }
         return color;
       }
 
-       function newGame() {
-        t1.style.background = getRandomColor();
-        t2.style.background = getRandomColor();
-        t3.style.background = getRandomColor();
-        t4.style.background = getRandomColor();
-        t5.style.background = getRandomColor();
-        t6.style.background = getRandomColor();
+      function newGame() {
+        for(let i=0;i<6;i++)
+        z[i].style.background = getRandomColor();
 
         x = Math.floor(Math.random() * 6 + 1);
-        array=[t1,t2,t3,t4,t5,t6]
 
-         correctColor = array[x-1].style.background;
+                correctColor = z[x-1].style.background;
 
-        console.log(array[x-1]);
-        console.log(correctColor);
-
-        document.getElementById("header-clue").innerHTML = correctColor;
-      }
+               /* console.log(x);
+               console.log(correctColor); */
 
-      t1.addEventListener("click", function () {
-        if (t1.style.background == correctColor) {
-          t2.style.background = correctColor;
-          t3.style.background = correctColor;
-          t4.style.background = correctColor;
-          t5.style.background = correctColor;
-          t6.style.background = correctColor;
-          document.getElementById("header").style.background = correctColor;
-        } else {c=c+1;
-          t1.style.background = "black";
-          document.getElementById("c").innerHTML = c;
-        }
-      });
-
-      t2.addEventListener("click", function () {
-        if (t2.style.background == correctColor) {
-          t1.style.background = correctColor;
-          t3.style.background = correctColor;
-          t4.style.background = correctColor;
-          t5.style.background = correctColor;
-          t6.style.background = correctColor;
-          document.getElementById("header").style.background = correctColor;
-        } else {c=c+1;
-          t2.style.background = "black";
-          document.getElementById("c").innerHTML = c;
-        }
-      });
-      t3.addEventListener("click", function () {
-        if (t3.style.background == correctColor) {
-          t1.style.background = correctColor;
-          t2.style.background = correctColor;
-          t4.style.background = correctColor;
-          t5.style.background = correctColor;
-          t6.style.background = correctColor;
-          document.getElementById("header").style.background = correctColor;
-        } else {
-          c=c+1;
-          t3.style.background = "black";
-          document.getElementById("c").innerHTML = c;
-        }
-      });
-      t4.addEventListener("click", function () {
-        if (t4.style.background == correctColor) {
-          t1.style.background = correctColor;
-          t2.style.background = correctColor;
-          t3.style.background = correctColor;
-          t5.style.background = correctColor;
-          t6.style.background = correctColor;
-          document.getElementById("header").style.background = correctColor;
-        } else {
-          t4.style.background = "black";
-          c=c+1;
-          document.getElementById("c").innerHTML = c;
-        }
-      });
-      t5.addEventListener("click", function () {
-        if (t5.style.background == correctColor) {
-          t1.style.background = correctColor;
-          t2.style.background = correctColor;
-          t3.style.background = correctColor;
-          t4.style.background = correctColor;
-          t6.style.background = correctColor;
-          document.getElementById("header").style.background = correctColor;
-        } else {
-          t5.style.background = "black";
-          c=c+1;
-          document.getElementById("c").innerHTML = c;
-        }
-      });
-      t6.addEventListener("click", function () {
-        if (t6.style.background == correctColor) {
-          t1.style.background = correctColor;
-          t2.style.background = correctColor;
-          t3.style.background = correctColor;
-          t4.style.background = correctColor;
-          t5.style.background = correctColor;
-          document.getElementById("header").style.background = correctColor;
-        } else {
-          t6.style.background = "black";
-          c = c+1;
-          document.getElementById("c").innerHTML = c;
-        }
-      });
-      button.addEventListener("click",function(){newGame()});
+               document.getElementById("header-clue").innerHTML = correctColor;
+             }
+       for(let i=0;i<6;i++){
+             z[i].addEventListener("click", function () {
+               if (z[i].style.background == correctColor) {
+                 for(let i=0;i<6;i++)
+                 z[i].style.background = correctColor;
+                 document.getElementById("header").style.background = correctColor;
+               } else {c+=1;
+                 document.getElementById("c").innerHTML = c;
+                 z[i].style.background = "black";
+               }
+             });
 
-    </script>
-  </body>
-</html>
+             }
+               button.addEventListener("click",function(){
+               c=0;
+              document.getElementById("c").innerHTML = 0;
+           newGame();});
+           </script>
+         </body>
+       </html>