kunjgit · kunjgit · May 17, 2024 · May 17, 2024
diff --git a/Games/Ball_Shooting_Game/README.md b/Games/Ball_Shooting_Game/README.md
@@ -0,0 +1,29 @@
+# Ball Shooting Game
+
+This is a simple ball shooting game where you shoot balls to hit targets. The game is built using HTML, CSS, and JavaScript.
+
+## How to Play
+
+- Click anywhere on the canvas to shoot a ball.
+- Hit the targets with the balls to score points.
+- Each target hit increases your score by 10 points.
+- The game continues indefinitely, with new targets appearing as you hit them.
+
+## Project Structure
+
+The project consists of the following files:
+
+- `index.html`: The main HTML file that contains the structure of the game.
+- `styles.css`: The CSS file that styles the game.
+- `script.js`: The JavaScript file that contains the game logic.
+
+## Setup and Installation
+
+1. Clone the repository or download the project files.
+2. Open `index.html` in your web browser to start the game.
+
+## Gameplay
+	Click on the canvas to shoot balls.
+	Aim to hit the red targets.
+	Each hit adds 10 points to your score.
+	The game is endless; try to score as high as you can!
diff --git a/Games/Ball_Shooting_Game/index.html b/Games/Ball_Shooting_Game/index.html
@@ -0,0 +1,16 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Ball Shooting Game</title>
+    <link rel="stylesheet" href="styles.css">
+</head>
+<body>
+    <div id="gameContainer">
+        <canvas id="gameCanvas"></canvas>
+        <div id="score">Score: 0</div>
+    </div>
+    <script src="script.js"></script>
+</body>
+</html>
diff --git a/Games/Ball_Shooting_Game/script.js b/Games/Ball_Shooting_Game/script.js
@@ -0,0 +1,101 @@
+// script.js
+const canvas = document.getElementById('gameCanvas');
+const ctx = canvas.getContext('2d');
+const scoreElement = document.getElementById('score');
+canvas.width = 800;
+canvas.height = 600;
+
+let score = 0;
+let balls = [];
+let targets = [];
+const ballRadius = 5;
+const targetRadius = 20;
+const ballSpeed = 5;
+
+// Function to create a new ball
+function createBall(x, y) {
+    balls.push({ x, y, dx: ballSpeed, dy: ballSpeed });
+}
+
+// Function to create targets at random positions
+function createTarget() {
+    const x = Math.random() * (canvas.width - 2 * targetRadius) + targetRadius;
+    const y = Math.random() * (canvas.height - 2 * targetRadius) + targetRadius;
+    targets.push({ x, y });
+}
+
+// Function to update the positions of balls
+function updateBalls() {
+    balls.forEach((ball, index) => {
+        ball.x += ball.dx;
+        ball.y += ball.dy;
+
+        // Check for collisions with walls
+        if (ball.x + ballRadius > canvas.width || ball.x - ballRadius < 0) {
+            ball.dx = -ball.dx;
+        }
+        if (ball.y + ballRadius > canvas.height || ball.y - ballRadius < 0) {
+            ball.dy = -ball.dy;
+        }
+
+        // Check for collisions with targets
+        targets.forEach((target, targetIndex) => {
+            const dist = Math.hypot(ball.x - target.x, ball.y - target.y);
+            if (dist < ballRadius + targetRadius) {
+                targets.splice(targetIndex, 1);
+                balls.splice(index, 1);
+                score += 10;
+                scoreElement.innerText = `Score: ${score}`;
+                createTarget();
+            }
+        });
+    });
+}
+
+// Function to draw the balls
+function drawBalls() {
+    balls.forEach(ball => {
+        ctx.beginPath();
+        ctx.arc(ball.x, ball.y, ballRadius, 0, Math.PI * 2);
+        ctx.fillStyle = '#00f';
+        ctx.fill();
+        ctx.closePath();
+    });
+}
+
+// Function to draw the targets
+function drawTargets() {
+    targets.forEach(target => {
+        ctx.beginPath();
+        ctx.arc(target.x, target.y, targetRadius, 0, Math.PI * 2);
+        ctx.fillStyle = '#f00';
+        ctx.fill();
+        ctx.closePath();
+    });
+}
+
+// Function to draw everything
+function draw() {
+    ctx.clearRect(0, 0, canvas.width, canvas.height);
+    drawBalls();
+    drawTargets();
+}
+
+// Main game loop
+function gameLoop() {
+    updateBalls();
+    draw();
+    requestAnimationFrame(gameLoop);
+}
+
+// Event listener to shoot balls
+canvas.addEventListener('click', (e) => {
+    const rect = canvas.getBoundingClientRect();
+    const x = e.clientX - rect.left;
+    const y = e.clientY - rect.top;
+    createBall(x, y);
+});
+
+// Initialize the game
+createTarget();
+gameLoop();
diff --git a/Games/Ball_Shooting_Game/styles.css b/Games/Ball_Shooting_Game/styles.css
@@ -0,0 +1,28 @@
+/* styles.css */
+body {
+    margin: 0;
+    padding: 0;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 100vh;
+    background: linear-gradient(to right, #ff7e5f, #feb47b);
+    font-family: Arial, sans-serif;
+}
+
+#gameContainer {
+    position: relative;
+}
+
+#gameCanvas {
+    background-color: #fff;
+    border: 2px solid #000;
+}
+
+#score {
+    position: absolute;
+    top: 10px;
+    left: 10px;
+    font-size: 20px;
+    color: #333;
+}
diff --git a/README.md b/README.md
@@ -190,6 +190,7 @@ This repository also provides one such platforms where contributers come over an
 | [Emoji_Intruder](https://github.com/kunjgit/GameZone/tree/main/Games/Emoji_Intruder)                             | [Guess The Weapon](https://github.com/kunjgit/GameZone/tree/main/Games/Guess_The_Weapon)                | [Guess Who](https://github.com/kunjgit/GameZone/tree/main/Games/Guess_Who)                                                               | [Pop My Balloon](https://github.com/kunjgit/GameZone/tree/main/Games/Pop_My_Balloon)                                                                                                                   |                                                                                                             |
 | [Maze_Game](https://github.com/kunjgit/GameZone/tree/main/Games/Maze_Game)                               |
 
+| [Ball_Shooting_Game](https://github.com/kunjgit/GameZone/tree/main/Games/Ball_Shooting_Game)                               |
 
  </center>
 

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