Merge branch 'main' into main

kunjgit · Jul 29, 2024 · 10ee0cc · 10ee0cc
2 parents 2afa797 + eaf21cf
commit 10ee0cc
Show file tree

Hide file tree

Showing 67 changed files with 3,028 additions and 3,240 deletions.
diff --git a/.github/CONTRIBUTING_GUIDELINE.md b/.github/CONTRIBUTING_GUIDELINE.md
@@ -90,31 +90,41 @@ If you find this project helpful, please consider giving it a star on GitHub! Yo
 * Note:-All Other data except the ScreenShot of your Game, should be in it's main folder , don't add it to other folders of the project.
 
 <br>
+---
 
-## Add Game to assets/js/gamesData.json
-
-* This is to Show your game on the main Website
-   - Go to the end of gamesData.json and add :
-   - **,**
-         " **No.** ":{
-            "gameTitle" : " **Title** ",
-            "gameUrl": " **Main Folder** ",
-            "thumbnailUrl":" **Preview Image** " 
-         }
-   - **No.**: Number for your Game , it should be the next number with respect to the file. eg: if the last no. in file at present is *625* you should put *626* at the place of **No.**
-   - **Title:** this is the title for your game that will be shown on the website, if your game name is ```Super_Mario_Game``` ,put Title as ```Super Mario Game```
-   - **Main Folder :** This is the reference to *index.html* 
-      - if your index.html is directly in main game folder ,put the main folder name eg: ```Super_Mario_Game```
-      - if your index.html is in subfolder , give path to it 
-      eg: ```Super_Mario_Game/public``` (assuming index.html is in public folder of Super_Mario_Game folder)
-      - if your main html file's name is not index.html , you need to specify the main html file also. eg:```Super_Mario_Game/mario.html``` or if in sub folder ```Super_Mario_Game/public/mario.html```
-   - **Preview Image:** This is the image that will be shown as preview for your game , here you provide the name of the image that you added to **assets/images** folder, along with format type. Eg. ```Super_Mario_Game.png``` or ```Super_Mario_Game.jpg``` or with any other format.
-
-**Note:-** 
-
-   -  Do not modify anything else in the rest of the file, you only need to add your game in the end of the file. 
-   - Don't forget to add the comma for new entry (already give in above sample but this is a reminder as one might miss it to see in the sample)
+## Add Game to `assets/js/gamesData.json`
 
+*This guide will help you add your game to the main website.*
+
+1. **Locate `gamesData.json`:** Go to the end of the `gamesData.json` file.
+
+2. **Add Your Game Data:** Append the following JSON entry at the end of the file:
+   ```json
+   ,
+   "No.": {
+       "gameTitle": "Title",
+       "gameUrl": "Main Folder",
+       "thumbnailUrl": "Preview Image"
+   }
+   ```
+
+   - **No.:** Replace `No.` with the next number in sequence. For example, if the last number in the file is `625`, use `626` for your game.
+
+   - **Title:** Replace `"Title"` with the title of your game as it should appear on the website. For example, if your game is named `Super_Mario_Game`, use `"Super Mario Game"`.
+
+   - **Main Folder:** Replace `"Main Folder"` with the path to your game's main HTML file. If `index.html` is directly in the game's folder, use the folder name (e.g., `"Super_Mario_Game"`). If `index.html` is in a subfolder, specify the path (e.g., `"Super_Mario_Game/public"`). If your main HTML file is not named `index.html`, include the file name (e.g., `"Super_Mario_Game/mario.html"` or `"Super_Mario_Game/public/mario.html"`).
+
+   - **Preview Image:** Replace `"Preview Image"` with the name of the image you added to the `assets/images` folder, including the file format. For example, `"Super_Mario_Game.png"` or `"Super_Mario_Game.jpg"`.
+
+3. **Important Notes:**
+   - **Comma Placement:** Ensure you add a comma before your new entry. This is crucial to maintain valid JSON format. The provided sample includes the comma, but make sure you don’t forget it.
+   - **Trailing Comma:** JSON does not allow trailing commas. Do not add a comma after the last entry. Ensure your new game entry is added before the final closing curly brace of the file.
+   - **File Integrity:** Do not modify any other part of the file. Only add your game entry at the end.
+
+4. **Check if Game Load**
+   - **Open index.html:** After you have added your game to the gamesData.json open index.html of GameZone
+   - **Go To last Page:** Go to the Last page and check if your game is loading along with preview image and when opened ,works properly.
+---
 
 <br>
 

diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
@@ -90,31 +90,42 @@ If you find this project helpful, please consider giving it a star on GitHub! Yo
 * Note:-All Other data except the ScreenShot of your Game, should be in it's main folder , don't add it to other folders of the project.
 
 <br>
+---
 
+## Add Game to `assets/js/gamesData.json`
+
+*This guide will help you add your game to the main website.*
+
+1. **Locate `gamesData.json`:** Go to the end of the `gamesData.json` file.
+
+2. **Add Your Game Data:** Append the following JSON entry at the end of the file:
+   ```json
+   ,
+   "No.": {
+       "gameTitle": "Title",
+       "gameUrl": "Main Folder",
+       "thumbnailUrl": "Preview Image"
+   }
+   ```
+
+   - **No.:** Replace `No.` with the next number in sequence. For example, if the last number in the file is `625`, use `626` for your game.
+
+   - **Title:** Replace `"Title"` with the title of your game as it should appear on the website. For example, if your game is named `Super_Mario_Game`, use `"Super Mario Game"`.
+
+   - **Main Folder:** Replace `"Main Folder"` with the path to your game's main HTML file. If `index.html` is directly in the game's folder, use the folder name (e.g., `"Super_Mario_Game"`). If `index.html` is in a subfolder, specify the path (e.g., `"Super_Mario_Game/public"`). If your main HTML file is not named `index.html`, include the file name (e.g., `"Super_Mario_Game/mario.html"` or `"Super_Mario_Game/public/mario.html"`).
+
+   - **Preview Image:** Replace `"Preview Image"` with the name of the image you added to the `assets/images` folder, including the file format. For example, `"Super_Mario_Game.png"` or `"Super_Mario_Game.jpg"`.
+
+3. **Important Notes:**
+   - **Comma Placement:** Ensure you add a comma before your new entry. This is crucial to maintain valid JSON format. The provided sample includes the comma, but make sure you don’t forget it.
+   - **Trailing Comma:** JSON does not allow trailing commas. Do not add a comma after the last entry. Ensure your new game entry is added before the final closing curly brace of the file.
+   - **File Integrity:** Do not modify any other part of the file. Only add your game entry at the end.
+
+4. **Check if Game Load**
+   - **Open index.html:** After you have added your game to the gamesData.json open index.html of GameZone
+   - **Go To last Page:** Go to the Last page and check if your game is loading along with preview image and when opened ,works properly.
+---
 
-## Add Game to assets/js/gamesData.json
-
-* This is to Show your game on the main Website
-   - Go to the end of gamesData.json and add :
-   - **,**
-         " **No.** ":{
-            "gameTitle" : " **Title** ",
-            "gameUrl": " **Main Folder** ",
-            "thumbnailUrl":" **Preview Image** " 
-         }
-   - **No.**: Number for your Game , it should be the next number with respect to the file. eg: if the last no. in file at present is *625* you should put *626* at the place of **No.**
-   - **Title:** this is the title for your game that will be shown on the website, if your game name is ```Super_Mario_Game``` ,put Title as ```Super Mario Game```
-   - **Main Folder :** This is the reference to *index.html* 
-      - if your index.html is directly in main game folder ,put the main folder name eg: ```Super_Mario_Game```
-      - if your index.html is in subfolder , give path to it 
-      eg: ```Super_Mario_Game/public``` (assuming index.html is in public folder of Super_Mario_Game folder)
-      - if your main html file's name is not index.html , you need to specify the main html file also. eg:```Super_Mario_Game/mario.html``` or if in sub folder ```Super_Mario_Game/public/mario.html```
-   - **Preview Image:** This is the image that will be shown as preview for your game , here you provide the name of the image that you added to **assets/images** folder, along with format type. Eg. ```Super_Mario_Game.png``` or ```Super_Mario_Game.jpg``` or with any other format.
-
-**Note:-** 
-
-   -  Do not modify anything else in the rest of the file, you only need to add your game in the end of the file. 
-   - Don't forget to add the comma for new entry (already give in above sample but this is a reminder as one might miss it to see in the sample)
 <br>
 ## **Pull Request Process 🚀**
 

diff --git a/Games/Anagram_Checker_Game/about.html b/Games/Anagram_Checker_Game/about.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>About Anagram Checker Game</title>
+    <link rel="stylesheet" href="styles.css">
+</head>
+<body>
+    <h1 align="center">About Anagram Checker Game</h1>
+    <div class="container">
+        <p>This Anagram Checker Game allows you to check if two words are anagrams of each other. An anagram is a word or phrase formed by rearranging the letters of a different word or phrase, typically using all the original letters exactly once.</p>
+
+        <h2>Features:</h2>
+        <ul>
+            <li>Simple and intuitive interface</li>
+            <li>Quickly check if two words are anagrams</li>
+            <li>Learn about anagrams and how they work</li>
+        </ul>
+
+        <h2>About Us:</h2>
+        <p>We are dedicated to creating fun and educational games that challenge your mind and expand your knowledge of language and literature.</p>
+
+        <h2>Contact Us:</h2>
+        <p>If you have any questions or feedback about the Anagram Checker Game, feel free to reach out to us at <a href="mailto:[email protected]">[email protected]</a>.</p>
+
+        <p>Follow us on social media for updates and more games!</p>
+        <ul>
+            <li><a href="#">Facebook</a></li>
+            <li><a href="#">Twitter</a></li>
+            <li><a href="#">Instagram</a></li>
+        </ul>
+
+        <p>Thank you for playing!</p>
+    </div>
+</body>
+</html>
diff --git a/Games/Anagram_Checker_Game/index.html b/Games/Anagram_Checker_Game/index.html
@@ -3,28 +3,43 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Document</title>
+    <title>Anagram Checker Game</title>
     <link rel="stylesheet" href="styles.css">
 </head>
 <body>
-  <h1 align="center" >Anagram Checker Game</h1>
-  <div class="container">
-
-  <h3>An anagram is a literary device where the letters that make up a word, phrase, or name are rearranged to create new ones. The original word or phrase is the subject of the anagram, the anagram is what is created by repurposing those letters.</h3>
-
-  <div class="form-group">
-  <label for="word1"> <h3>Enter first word:</h3> </label>
-  <input type="text" id="word1" class="form-control" size="40" >
-</div>
-<div class="form-group">
-  <label for="word2"><h3>Enter second word:</h3></label>
-  <input type="text" id="word2" class="form-control">
-</div>
-<button class="divbtn"  id="check-anagram" class="btn btn-primary">Check Anagram</button>
-
-<h2><div id="result" class="alert"></div> </h2> 
-</div>
-
-  <script src="script.js" ></script>
+    <header>
+        <nav>
+            <ul>
+                <li><a href="index.html">Home</a></li>
+                <li><a href="about.html">About Us</a></li> <!-- Added link to About Us page -->
+            </ul>
+        </nav>
+    </header>
+
+    <h1 align="center">Anagram Checker Game</h1>
+
+    <div class="container">
+        <h3>An anagram is a literary device where the letters that make up a word, phrase, or name are rearranged to create new ones. The original word or phrase is the subject of the anagram, the anagram is what is created by repurposing those letters.</h3>
+
+        <div class="form-group">
+            <label for="word1"><h3>Enter first word:</h3></label>
+            <input type="text" id="word1" class="form-control" size="40">
+        </div>
+
+        <div class="form-group">
+            <label for="word2"><h3>Enter second word:</h3></label>
+            <input type="text" id="word2" class="form-control">
+        </div>
+
+        <button id="check-anagram" class="btn btn-primary">Check Anagram</button>
+
+        <h2><div id="result" class="alert"></div></h2>
+    </div>
+
+    <footer>
+        <p>© 2024 Anagram Checker Game. <a href="about.html">About Us</a></p>
+    </footer>
+
+    <script src="script.js"></script>
 </body>
-</html>
+</html>
diff --git a/Games/Brain_Game/README.md b/Games/Brain_Game/README.md
@@ -0,0 +1,38 @@
+
+# **Brain Game** 
+
+---
+
+<br>
+
+## **Description 📃**
+<!-- add your game description here  -->
+- **Brain Game** is an interactive game where the player needs to determine if the name of the color matches its displayed color.
+- This is a single-player game.
+
+## **functionalities 🎮**
+<!-- add functionalities over here -->
+- The name of the color is display on the screen,the player checks whether the name of the color matches its displayed color.
+- The player have to decide within the time if it matches or not and click on the right option.
+- It provide the Keyboard Support where players can use the left arrow key (←) for "tick" and the right arrow key (→) for "cross" option.
+<br>
+
+## **How to play? 🕹️**
+<!-- add the steps how to play games -->
+- Click on the start button to start the game.
+- Checks whether the name of the color matches its displayed color.
+- If yes click on "tick" or use left arrow key (←) else click on "cross" or use right arrow key (→).
+- If click on wrong option the game ends with the score alert.
+
+<br>
+
+## **Screenshots 📸**
+
+<br>
+
+![image](../../assets/images/Brain_Game.png)
+
+<br>
+
+<!-- ## **Working video 📹** -->
+<!-- add your working video over here -->
diff --git a/Games/Brain_Game/index.html b/Games/Brain_Game/index.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Brain Game</title>
+    <link rel="stylesheet" href="style.css">
+</head>
+<body>
+    <div class="con">
+        <div class="intro">
+            <h1>Brain Game</h1>
+        </div>
+        <div id="prg" class="prg">
+            <div id="timeBar"></div>
+        </div>
+        <div id="disp" class="hidden">
+            <h1 id="colors"></h1>
+        </div>
+        <div class="score hidden">
+            <h2 id="scr">0</h2>
+        </div>
+        <div class="control hidden">
+            <button onclick="right()" id="right">&#10004;</button>
+            <button onclick="wrong()" id="wrong">&#10006;</button>
+        </div>
+        <div class="startBt">
+            <button onclick="start()" id="startBt">Start</button>
+        </div>
+    </div>
+    <script src="script.js"></script>
+</body>
+</html>