Merge branch 'Whac-a-Mole_Atharva' of https://github.com/AtharvaShind…

…e253/GameZone into Whac-a-Mole_Atharva

Games/Adventure_Game/README.md

@@ -26,12 +26,12 @@
 
 ## **Screenshots 📸**
 
-<br>
+
 <!-- add your screenshots like this -->
 <!-- ![image](url) -->
-![Image](D:\GIrlScript Summer of Code 2023\GameZone\Games\Adventure_Game\Adventure_Game.png)
+![image](https://github.com/Bindusree1515/GameZone/assets/91887086/8cdc9db1-2215-41e3-8593-3a0dcd22e3b4) 
 
 <br>
 
 ## **Working video 📹**
-<!-- add your working video over here -->
+<!-- add your working video over here -->

Games/Alphabet_Learning_Game/script.js

@@ -1,131 +1,83 @@
 document.addEventListener('DOMContentLoaded', function () {
 
   // Declaring stuff
-  myName = ""; // declaring a variable for my easter egg
-  audioPlayer = document.getElementsByTagName('audio')[0];
+  let myName = ""; // declaring a variable for my easter egg
+  const audioPlayer = document.querySelector('audio');
 
   // ------ Functions ------
+
   // Getting the letter sound and playing it.
   function setLetterSound(letterVariable) {
-    var mp3Source = document.getElementById('mp3Source');
-    var oggSource = document.getElementById('oggSource');
-    mp3Source.src = 'sounds/mp3/' + letterVariable + '.mp3';
-    oggSource.src = 'sounds/ogg/' + letterVariable + '.ogg';
+    audioPlayer.src = `sounds/mp3/${letterVariable}.mp3`;
   }
 
   function setGenericSound() {
-    var mp3Source = document.getElementById('mp3Source');
-    var oggSource = document.getElementById('oggSource');
-    mp3Source.src = 'sounds/mp3/like-glass.mp3';
-    oggSource.src = 'sounds/ogg/like-glass.ogg';
+    audioPlayer.src = 'sounds/mp3/like-glass.mp3';
   }
 
   // Generating a new element to restart the CSS3 animation.
   function generateNewElement() {
-    var elm = document.getElementById('big-char');
-    var newone = elm.cloneNode(true);
+    const elm = document.getElementById('big-char');
+    const newone = elm.cloneNode(true);
     elm.parentNode.replaceChild(newone, elm);
   }
 
   // Running the HTML5 audio player
   function runAudioPlayer() {
-    audioPlayer.load(); // pre loading the audi file
-    // audioPlayer.currentTime = 0; // start the audio from the beginning
+    audioPlayer.load(); // pre loading the audio file
     audioPlayer.play(); // play the audio
   }
 
   // Show and hide the about
-  document.getElementById('hide-button').onclick = function () {
+  document.getElementById('hide-button').addEventListener('click', function () {
     document.getElementById('about-cont').style.display = "none";
-  }
-  document.getElementById('about-button').onclick = function () {
+  });
+
+  document.getElementById('about-button').addEventListener('click', function () {
     document.getElementById('about-cont').style.display = "block";
-  }
+  });
 
   // On mobile, when the user taps on "Show Keyboard" move the focus to the hidden input
-  document.getElementById('show-keyboard-button').onclick = function () {
+  document.getElementById('show-keyboard-button').addEventListener('click', function () {
     document.getElementById('mobile-text-input').focus();
-  }
+  });
+
+  document.addEventListener('keypress', function (event) { // Do stuff when you press any key in the document
 
-  document.onkeypress = function (event) { // Do stuff when you press any key in the document
-
-    letterOnScreen = document.getElementById('big-char'); // get the element properties
-    console.log(event.charCode);
-    if ( // if use pressed on any of these characters which are not numbers or letters
-      event.charCode === 13 ||
-      event.charCode === 32 ||
-      event.charCode === 92 ||
-      event.charCode === 96 ||
-      event.charCode === 61 ||
-      event.charCode === 43 ||
-      event.charCode === 45 ||
-      event.charCode === 33 ||
-      event.charCode === 64 ||
-      event.charCode === 35 ||
-      event.charCode === 36 ||
-      event.charCode === 37 ||
-      event.charCode === 94 ||
-      event.charCode === 38 ||
-      event.charCode === 42 ||
-      event.charCode === 40 ||
-      event.charCode === 41 ||
-      event.charCode === 95 ||
-      event.charCode === 91 ||
-      event.charCode === 93 ||
-      event.charCode === 34 ||
-      event.charCode === 39 ||
-      event.charCode === 47 ||
-      event.charCode === 63 ||
-      event.charCode === 62 ||
-      event.charCode === 44 ||
-      event.charCode === 60 ||
-      event.charCode === 46 ||
-      event.charCode === 59 ||
-      event.charCode === 58 ||
-      event.charCode === 123 ||
-      event.charCode === 124 ||
-      event.charCode === 125 ||
-      event.charCode === 126
-    ) {
-      if (event.charCode === 13) { // getting the Enter key
-        letterOnScreen.innerHTML = "Enter";
-      } else if (event.charCode === 32) {
-        letterOnScreen.innerHTML = "Space";
-      } else {
-        letterOnScreen.innerHTML = String.fromCharCode(event.charCode);
-      }
+    const letterOnScreen = document.getElementById('big-char'); // get the element properties
+    console.log(event.key);
+    if (!/^[a-zA-Z0-9]$/.test(event.key)) {
+      const specialChars = {
+        '13': 'Enter',
+        '32': 'Space',
+      };
+      const specialChar = specialChars[event.keyCode] || event.key;
+      letterOnScreen.innerHTML = specialChar;
       setGenericSound(); // Set the generic sound in the resources of the audio tag
-      runAudioPlayer(); // Play sound
-      generateNewElement(); // Generate new DOM element to restart the animation
     } else {
-      letterOnScreen.innerHTML = String.fromCharCode(event.charCode); // getting the pressed character
-      pressedLetter = String.fromCharCode(event.charCode).toLowerCase(); // passing the pressed letter to the function to add it to sources (lower case because the sound files are in lower case).
+      letterOnScreen.innerHTML = event.key;
+      const pressedLetter = event.key.toLowerCase(); // passing the pressed letter to the function to add it to sources (lower case because the sound files are in lower case).
       setLetterSound(pressedLetter);
-      runAudioPlayer(); // Play sound
-      generateNewElement(); // Generate new DOM element to restart the animation
     }
 
+    runAudioPlayer(); // Play sound
+    generateNewElement(); // Generate new DOM element to restart the animation
+
     // An easter egg, if you type my name
-    myName += String.fromCharCode(event.charCode);
+    myName += event.key;
     console.log(myName);
-    if (myName === "avdhesh") {
+    if (myName.toLowerCase() === "avdhesh") {
       alert('You typed my name!\n--------------------------------\nNow I will show you my website.');
       window.open('https://avdhesh-portfolio.netlify.app/', '_blank');
     }
 
-  }
-
+  });
 
   // Mute button
-  document.getElementById('mute-button').onclick = function () {
-    if (audioPlayer.muted === false) {
-      audioPlayer.muted = true;
-      document.getElementById('mute-button').innerHTML = "Unmute Sounds";
-      console.log('sound muted');
-    } else {
-      audioPlayer.muted = false;
-      document.getElementById('mute-button').innerHTML = "Mute Sounds";
-    }
-  }
+  document.getElementById('mute-button').addEventListener('click', function () {
+    audioPlayer.muted = !audioPlayer.muted;
+    document.getElementById('mute-button').innerHTML = audioPlayer.muted ? "Unmute Sounds" : "Mute Sounds";
+    console.log('Sound ' + (audioPlayer.muted ? 'muted' : 'unmuted'));
+  });
 
-});
+});

Games/Guess_The_Number/style.css

@@ -13,6 +13,8 @@ body {
 .container {
     position: absolute;
     width: 50%;
+/*     separate home button from the guessing number container */
+    margin-top:55px;
     min-width: 580px;
     transform: translate(-50%, -50%);
     top: 50%;
@@ -80,4 +82,4 @@ p {
     margin-top: 20px;
 
     border: 1px solid rgb(8, 8, 8);
-}
+}

Games/Guess_Who/README.md

@@ -0,0 +1,43 @@
+# **Guess Who - Gamer Edition**
+
+---
+
+<br>
+
+## **Description 📃**
+
+Welcome to Guess Who? Gaming Edition! Just like the real life board-game, your job is to find out which gaming character we are thinking of!
+
+
+## **functionalities 🎮**
+
+You will be given a set of questions that you can ask on the control panel. Just click on the "?" button  next to your desired question, and we will give you the answer.
+You may ask as many questions as you would like, but the least you ask, the better your score!
+ Just like in the board-game, you can eliminate characters from the board! Just go to the desired character, and double-click on his/her card. 
+ If you wish to add the desired character back, just double-click again  on the respective card.
+<br>
+
+## **How to play? 🕹️**
+
+You can make a guess at any point of the game! Just click on the "Guess Who?" button on the  right panel, and click on your desired character.
+If you would like to keep asking questions and not make the guess, you can simply click on the "Cancel" button on the right panel.
+BUT THERE IS A CATCH! You only have 3 chances to guess. If you fail 3 times, you lose the game!
+
+
+<br>
+
+## **Screenshots 📸**
+
+<br>
+![image](../../assets/images/Guess_Who.png)
+
+<br>
+
+## **Working video 📹**
+
+<!-- add your working video over here -->
+
+<br>
+
+## **Creator**
+[Brad Didier](https://github.com/Deegee13244)