Merge branch 'puzzle' of https://github.com/manikumarreddyu/GameZone …

…into puzzle
kunjgit · Jun 9, 2024 · 7bd2a0c · 7bd2a0c
2 parents 7931ca4 + ff8f0fc
commit 7bd2a0c
Show file tree

Hide file tree

Showing 173 changed files with 8,540 additions and 346 deletions.
diff --git a/.github/workflows/pr_tags.yaml b/.github/workflows/pr_tags.yaml
@@ -75,4 +75,4 @@
 #             labels: prLabels.map(function(label) {
 #               return label.name;
 #             })
-#           });
+#           });
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,2 @@
+
+assets/images/Pixel_Painter.png
diff --git a/Games/Anagram -Word-Game/README.md b/Games/Anagram -Word-Game/README.md
@@ -0,0 +1,43 @@
+# **Anagram Word Game**
+
+---
+
+<br>
+
+## **Description 📃**
+
+- Anagram Word Game is an engaging web-based game where players are challenged to unscramble a given set of letters to form a correct word. This game is designed to test and enhance players' vocabulary and cognitive skills in a fun and interactive way, providing an enjoyable gaming experience for all ages.
+
+## **Functionalities 🎮**
+
+- Presents players with a scrambled word.
+- Allows players to input their guessed word.
+- Provides instant feedback on the correctness of the guessed word.
+- Generates a new scrambled word for each game session.
+- Tracks and displays the player's score.
+- Features a sleek and intuitive user interface for seamless gaming.
+
+<br>
+
+## **How to play? 🕹️**
+
+1. Launch the Anagram Word Game in your browser.
+2. Observe the scrambled word presented on the screen.
+3. Enter your guess for the correct word into the provided input field.
+4. Click "Submit Guess" to verify your answer.
+5. If correct, you'll receive a confirmation message and your score will increase; otherwise, try again or click "Give Up" to reveal the correct word.
+6. Click "Next Word" to generate a new scrambled word and continue playing.
+
+<br>
+
+## **Screenshots 📸**
+
+![image](https://github.com/manishh12/GameZone/assets/97523900/c24e9b9f-fdf2-4d3f-87c3-b2780bd27063)
+
+
+<br>
+<!-- add your screenshots like this -->
+<!-- ![image](url) -->
+
+<br>
+
diff --git a/Games/Anagram -Word-Game/index.html b/Games/Anagram -Word-Game/index.html
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Anagram Word Game</title>
+    <link rel="stylesheet" href="style.css">
+</head>
+<body>
+    <div class="container">
+        <h1>Anagram Word Game</h1>
+        <div id="game-container">
+            <p id="scrambled-word"></p>
+            <input type="text" id="guess" placeholder="Enter your guess">
+            <button id="submit-guess">Submit Guess</button>
+            <button id="give-up">Give Up</button>
+            <p id="result-message"></p>
+            <button id="next-word">Next Word</button>
+        </div>
+        <div id="score-container">
+            <p>Score: <span id="score">0</span></p>
+        </div>
+    </div>
+    <script src="script.js"></script>
+</body>
+</html>
diff --git a/Games/Anagram -Word-Game/script.js b/Games/Anagram -Word-Game/script.js
@@ -0,0 +1,52 @@
+const words = ["javascript", "python", "programming", "developer", "computer"];
+let currentWord = '';
+let scrambledWord = '';
+let score = 0;
+
+function scrambleWord(word) {
+    let scrambled = word.split('').sort(() => 0.5 - Math.random()).join('');
+    return scrambled;
+}
+
+function pickRandomWord() {
+    const randomIndex = Math.floor(Math.random() * words.length);
+    currentWord = words[randomIndex];
+    scrambledWord = scrambleWord(currentWord);
+    document.getElementById('scrambled-word').innerText = scrambledWord;
+}
+
+function checkGuess() {
+    const guess = document.getElementById('guess').value.toLowerCase();
+    if (guess === currentWord) {
+        document.getElementById('result-message').innerText = `Correct! The word was "${currentWord}".`;
+        score += 10;
+        document.getElementById('score').innerText = score;
+        document.getElementById('next-word').style.display = 'inline-block';
+        document.getElementById('submit-guess').disabled = true;
+        document.getElementById('give-up').disabled = true;
+    } else {
+        document.getElementById('result-message').innerText = "Incorrect, try again.";
+        score -= 2;
+        document.getElementById('score').innerText = score;
+    }
+}
+
+function giveUp() {
+    document.getElementById('result-message').innerText = `The correct word was "${currentWord}".`;
+    document.getElementById('next-word').style.display = 'inline-block';
+    document.getElementById('submit-guess').disabled = true;
+    document.getElementById('give-up').disabled = true;
+}
+
+document.getElementById('submit-guess').addEventListener('click', checkGuess);
+document.getElementById('give-up').addEventListener('click', giveUp);
+document.getElementById('next-word').addEventListener('click', () => {
+    document.getElementById('guess').value = '';
+    document.getElementById('result-message').innerText = '';
+    document.getElementById('next-word').style.display = 'none';
+    document.getElementById('submit-guess').disabled = false;
+    document.getElementById('give-up').disabled = false;
+    pickRandomWord();
+});
+
+pickRandomWord();
diff --git a/Games/Anagram -Word-Game/style.css b/Games/Anagram -Word-Game/style.css
@@ -0,0 +1,76 @@
+body {
+  font-family: 'Arial', sans-serif;
+  background: linear-gradient(135deg, #0f9997, #e9ecef);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 100vh;
+  margin: 0;
+}
+
+.container {
+  text-align: center;
+  background-color: #fff;
+  padding: 20px;
+  border-radius: 12px;
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+  max-width: 400px;
+  width: 100%;
+}
+
+h1 {
+  margin-bottom: 20px;
+  color: #343a40;
+}
+
+#game-container {
+  margin-top: 20px;
+}
+
+#scrambled-word {
+  font-size: 24px;
+  margin-bottom: 20px;
+  color: #007BFF;
+  font-weight: bold;
+}
+
+input {
+  padding: 10px;
+  margin: 5px;
+  font-size: 16px;
+  border: 1px solid #ced4da;
+  border-radius: 4px;
+  width: calc(100% - 22px);
+}
+
+button {
+  padding: 10px 15px;
+  margin: 5px;
+  font-size: 16px;
+  border: 1px solid #007BFF;
+  border-radius: 4px;
+  background-color: #007BFF;
+  color: white;
+  cursor: pointer;
+  width: calc(100% - 22px);
+}
+
+button:hover {
+  background-color: #0056b3;
+}
+
+#result-message {
+  margin-top: 20px;
+  font-size: 18px;
+}
+
+#next-word {
+  display: none;
+  margin-top: 20px;
+}
+
+#score-container {
+  margin-top: 20px;
+  font-size: 18px;
+  color: #495057;
+}
diff --git a/Games/Brick Buster/README.md b/Games/Brick Buster/README.md
@@ -0,0 +1,21 @@
+# Brick Buster
+
+## Description
+Brick Buster is a classic arcade game where players control a paddle at the bottom of the screen, bouncing a ball to destroy bricks at the top of the screen. The goal is to clear all the bricks by hitting them with the ball while preventing the ball from falling off the bottom of the screen.
+
+## Features
+- *Paddle Control*: Players control the paddle using the left and right arrow keys.
+- *Ball Physics*: The ball moves around the screen, bouncing off walls, the paddle, and bricks.
+- *Brick Destruction*: Bricks are destroyed when hit by the ball, and the player scores points.
+- *Level Completion*: The game progresses to the next level when all bricks are destroyed.
+- *Game Over*: The game ends if the ball falls off the bottom of the screen.
+- *Score Tracking*: Displays the player's score.
+- *Winning Condition*: The player wins if all bricks are destroyed.
+
+## How to Play
+1. Use the left and right arrow keys to move the paddle.
+2. Bounce the ball off the paddle to hit and destroy the bricks.
+3. Prevent the ball from falling off the bottom of the screen.
+4. Clear all the bricks to win the game.
+
+Enjoy playing Brick Buster!
diff --git a/Games/Brick Buster/index.html b/Games/Brick Buster/index.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Brick Buster</title>
+    <link rel="stylesheet" href="style.css">
+</head>
+<body>
+    <div class="container">
+        <div class="score" id="score">Score: 0</div>
+        <div class="game-area" id="game-area">
+            <div class="paddle" id="paddle"></div>
+            <div class="ball" id="ball"></div>
+            <div class="bricks" id="bricks"></div>
+        </div>
+    </div>
+    <script src="script.js"></script>
+</body>
+</html>
diff --git a/Games/Brick Buster/script.js b/Games/Brick Buster/script.js
@@ -0,0 +1,117 @@
+const paddle = document.getElementById('paddle');
+const ball = document.getElementById('ball');
+const bricksContainer = document.getElementById('bricks');
+const scoreElement = document.getElementById('score');
+
+const gameArea = document.getElementById('game-area');
+const gameAreaRect = gameArea.getBoundingClientRect();
+
+const paddleWidth = paddle.clientWidth;
+const paddleHeight = paddle.clientHeight;
+const ballSize = ball.clientWidth;
+
+let score = 0;
+let ballX = gameAreaRect.width / 2;
+let ballY = gameAreaRect.height / 2;
+let ballSpeedX = 3;
+let ballSpeedY = 3;
+let paddleX = (gameAreaRect.width - paddleWidth) / 2;
+
+const rows = 5;
+const cols = 10;
+const brickWidth = 80;
+const brickHeight = 20;
+const brickMargin = 10;
+
+let bricks = [];
+
+function createBricks() {
+    for (let row = 0; row < rows; row++) {
+        for (let col = 0; col < cols; col++) {
+            const brick = document.createElement('div');
+            brick.classList.add('brick');
+            brick.style.left = `${col * (brickWidth + brickMargin)}px`;
+            brick.style.top = `${row * (brickHeight + brickMargin)}px`;
+            bricksContainer.appendChild(brick);
+            bricks.push(brick);
+        }
+    }
+}
+
+function movePaddle(event) {
+    const step = 20;
+    if (event.key === 'ArrowLeft' && paddleX > 0) {
+        paddleX -= step;
+    } else if (event.key === 'ArrowRight' && paddleX < gameAreaRect.width - paddleWidth) {
+        paddleX += step;
+    }
+
+    updatePaddlePosition();
+}
+
+function updatePaddlePosition() {
+    paddle.style.left = `${paddleX}px`;
+}
+
+function resetBall() {
+    ballX = gameAreaRect.width / 2;
+    ballY = gameAreaRect.height / 2;
+    ballSpeedX = 3;
+    ballSpeedY = -3;
+}
+
+function updateBall() {
+    ballX += ballSpeedX;
+    ballY += ballSpeedY;
+
+    if (ballX <= 0 || ballX >= gameAreaRect.width - ballSize) {
+        ballSpeedX = -ballSpeedX;
+    }
+
+    if (ballY <= 0) {
+        ballSpeedY = -ballSpeedY;
+    }
+
+    if (ballY >= gameAreaRect.height - ballSize) {
+        alert('Game Over');
+        resetBall();
+    }
+
+    const paddleRect = paddle.getBoundingClientRect();
+    const ballRect = ball.getBoundingClientRect();
+
+    if (ballRect.bottom >= paddleRect.top && ballRect.right >= paddleRect.left && ballRect.left <= paddleRect.right) {
+        ballSpeedY = -ballSpeedY;
+    }
+
+    bricks.forEach((brick, index) => {
+        const brickRect = brick.getBoundingClientRect();
+        if (ballRect.right >= brickRect.left && ballRect.left <= brickRect.right && ballRect.bottom >= brickRect.top && ballRect.top <= brickRect.bottom) {
+            ballSpeedY = -ballSpeedY;
+            bricksContainer.removeChild(brick);
+            bricks.splice(index, 1);
+            score++;
+            scoreElement.textContent = `Score: ${score}`;
+        }
+    });
+
+    ball.style.left = `${ballX}px`;
+    ball.style.top = `${ballY}px`;
+
+    if (bricks.length === 0) {
+        alert('You Win!');
+        resetBall();
+        createBricks();
+    }
+}
+
+function gameLoop() {
+    updateBall();
+    requestAnimationFrame(gameLoop);
+}
+
+document.addEventListener('keydown', movePaddle);
+
+createBricks();
+resetBall();
+gameLoop();
-Original file line number
+Diff line change
@@ Expand Up / @@ -75,4 +75,4 @@ @@
     #             labels: prLabels.map(function(label) {
     #               return label.name;
     #             })
-    #           });
+    #           });