diff --git a/README.md b/README.md
index a1d3352b..e17dc9e5 100644
--- a/README.md
+++ b/README.md
@@ -264,6 +264,9 @@ ________________________________________________________________________________
| 206 | [Bomber_Game](.SinglePlayer%20-%20Games/Bomber_Game) |
| 207 | [Shape_Clicker_Game](.SinglePlayer%20-%20Games/Shape_Clicker_Game) |
| 208 | [Arkanoid_Game](.SinglePlayer%20-%20Games/Arkanoid_Game) |
+| 209 | [Brick_Breaker_Game](.SinglePlayer%20-%20Games/Brick_Breaker_Game) |
+| 210 | [Bash_Mole_Game](.SinglePlayer%20-%20Games/Bash_Mole_Game) |
+
diff --git a/SinglePlayer - Games/Banner - image/Bash_Mole_Game.png b/SinglePlayer - Games/Banner - image/Bash_Mole_Game.png
new file mode 100644
index 00000000..3ad8214d
Binary files /dev/null and b/SinglePlayer - Games/Banner - image/Bash_Mole_Game.png differ
diff --git a/SinglePlayer - Games/Banner - image/Brick_Breaker_Game.png b/SinglePlayer - Games/Banner - image/Brick_Breaker_Game.png
new file mode 100644
index 00000000..fbff41cb
Binary files /dev/null and b/SinglePlayer - Games/Banner - image/Brick_Breaker_Game.png differ
diff --git a/SinglePlayer - Games/Bash_Mole_Game/README.md b/SinglePlayer - Games/Bash_Mole_Game/README.md
new file mode 100644
index 00000000..155d9eb4
--- /dev/null
+++ b/SinglePlayer - Games/Bash_Mole_Game/README.md
@@ -0,0 +1,31 @@
+# Bash Mole Game
+
+This is a simple **Bash Mole Game** built using HTML, CSS, and JavaScript. The objective of the game is to click (bash) on the moles that pop up from the holes to earn points.
+
+## How to Play
+
+- The game lasts for 10 seconds.
+- Moles will randomly pop up from the holes.
+- Click on the moles to increase your score.
+- Your score is displayed at the top of the page.
+
+## Files
+
+- `index.html`: The main HTML file that sets up the game structure.
+- `style.css`: The CSS file for styling the game interface.
+- `script.js`: The JavaScript file containing the game logic.
+
+## How to Run
+
+1. Clone or download this repository.
+2. Open `index.html` in your web browser.
+
+## Future Enhancements
+
+- Add different levels with increasing difficulty.
+- Implement a high-score tracking system.
+- Add sound effects and animations for better gameplay experience.
+
+## License
+
+This project is open-source and available under the MIT License.
diff --git a/SinglePlayer - Games/Bash_Mole_Game/index.html b/SinglePlayer - Games/Bash_Mole_Game/index.html
new file mode 100644
index 00000000..71129dfc
--- /dev/null
+++ b/SinglePlayer - Games/Bash_Mole_Game/index.html
@@ -0,0 +1,25 @@
+
+
+
+
+
+ Bash Mole Game
+
+
+
+
Bash Mole Game
+
Score: 0
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/SinglePlayer - Games/Bash_Mole_Game/script.js b/SinglePlayer - Games/Bash_Mole_Game/script.js
new file mode 100644
index 00000000..b77fd8aa
--- /dev/null
+++ b/SinglePlayer - Games/Bash_Mole_Game/script.js
@@ -0,0 +1,49 @@
+const holes = document.querySelectorAll('.hole');
+const scoreDisplay = document.getElementById('score');
+let score = 0;
+let lastHole;
+let timeUp = false;
+
+function randomTime(min, max) {
+ return Math.round(Math.random() * (max - min) + min);
+}
+
+function randomHole(holes) {
+ const index = Math.floor(Math.random() * holes.length);
+ const hole = holes[index];
+ if (hole === lastHole) {
+ return randomHole(holes);
+ }
+ lastHole = hole;
+ return hole;
+}
+
+function peep() {
+ const time = randomTime(200, 1000);
+ const hole = randomHole(holes);
+ hole.classList.add('mole');
+ setTimeout(() => {
+ hole.classList.remove('mole');
+ if (!timeUp) peep();
+ }, time);
+}
+
+function startGame() {
+ scoreDisplay.textContent = 'Score: 0';
+ score = 0;
+ timeUp = false;
+ peep();
+ setTimeout(() => timeUp = true, 10000); // 10 seconds game
+}
+
+function whack(e) {
+ if (!e.isTrusted) return; // Prevent cheating
+ if (e.target.classList.contains('mole')) {
+ score++;
+ e.target.classList.remove('mole');
+ scoreDisplay.textContent = 'Score: ' + score;
+ }
+}
+
+holes.forEach(hole => hole.addEventListener('click', whack));
+startGame();
diff --git a/SinglePlayer - Games/Bash_Mole_Game/style.css b/SinglePlayer - Games/Bash_Mole_Game/style.css
new file mode 100644
index 00000000..cef5139f
--- /dev/null
+++ b/SinglePlayer - Games/Bash_Mole_Game/style.css
@@ -0,0 +1,38 @@
+body {
+ text-align: center;
+ font-family: Arial, sans-serif;
+ background-color: #f4f4f4;
+ margin: 0;
+ padding: 0;
+}
+
+h1 {
+ margin-top: 20px;
+ font-size: 2.5rem;
+ color: #333;
+}
+
+#score {
+ font-size: 1.5rem;
+ margin: 10px 0;
+}
+
+.grid {
+ display: grid;
+ grid-template-columns: repeat(3, 150px);
+ grid-gap: 10px;
+ justify-content: center;
+ margin-top: 20px;
+}
+
+.hole {
+ width: 150px;
+ height: 150px;
+ background-color: #8c8c8c;
+ border-radius: 10px;
+ position: relative;
+}
+
+.hole.mole {
+ background-color: #ff6347;
+}
diff --git a/SinglePlayer - Games/Brick_Breaker_Game/README.md b/SinglePlayer - Games/Brick_Breaker_Game/README.md
new file mode 100644
index 00000000..e81a491c
--- /dev/null
+++ b/SinglePlayer - Games/Brick_Breaker_Game/README.md
@@ -0,0 +1,31 @@
+# Brick Breaker Game
+
+This is a simple Brick Breaker game built using HTML, CSS, and JavaScript. The game involves a paddle that the player moves left and right to bounce a ball against bricks, breaking them.
+
+## How to Play
+
+- Use the left and right arrow keys to move the paddle.
+- The objective is to break all the bricks without letting the ball fall off the screen.
+- You have 3 lives. If you lose all lives, the game is over.
+
+## Files
+
+- `index.html`: The main HTML file that sets up the game canvas.
+- `style.css`: The CSS file for styling the game canvas and background.
+- `script.js`: The JavaScript file containing the game logic and rendering.
+
+## How to Run
+
+1. Clone or download this repository.
+2. Open `index.html` in your web browser.
+
+## Future Enhancements
+
+- Add more levels with increasing difficulty.
+- Implement power-ups like larger paddles, extra balls, etc.
+- Add sound effects and background music.
+
+## License
+
+This project is open-source and available under the MIT License.
+
diff --git a/SinglePlayer - Games/Brick_Breaker_Game/index.html b/SinglePlayer - Games/Brick_Breaker_Game/index.html
new file mode 100644
index 00000000..97204e84
--- /dev/null
+++ b/SinglePlayer - Games/Brick_Breaker_Game/index.html
@@ -0,0 +1,13 @@
+
+
+
+
+
+ Brick Breaker Game
+
+
+
+
+
+
+
diff --git a/SinglePlayer - Games/Brick_Breaker_Game/script.js b/SinglePlayer - Games/Brick_Breaker_Game/script.js
new file mode 100644
index 00000000..c461c986
--- /dev/null
+++ b/SinglePlayer - Games/Brick_Breaker_Game/script.js
@@ -0,0 +1,171 @@
+const canvas = document.getElementById("gameCanvas");
+const ctx = canvas.getContext("2d");
+
+canvas.width = 480;
+canvas.height = 320;
+
+const paddleHeight = 10;
+const paddleWidth = 75;
+let paddleX = (canvas.width - paddleWidth) / 2;
+
+let rightPressed = false;
+let leftPressed = false;
+
+const ballRadius = 10;
+let x = canvas.width / 2;
+let y = canvas.height - 30;
+let dx = 2;
+let dy = -2;
+
+const brickRowCount = 3;
+const brickColumnCount = 5;
+const brickWidth = 75;
+const brickHeight = 20;
+const brickPadding = 10;
+const brickOffsetTop = 30;
+const brickOffsetLeft = 30;
+
+let bricks = [];
+for (let c = 0; c < brickColumnCount; c++) {
+ bricks[c] = [];
+ for (let r = 0; r < brickRowCount; r++) {
+ bricks[c][r] = { x: 0, y: 0, status: 1 };
+ }
+}
+
+let score = 0;
+let lives = 3;
+
+document.addEventListener("keydown", keyDownHandler);
+document.addEventListener("keyup", keyUpHandler);
+
+function keyDownHandler(e) {
+ if (e.key === "Right" || e.key === "ArrowRight") {
+ rightPressed = true;
+ } else if (e.key === "Left" || e.key === "ArrowLeft") {
+ leftPressed = true;
+ }
+}
+
+function keyUpHandler(e) {
+ if (e.key === "Right" || e.key === "ArrowRight") {
+ rightPressed = false;
+ } else if (e.key === "Left" || e.key === "ArrowLeft") {
+ leftPressed = false;
+ }
+}
+
+function collisionDetection() {
+ for (let c = 0; c < brickColumnCount; c++) {
+ for (let r = 0; r < brickRowCount; r++) {
+ let b = bricks[c][r];
+ if (b.status === 1) {
+ if (
+ x > b.x &&
+ x < b.x + brickWidth &&
+ y > b.y &&
+ y < b.y + brickHeight
+ ) {
+ dy = -dy;
+ b.status = 0;
+ score++;
+ if (score === brickRowCount * brickColumnCount) {
+ alert("YOU WIN, CONGRATS!");
+ document.location.reload();
+ }
+ }
+ }
+ }
+ }
+}
+
+function drawBall() {
+ ctx.beginPath();
+ ctx.arc(x, y, ballRadius, 0, Math.PI * 2);
+ ctx.fillStyle = "#00ff00";
+ ctx.fill();
+ ctx.closePath();
+}
+
+function drawPaddle() {
+ ctx.beginPath();
+ ctx.rect(paddleX, canvas.height - paddleHeight, paddleWidth, paddleHeight);
+ ctx.fillStyle = "#00ff00";
+ ctx.fill();
+ ctx.closePath();
+}
+
+function drawBricks() {
+ for (let c = 0; c < brickColumnCount; c++) {
+ for (let r = 0; r < brickRowCount; r++) {
+ if (bricks[c][r].status === 1) {
+ let brickX = c * (brickWidth + brickPadding) + brickOffsetLeft;
+ let brickY = r * (brickHeight + brickPadding) + brickOffsetTop;
+ bricks[c][r].x = brickX;
+ bricks[c][r].y = brickY;
+ ctx.beginPath();
+ ctx.rect(brickX, brickY, brickWidth, brickHeight);
+ ctx.fillStyle = "#ff0000";
+ ctx.fill();
+ ctx.closePath();
+ }
+ }
+ }
+}
+
+function drawScore() {
+ ctx.font = "16px Arial";
+ ctx.fillStyle = "#00ff00";
+ ctx.fillText("Score: " + score, 8, 20);
+}
+
+function drawLives() {
+ ctx.font = "16px Arial";
+ ctx.fillStyle = "#00ff00";
+ ctx.fillText("Lives: " + lives, canvas.width - 65, 20);
+}
+
+function draw() {
+ ctx.clearRect(0, 0, canvas.width, canvas.height);
+ drawBricks();
+ drawBall();
+ drawPaddle();
+ drawScore();
+ drawLives();
+ collisionDetection();
+
+ if (x + dx > canvas.width - ballRadius || x + dx < ballRadius) {
+ dx = -dx;
+ }
+ if (y + dy < ballRadius) {
+ dy = -dy;
+ } else if (y + dy > canvas.height - ballRadius) {
+ if (x > paddleX && x < paddleX + paddleWidth) {
+ dy = -dy;
+ } else {
+ lives--;
+ if (!lives) {
+ alert("GAME OVER");
+ document.location.reload();
+ } else {
+ x = canvas.width / 2;
+ y = canvas.height - 30;
+ dx = 3;
+ dy = -3;
+ paddleX = (canvas.width - paddleWidth) / 2;
+ }
+ }
+ }
+
+ if (rightPressed && paddleX < canvas.width - paddleWidth) {
+ paddleX += 7;
+ } else if (leftPressed && paddleX > 0) {
+ paddleX -= 7;
+ }
+
+ x += dx;
+ y += dy;
+ requestAnimationFrame(draw);
+}
+
+draw();
diff --git a/SinglePlayer - Games/Brick_Breaker_Game/style.css b/SinglePlayer - Games/Brick_Breaker_Game/style.css
new file mode 100644
index 00000000..99dc08de
--- /dev/null
+++ b/SinglePlayer - Games/Brick_Breaker_Game/style.css
@@ -0,0 +1,14 @@
+body {
+ margin: 0;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ height: 100vh;
+ background-color: #222;
+}
+
+#gameCanvas {
+ background: #000;
+ display: block;
+ border: 1px solid #fff;
+}
diff --git a/additionalpage/game.html b/additionalpage/game.html
index 97cfe8d0..e4e86c8a 100644
--- a/additionalpage/game.html
+++ b/additionalpage/game.html
@@ -2562,6 +2562,123 @@
+ 
+ 
+ 
+