Merge pull request #4889 from aRUsh-codes/branch101

adding Guess That Pokemon

Games/Guess_That_Pokemon/README.md

@@ -0,0 +1,35 @@
+# **Game_Name** 
+Guess That Pokemon
+
+<br>
+
+## **Description 📃**
+<!-- add your game description here  -->
+- A black outline of the pokemon will be displayed on the screen and the player has to guess which pokemon it is.
+
+
+## **functionalities 🎮**
+<!-- add functionalities over here -->
+- There will be options for guess, quit and hint.
+<br>
+
+## **How to play? 🕹️**
+<!-- add the steps how to play games -->
+- If the player guesses the pokemon without using a hint they are rewarded 100 points.
+- If the player guesses the pokemon after taking a hint they are rewarded 50 points.
+- If the player incorrectly guesses the pokemon they get 0 points.
+- If the player quits they get 0 points.
+
+<br>
+
+## **Screenshots 📸**
+
+<!-- add your screenshots like this -->
+<!-- ![image](url) -->
+![Guess That Pokemon](./assests/pokemon1.png)
+
+<br>
+
+## **Working video 📹**
+<!-- add your working video over here -->
+![Guess That Pokemon](./assests/pokemon3.png)

Games/Guess_That_Pokemon/allPokemons.js

@@ -0,0 +1,200 @@
+var abra = {
+    name: "abra",
+    source: "https://archives.bulbagarden.net/media/upload/9/9e/PCP063.png",
+    hint:"A small, timid Psychic-type Pokémon with exceptional telekinetic abilities. It's powers manifest most strongly during sleep."
+}
+
+var alakazam = {
+    name: "alakazam",
+    source: "https://archives.bulbagarden.net/media/upload/a/a6/PCP065.png",
+    hint:"The highly intelligent evolution of Abra, boasting immense psychic power. Known for its telepathy and spoon-bending abilities"
+}
+
+var arcanine ={
+    name:"arcanine",
+    source:"https://archives.bulbagarden.net/media/upload/thumb/4/42/0059Arcanine.png/375px-0059Arcanine.png",
+    hint:"A Fire-type Pokémon and it evolves from Growlithe when exposed to a Fire Stone."
+}
+
+var arbok = {
+    name: "arbok",
+    source: "https://archives.bulbagarden.net/media/upload/9/9d/PCP024.png",
+    hint:"A large, intimidating Poison-type snake Pokémon with a venomous bite."
+}
+
+var articuno = {
+    name: "articuno",
+    source: "https://archives.bulbagarden.net/media/upload/d/db/PCP144.png",
+    hint:"A legendary Ice/Flying-type bird Pokémon with the power to freeze its surroundings."
+}
+
+var beedrill = {
+    name: "beedrill",
+    source: "https://archives.bulbagarden.net/media/upload/a/ac/PCP015.png",
+    hint:"A fierce Bug/Poison-type with venomous stingers."
+}
+
+var bulbasaur  = {
+    name: "bulbasaur",
+    source: "https://archives.bulbagarden.net/media/upload/thumb/f/fb/0001Bulbasaur.png/375px-0001Bulbasaur.png",
+    hint:"Along with Charmander and Squirtle, this is one of the three first partner Pokémon of Ash available at the beginning of Pokémon Red, "
+}
+
+var charmander = {
+    name: "charmander",
+    source: "https://archives.bulbagarden.net/media/upload/6/6f/PCP004.png",
+    hint:"A small, lizard-like Fire-type with a burning tail. Its flame grows stronger with its emotions."
+}
+
+var charmeleon = {
+    name: "charmeleon",
+    source: "https://archives.bulbagarden.net/media/upload/f/f5/PCP005.png",
+    hint:"The fiery evolution of Charmander, known for its aggressive nature and powerful flame attacks."
+}
+
+var charizard = {
+    name: "charizard",
+    source: "https://archives.bulbagarden.net/media/upload/5/5e/PCP006.png",
+    hint:"A formidable Fire/Flying-type, it is capable of unleashing devastating fire-based attacks."
+}
+
+var chimecho = {
+    name: "chimecho",
+    source: "https://archives.bulbagarden.net/media/upload/7/7e/PCP358.png",
+    hint:"A floating, bell-shaped Psychic-type with a calming aura. Its melodious chimes can soothe or confuse opponents."
+}
+
+var crobat = {
+    name: "crobat",
+    source: "https://archives.bulbagarden.net/media/upload/e/e3/PCP169.png",
+    hint:"A fast and agile Poison/Flying-type with keen eyesight."
+}
+
+var dragonair = {
+    name: "dragonair",
+    source: "https://archives.bulbagarden.net/media/upload/9/95/PCP148.png",
+    hint:"A serpentine Dragon-type Pokémon with the ability to control weather."
+}
+
+var eevee = {
+    name: "eevee",
+    source: "https://archives.bulbagarden.net/media/upload/9/98/PCP133.png",
+    hint:"A small, fox-like Normal-type with the unique ability to evolve into different forms based on various conditions."
+}
+
+var ekans  = {
+    name: "ekans",
+    source: "https://archives.bulbagarden.net/media/upload/thumb/d/d2/0023Ekans.png/375px-0023Ekans.png",
+    hint:"It is a Poison-type Pokémon.It evolves into Arbok"
+}
+
+var espeon = {
+    name: "espeon",
+    source: "https://archives.bulbagarden.net/media/upload/5/5f/PCP196.png",
+    hint:"An evolution of Eevee, it is a Psychic-type with heightened senses and the ability to predict opponents' moves."
+}
+
+var flareon = {
+    name: "flareon",
+    source: "https://archives.bulbagarden.net/media/upload/2/2d/PCP136.png",
+    hint:"An evolution of Eevee, it is a Fire-type with an intense, fiery coat."
+}
+
+var glaceon = {
+    name: "glaceon",
+    source: "https://archives.bulbagarden.net/media/upload/d/d0/PCP471.png",
+    hint:" An Ice-type evolution of Eevee, it possesses the ability to freeze nearby water."
+}
+
+var golbat = {
+    name: "golbat",
+    source: "https://archives.bulbagarden.net/media/upload/e/ea/PCP042.png",
+    hint:"A larger, more powerful evolution of Zubat, this Poison/Flying-type is known for its sharp teeth and high speed."
+}
+
+var gyarados = {
+    name: "gyarados",
+    source: "https://archives.bulbagarden.net/media/upload/9/9d/PCP130.png",
+    hint:"A monstrous Water/Flying-type with a violent temper. Once a Magikarp, it undergoes a dramatic transformation."
+}
+
+var haunter = {
+    name: "haunter",
+    source: "https://archives.bulbagarden.net/media/upload/8/84/PCP093.png",
+    hint:"A mischievous Ghost/Poison-type with the ability to possess others."
+}
+
+var horsea = {
+    name: "horsea",
+    source: "https://archives.bulbagarden.net/media/upload/thumb/1/14/0116Horsea.png/375px-0116Horsea.png",
+    hint:"It is a Water-type Pokémon.It evolves into Seadra which evolves into Kingdra when traded while holding a Dragon Scale."
+}
+
+var igglybuff = {
+    name: "igglybuff",
+    source: "https://archives.bulbagarden.net/media/upload/9/9f/PCP174.png",
+    hint:"A pink, round Normal-type known for its sweet singing voice."
+}
+
+var jigglypuff = {
+    name: "jigglypuff",
+    source: "https://archives.bulbagarden.net/media/upload/b/b4/PCP039.png",
+    hint:"The evolved form of Igglybuff, still adorable but with a powerful singing voice that can induce sleep."
+}
+
+var jolteon = {
+    name: "jolteon",
+    source: "https://archives.bulbagarden.net/media/upload/5/58/PCP135.png",
+    hint:"An Electric-type evolution of Eevee known for its incredible speed and powerful electric attacks."
+}
+
+var kadabra = {
+    name: "kadabra",
+    source: "https://archives.bulbagarden.net/media/upload/4/4b/PCP064.png",
+    hint:"The intermediate stage between Abra and Alakazam, possessing increased psychic prowess."
+}
+
+var magikarp = {
+    name: "magikarp",
+    source: "https://archives.bulbagarden.net/media/upload/thumb/d/d1/0129Magikarp.png/375px-0129Magikarp.png",
+    hint:" A weak, water-type Pokémon known for its inability to battle effectively. Despite its unimpressive appearance and abilities, it evolves into the powerful Gyarados."
+}
+
+var magneton  = {
+    name: "magneton",
+    source: "https://archives.bulbagarden.net/media/upload/thumb/d/d9/0082Magneton.png/375px-0082Magneton.png",
+    hint:"An Electric/Steel-type Pokémon formed by three Magnemite linked together. Known for its strong magnetic force and ability to generate powerful electric attacks."
+}
+
+var meowth  = {
+    name: "meowth",
+    source: "https://archives.bulbagarden.net/media/upload/thumb/d/d6/0052Meowth.png/375px-0052Meowth.png",
+    hint:"A Normal-type Team Rocket Pokémon known for its cunning and ambition. Often seen carrying coins, it dreams of becoming rich."
+}
+
+var pichu  = {
+    name: "pichu",
+    source: "https://archives.bulbagarden.net/media/upload/thumb/f/f3/0172Pichu.png/375px-0172Pichu.png",
+    hint:"A small, Electric-type baby Pokémon with a playful and curious nature. Known for its unpredictable electric shocks caused by excitement or surprise."
+}
+
+var pidgey   = {
+    name: "pidgey",
+    source: "https://archives.bulbagarden.net/media/upload/thumb/0/0c/0016Pidgey.png/375px-0016Pidgey.png",
+    hint:"A common Normal/Flying-type Pokémon known for its docile nature. Often found in grassy areas, it prefers to flee from danger rather than fight."
+}
+
+var pikachu   = {
+    name: "pikachu",
+    source: "https://archives.bulbagarden.net/media/upload/thumb/4/4a/0025Pikachu.png/375px-0025Pikachu.png",
+    hint:"An iconic Electric-type Pokémon known for its cheerful personality and electric attacks. It stores electricity in its cheeks, which it can release in powerful bolts."
+}
+
+var psyduck  = {
+    name: "psyduck",
+    source: "https://archives.bulbagarden.net/media/upload/thumb/3/3f/0054Psyduck.png/375px-0054Psyduck.png",
+    hint:"A Water-type Pokémon known for its constant headaches. Despite its dazed appearance, it possesses hidden psychic powers that are often unleashed unintentionally due to the pain."
+}
+
+
+

Games/Guess_That_Pokemon/index.html

@@ -0,0 +1,56 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Who's that Pokemon?</title>
+
+    <link rel="stylesheet" href="style.css">
+    <script src="allPokemons.js"></script>
+    <script src="script.js"></script>
+
+    <script src="https://kit.fontawesome.com/d4a52177dc.js" crossorigin="anonymous"></script>
+    <link rel="preconnect" href="https://fonts.gstatic.com">
+    <link href="https://fonts.googleapis.com/css2?family=Indie+Flower&display=swap" rel="stylesheet">
+
+</head>
+
+<body>
+
+    <header>
+        <h1 id="title"><strong>Who's that Pokemon?</strong></h1>
+    </header>
+
+    <div class="main">
+
+        <figure>
+            <img src="" alt="some image" id="canvas">
+        </figure>
+
+
+        <div class="box">
+
+            <input type="text" id="guessInput" value="" onkeyup="if (event.keyCode == 13) document.getElementById('submit-btn').click()">
+
+        </div>
+
+        <div class="box">
+            <button onclick="tryGuess()" id="submit-btn">Guess</button>
+            <button onclick="giveHint()">Hint</button>
+            <button onclick="choosePic()">I don't know!</button>
+        </div>
+
+    </div>
+
+    <div id="modal" class="modal">
+        <div class="modal-content">
+          <span class="close">&times;</span>
+          <p id="modal-message" style="font-size: 24px;"></p>
+        </div>
+    </div>
+
+</body>
+
+</html>

Games/Guess_That_Pokemon/script.js

@@ -0,0 +1,86 @@
+/* As soon as you initialize the page, choose a random image */
+window.onload = choosePic;
+let index;
+let points = 0;
+let hintTaken = false;
+
+/* Array that receives all Pokemons in the game. You can greatly improve this array */
+const allPokemons = new Array(abra, alakazam, arcanine, arbok, articuno, beedrill, bulbasaur, charmander, 
+    charmeleon, charizard, chimecho, crobat, dragonair, eevee, ekans, espeon, flareon, glaceon, golbat, 
+    gyarados, haunter, horsea, igglybuff, jigglypuff, jolteon, kadabra, magikarp, magneton, 
+    meowth, pichu, pidgey, pikachu, psyduck);
+
+function randomNumber() {
+    return Math.floor(Math.random() * allPokemons.length) + 1;
+}
+
+/* Choose a random Pokemon */
+function choosePic() {
+    index = randomNumber();
+    document.getElementById("canvas").src = allPokemons[index].source;
+    hintTaken = false;
+}
+
+function clearInput() {
+    document.getElementById("guessInput").value = "";
+}
+
+function showAlert(num) {
+    if (num == 1) {
+        if (!hintTaken) {
+            points += 100;
+        } else {
+            points += 50;
+        }
+        document.getElementById("modal-message").innerText="Congratulations, You did it! It's " + allPokemons[index].name + "!"+"You earned " + (hintTaken ? 50 : 100) + " points!" +"\n Total Points are :" + points;
+        document.getElementById("modal").style.display = "block";
+    } else {
+        document.getElementById("modal-message").innerText = "Oops, Thats' not correct. It was " + allPokemons[index].name + "!";
+        document.getElementById("modal").style.display = "block";
+        points += 0;
+    }
+    // Add event listener to the cancel button
+    var closeButton = document.querySelector(".close");
+    closeButton.addEventListener("click", function() {
+        document.getElementById("modal").style.display = "none";
+    });
+}
+
+function tryGuess() {
+    if (document.getElementById("guessInput").value.trim().toLowerCase() === allPokemons[index].name) {
+
+        showAlert(1);
+        document.getElementById("canvas").style.filter = "brightness(100%)";
+        allPokemons.splice(index, 1);
+
+        if (allPokemons.length >= 1){
+            setTimeout(function () {
+
+                document.getElementById("canvas").style.filter = "brightness(0%)";
+                choosePic();
+                clearInput();
+
+            }, 500);
+        } else {
+            alert("You managed to guess all the Pokemons! You are awesome! Thanks for playing, I hope you had fun ^~^ ")
+            document.getElementById("title").innerHTML = "You win! Yay!";
+        }
+
+    } else {
+        showAlert(0);
+        choosePic();
+        clearInput();
+    }
+}
+
+function giveHint() {
+    hintTaken = true;
+    document.getElementById("modal-message").innerText="Hint: " + allPokemons[index].hint;
+    document.getElementById("modal").style.display = "block";
+
+    // Add event listener to the cancel button
+    var closeButton = document.querySelector(".close");
+    closeButton.addEventListener("click", function() {
+        document.getElementById("modal").style.display = "none";
+    });
+}