diff --git a/Games/whack a mole/README.md b/Games/whack a mole/README.md new file mode 100644 index 0000000000..e69de29bb2 diff --git a/Games/whack a mole/index.html b/Games/whack a mole/index.html new file mode 100644 index 0000000000..07da5a375d --- /dev/null +++ b/Games/whack a mole/index.html @@ -0,0 +1,27 @@ + + + + + + Whack-a-Mole + + + +
+
+
+
+
+
+
+
+
+
+
+
+
Score: 0
+
Time: 30
+
+ + + diff --git a/Games/whack a mole/script.js b/Games/whack a mole/script.js new file mode 100644 index 0000000000..dff1080a87 --- /dev/null +++ b/Games/whack a mole/script.js @@ -0,0 +1,47 @@ +let score = 0; +let timeLeft = 30; +let timerId; +let moleTimerId; +const scoreDisplay = document.getElementById('score'); +const timerDisplay = document.getElementById('timer'); +const holes = document.querySelectorAll('.hole'); + +function randomHole() { + const index = Math.floor(Math.random() * holes.length); + return holes[index]; +} + +function showMole() { + const hole = randomHole(); + const mole = document.createElement('div'); + mole.classList.add('mole'); + hole.appendChild(mole); + + mole.addEventListener('click', () => { + score++; + scoreDisplay.textContent = `Score: ${score}`; + hole.removeChild(mole); + }); + + setTimeout(() => { + if (hole.contains(mole)) { + hole.removeChild(mole); + } + }, 1000); +} + +function startGame() { + timerId = setInterval(() => { + timeLeft--; + timerDisplay.textContent = `Time: ${timeLeft}`; + if (timeLeft === 0) { + clearInterval(timerId); + clearInterval(moleTimerId); + alert(`Game Over! Your score is ${score}`); + } + }, 1000); + + moleTimerId = setInterval(showMole, 800); +} + +startGame(); diff --git a/Games/whack a mole/styles.css b/Games/whack a mole/styles.css new file mode 100644 index 0000000000..c7ced20014 --- /dev/null +++ b/Games/whack a mole/styles.css @@ -0,0 +1,47 @@ +body { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + height: 100vh; + margin: 0; + background-color: #f0f0f0; + font-family: Arial, sans-serif; +} + +#game-container { + display: grid; + grid-template-columns: repeat(3, 100px); + grid-template-rows: repeat(3, 100px); + gap: 10px; + margin-bottom: 20px; +} + +.hole { + width: 100px; + height: 100px; + background-color: #8B4513; + position: relative; + cursor: pointer; +} + +.mole { + width: 60px; + height: 60px; + background-color: #000; + border-radius: 50%; + position: absolute; + top: 20px; + left: 20px; +} + +#scoreboard { + display: flex; + justify-content: space-between; + width: 300px; + font-size: 24px; +} + +#score, #timer { + margin: 0; +} diff --git a/README.md b/README.md index 3e2dbcf63e..d8311213ff 100644 --- a/README.md +++ b/README.md @@ -750,6 +750,11 @@ This repository also provides one such platforms where contributers come over an | [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)| +|[AquaSort_Game](https://github.com/kunjgit/GameZone/tree/main/Games/AquaSort_Game) | +| [Snake](https://github.com/kunjgit/GameZone/tree/main/Games/snake)                | +| [whack a mole](https://github.com/kunjgit/GameZone/tree/main/Games/whack%20a%20mole) | +|[AquaSort_Game](https://github.com/kunjgit/GameZone/tree/main/Games/AquaSort_Game) | +| [Snake](https://github.com/kunjgit/GameZone/tree/main/Games/snake)                | | [Dice_Game] (https://github.com/shivan2004/GameZone/tree/main/Games/Dice_Game)| |[HitOrMiss](https://github.com/kunjgit/GameZone/tree/main/Games/HitOrMiss)| |[Lunar Lander](https://github.com/kunjgit/GameZone/tree/main/Games/Lunar_Lander)| @@ -803,7 +808,9 @@ This repository also provides one such platforms where contributers come over an | [Go-fish-master](https://github.com/kunjgit/GameZone/tree/main/Games/Go-fish-master) | |[Pottery-Game](https://github.com/kunjgit/GameZone/tree/main/Games/Pottery-Game)| | [Ganesh QR Maker](https://github.com/kunjgit/GameZone/tree/main/Games/Ganesh_QR_Maker) | + | [Ganesh_QR_Maker](https://github.com/kunjgit/GameZone/tree/main/Games/Ganesh_QR_Maker) | + |[Wheel_of_Fortunes](https://github.com/Saipradyumnagoud/GameZone/tree/main/Games/Wheel_of_Fortunes)| |[Tic-tac-toe](https://github.com/Saipradyumnagoud/GameZone/tree/main/Games/Tic-tac-toe)| |[Quest_For_Riches](https://github.com/kunjgit/GameZone/tree/main/Games/Quest_For_Riches)| diff --git a/assets/images/whack a mole.png b/assets/images/whack a mole.png new file mode 100644 index 0000000000..eac5dc4bc4 Binary files /dev/null and b/assets/images/whack a mole.png differ diff --git a/assets/whack a mole.png b/assets/whack a mole.png new file mode 100644 index 0000000000..eac5dc4bc4 Binary files /dev/null and b/assets/whack a mole.png differ