Merge pull request kunjgit#3978 from Aditi22Bansal/main

Solved issue kunjgit#3977- Forest Guardian Game
Pujan-sarkar · Jun 2, 2024 · b9a9625 · b9a9625
2 parents 5da7596 + 631ef7c
commit b9a9625
Show file tree

Hide file tree

Showing 7 changed files with 281 additions and 13 deletions.
diff --git a/Games/Forest_Guardian/README.md b/Games/Forest_Guardian/README.md
@@ -0,0 +1,59 @@
+# Forest Guardian
+
+Forest Guardian is a simple browser-based game where players control a guardian spirit navigating through a magical forest, collecting orbs while avoiding harmful creatures.
+
+## How to Play
+
+### Objective:
+The goal of the game is to collect magical orbs while avoiding harmful creatures. As you collect orbs, you gain points and advance to higher levels, where the game becomes more challenging.
+
+### Controls:
+- **Move Left:** Press the left arrow key (`←`) to move the guardian left.
+- **Move Right:** Press the right arrow key (`→`) to move the guardian right.
+- **Move Up:** Press the up arrow key (`↑`) to move the guardian up.
+- **Move Down:** Press the down arrow key (`↓`) to move the guardian down.
+
+### Gameplay:
+1. **Starting the Game:**
+   - The game starts automatically when you open the HTML file in a web browser.
+   - The guardian spirit appears at the bottom center of the screen.
+   - Orbs and creatures will start appearing randomly in the forest.
+
+2. **Collecting Orbs:**
+   - Move the guardian to collect the magical orbs. Each orb collected increases your score by 10 points.
+   - As you collect orbs, they will reappear at new random positions.
+
+3. **Avoiding Creatures:**
+   - Harmful creatures appear and move down the screen. Avoid touching them.
+   - If the guardian collides with a creature, the game ends.
+
+4. **Advancing Levels:**
+   - Every 50 points, you advance to a new level.
+   - More creatures appear, and they move faster, making it more challenging.
+
+5. **Game Over:**
+   - If the guardian collides with a creature, the game will display a "Game Over" alert with your final score.
+   - You can restart the game by clicking the "OK" button on the alert.
+
+## Functionalities
+
+- **Guardian Movement:** Use arrow keys to move the guardian in four directions: left, right, up, and down.
+- **Orb Collection:** Collect magical orbs to increase your score.
+- **Creature Avoidance:** Avoid harmful creatures to stay alive and continue playing.
+- **Progressive Difficulty:** The game becomes more challenging as you advance levels, with more creatures and faster movement.
+- **Score Tracking:** Track your score and current level on the scoreboard.
+
+## Screenshots (if available)
+
+Adding screenshots of the game in action to showcase its visuals and gameplay.
+![image](https://github.com/Aditi22Bansal/GameZone/assets/142652964/26166445-f8e8-4eb6-81d9-b08d95725592)
+
+## Technologies Used
+
+- HTML
+- CSS
+- JavaScript
+
+## Credits
+
+This game was created by Aditi Bansal.
diff --git a/Games/Forest_Guardian/index.html b/Games/Forest_Guardian/index.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Forest Guardian</title>
+    <link rel="stylesheet" href="styles.css">
+</head>
+<body>
+    <div id="game-container">
+        <div id="guardian"></div>
+        <div id="orb"></div>
+        <div id="creatures"></div>
+        <div id="score-board">
+            <span id="score">Score: 0</span>
+            <span id="level">Level: 1</span>
+        </div>
+    </div>
+    <script src="script.js"></script>
+</body>
+</html>
diff --git a/Games/Forest_Guardian/script.js b/Games/Forest_Guardian/script.js
@@ -0,0 +1,142 @@
+// script.js
+const guardian = document.getElementById('guardian');
+const orb = document.getElementById('orb');
+const creatures = document.getElementById('creatures');
+const scoreBoard = document.getElementById('score');
+const levelBoard = document.getElementById('level');
+
+let score = 0;
+let level = 1;
+let gameInterval;
+let moveLeft = false;
+let moveRight = false;
+let moveUp = false;
+let moveDown = false;
+
+// Function to start the game
+function startGame() {
+    placeOrb();
+    placeCreatures();
+    gameInterval = setInterval(updateGame, 20);
+}
+
+// Function to update game elements
+function updateGame() {
+    moveGuardian();
+    moveCreatures();
+    checkCollisions();
+}
+
+// Function to move the guardian
+function moveGuardian() {
+    let left = parseInt(window.getComputedStyle(guardian).left);
+    let top = parseInt(window.getComputedStyle(guardian).top);
+    if (moveLeft && left > 0) {
+        guardian.style.left = left - 5 + 'px';
+    }
+    if (moveRight && left < window.innerWidth - 50) {
+        guardian.style.left = left + 5 + 'px';
+    }
+    if (moveUp && top > 0) {
+        guardian.style.top = top - 5 + 'px';
+    }
+    if (moveDown && top < window.innerHeight - 50) {
+        guardian.style.top = top + 5 + 'px';
+    }
+}
+
+// Event listeners for key presses
+document.addEventListener('keydown', (e) => {
+    if (e.key === 'ArrowLeft') moveLeft = true;
+    if (e.key === 'ArrowRight') moveRight = true;
+    if (e.key === 'ArrowUp') moveUp = true;
+    if (e.key === 'ArrowDown') moveDown = true;
+});
+
+document.addEventListener('keyup', (e) => {
+    if (e.key === 'ArrowLeft') moveLeft = false;
+    if (e.key === 'ArrowRight') moveRight = false;
+    if (e.key === 'ArrowUp') moveUp = false;
+    if (e.key === 'ArrowDown') moveDown = false;
+});
+
+// Function to place the orb at a random position
+function placeOrb() {
+    orb.style.top = Math.random() * (window.innerHeight - 100) + 'px';
+    orb.style.left = Math.random() * (window.innerWidth - 30) + 'px';
+}
+
+// Function to place creatures at random positions
+function placeCreatures() {
+    creatures.innerHTML = '';
+    for (let i = 0; i < level; i++) {
+        let creature = document.createElement('div');
+        creature.className = 'creature';
+        creature.style.top = Math.random() * (window.innerHeight - 40) + 'px';
+        creature.style.left = Math.random() * (window.innerWidth - 40) + 'px';
+        creatures.appendChild(creature);
+    }
+}
+
+// Function to move creatures
+function moveCreatures() {
+    let creatureElements = document.querySelectorAll('.creature');
+    creatureElements.forEach(creature => {
+        let top = parseInt(window.getComputedStyle(creature).top);
+        creature.style.top = top + 2 + 'px';
+        if (top > window.innerHeight) {
+            creature.style.top = '-40px';
+            creature.style.left = Math.random() * (window.innerWidth - 40) + 'px';
+        }
+    });
+}
+
+// Function to check collisions
+function checkCollisions() {
+    // Check collision with orb
+    let guardianRect = guardian.getBoundingClientRect();
+    let orbRect = orb.getBoundingClientRect();
+    if (
+        guardianRect.x < orbRect.x + orbRect.width &&
+        guardianRect.x + guardianRect.width > orbRect.x &&
+        guardianRect.y < orbRect.y + orbRect.height &&
+        guardianRect.y + guardianRect.height > orbRect.y
+    ) {
+        score += 10;
+        scoreBoard.textContent = 'Score: ' + score;
+        placeOrb();
+        if (score % 50 === 0) {
+            level++;
+            levelBoard.textContent = 'Level: ' + level;
+            placeCreatures();
+        }
+    }
+
+    // Check collision with creatures
+    let creatureElements = document.querySelectorAll('.creature');
+    creatureElements.forEach(creature => {
+        let creatureRect = creature.getBoundingClientRect();
+        if (
+            guardianRect.x < creatureRect.x + creatureRect.width &&
+            guardianRect.x + guardianRect.width > creatureRect.x &&
+            guardianRect.y < creatureRect.y + creatureRect.height &&
+            guardianRect.y + guardianRect.height > creatureRect.y
+        ) {
+            clearInterval(gameInterval);
+            alert('Game Over! Your score: ' + score);
+            resetGame();
+        }
+    });
+}
+
+// Function to reset the game
+function resetGame() {
+    score = 0;
+    level = 1;
+    scoreBoard.textContent = 'Score: ' + score;
+    levelBoard.textContent = 'Level: ' + level;
+    startGame();
+}
+
+// Start the game initially
+startGame();
diff --git a/Games/Forest_Guardian/styles.css b/Games/Forest_Guardian/styles.css
@@ -0,0 +1,55 @@
+/* styles.css */
+body {
+    margin: 0;
+    overflow: hidden;
+    font-family: Arial, sans-serif;
+    background-color: #e0f7fa;
+}
+
+#game-container {
+    position: relative;
+    width: 100vw;
+    height: 100vh;
+    background: #2e8b57; /* Simulating forest background with a solid color */
+}
+
+#guardian {
+    position: absolute;
+    bottom: 10px;
+    left: 50%;
+    width: 50px;
+    height: 50px;
+    background-color: blue; /* Placeholder for guardian */
+    transform: translateX(-50%);
+}
+
+#orb {
+    position: absolute;
+    width: 30px;
+    height: 30px;
+    background-color: #ffeb3b;
+    border-radius: 50%;
+}
+
+#creatures {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+}
+
+.creature {
+    position: absolute;
+    width: 40px;
+    height: 40px;
+    background-color: red; /* Placeholder for creatures */
+}
+
+#score-board {
+    position: absolute;
+    top: 10px;
+    left: 10px;
+    color: #ffffff;
+    background: rgba(0, 0, 0, 0.5);
+    padding: 10px;
+    border-radius: 5px;
+}
diff --git a/README.md b/README.md
@@ -327,26 +327,17 @@ This repository also provides one such platforms where contributers come over an
 | [Pixel Painter](https://github.com/kunjgit/GameZone/tree/main/Games/pixel_painter)                                 |
 | [Reflex Game](https://github.com/kunjgit/GameZone/tree/main/Games/Reflex_Game)                                 |
 | [NewsJunction](https://github.com/kunjgit/GameZone/tree/main/Games/NewsJunction)                  |
-
-
 | [Recognizing_Figures](https://github.com/kunjgit/GameZone/tree/main/Games/Recognizing_Figures)                  | [Screen Pet Game](https://github.com/kunjgit/GameZone/tree/main/Games/Screen-Pet-Game) |
-                 
-
-| [Recognizing_Figures](https://github.com/kunjgit/GameZone/tree/main/Games/Recognizing_Figures)                  |
-
-
 | [Sudoku_light_theme](https://github.com/kunjgit/GameZone/tree/main/Games/Sudoku_light_theme)                  |
-
-
 | [Find_the_ball](https://github.com/kunjgit/GameZone/tree/main/Games/Find_the_ball)                  |
 |[Color The Page](https://github.com/kunjgit/GameZone/tree/main/Games/Color_The_Page)|
-
-
+| [Forest_Guardian](https://github.com/kunjgit/GameZone/tree/main/Games/Forst_Guardian)                  |
+| [Sudoku_light_theme](https://github.com/kunjgit/GameZone/tree/main/Games/Sudoku_light_theme)                  |
+| [Find_the_ball](https://github.com/kunjgit/GameZone/tree/main/Games/Find_the_ball)                  |
+|[Color The Page](https://github.com/kunjgit/GameZone/tree/main/Games/Color_The_Page)|
 | [Tic-Tac-Toe Game](https://github.com/kunjgit/GameZone/tree/main/Games/Tic-Tac-Toe) |
-
 | [Rapid_click_frenzy](https://github.com/kunjgit/GameZone/tree/main/Games/Rapid_click_frenzy)                  |
 
-
  </center>
 
 <br>

diff --git a/assets/Forest_guardian.png b/assets/Forest_guardian.png
diff --git a/assets/images/Forest_guardian.png b/assets/images/Forest_guardian.png