-
Notifications
You must be signed in to change notification settings - Fork 839
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #5146 from Ishitamukherjee2004/main
Box In Air Game is added
- Loading branch information
Showing
7 changed files
with
170 additions
and
1 deletion.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,23 @@ | ||
| # **Box_In_Air_Game** | ||
|
|
||
| Bow_In_Arrow Game | ||
|
|
||
| <br> | ||
|
|
||
|
|
||
| ## **functionalities 🎮** | ||
| <!-- add functionalities over here --> | ||
| - Bow_In_Arrow is a game implemented using HTML, CSS, and JavaScript. The game is to shoot monsters and save birds. | ||
| <br> | ||
|
|
||
| ## **How to play? 🕹️** | ||
| <!-- add the steps how to play games --> | ||
| - Start the game | ||
| - Move the man with Arrow Keys | ||
| - Shoot arrow with Space Bar | ||
| - +1 for hitting monsters | ||
| - -5 if monsters reaches birds | ||
| - Game Over if score<0 | ||
| - Monsters speed increases each level. | ||
|
|
||
| <br> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,22 @@ | ||
|
|
||
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <title>Table Tennis Game</title> | ||
| <link rel="stylesheet" href="style.css"> | ||
| </head> | ||
| <body> | ||
| <div class="game-container"> | ||
| <div class="table"> | ||
| <div class="ball"></div> | ||
| <div class="paddle paddle-left"></div> | ||
| <div class="paddle paddle-right"></div> | ||
| </div> | ||
| <div class="scoreboard"> | ||
| <span id="player1-score">0</span> | ||
| <span id="player2-score">0</span> | ||
| </div> | ||
| </div> | ||
| <script src="script.js"></script> | ||
| </body> | ||
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,63 @@ | ||
| let ball = document.querySelector('.ball'); | ||
| let paddleLeft = document.querySelector('.paddle-left'); | ||
| let paddleRight = document.querySelector('.paddle-right'); | ||
| let player1Score = document.querySelector('#player1-score'); | ||
| let player2Score = document.querySelector('#player2-score'); | ||
|
|
||
| let ballSpeedX = 4; | ||
| let ballSpeedY = 4; | ||
| let paddleSpeed = 8; | ||
|
|
||
| function moveBall() { | ||
| ball.style.top = `${parseInt(ball.style.top) + ballSpeedY}px`; | ||
| ball.style.left = `${parseInt(ball.style.left) + ballSpeedX}px`; | ||
|
|
||
| if (parseInt(ball.style.top) <= 0 || parseInt(ball.style.top) >= 580) { | ||
| ballSpeedY *= -1; | ||
| } | ||
|
|
||
| if (parseInt(ball.style.left) <= 0 || parseInt(ball.style.left) >= 780) { | ||
| ballSpeedX *= -1; | ||
| } | ||
| if (parseInt(ball.style.left) <= 20 && parseInt(ball.style.top) >= parseInt(paddleLeft.style.top) && parseInt(ball.style.top) <= parseInt(paddleLeft.style.top) + 100) { | ||
| ballSpeedX *= -1; | ||
| } | ||
|
|
||
| if (parseInt(ball.style.left) >= 760 && parseInt(ball.style.top) >= parseInt(paddleRight.style.top) && parseInt(ball.style.top) <= parseInt(paddleRight.style.top) + 100) { | ||
| ballSpeedX *= -1; | ||
| } | ||
| if (parseInt(ball.style.left) <= 0) { | ||
| player2Score.textContent = parseInt(player2Score.textContent) + 1; | ||
| resetBall(); | ||
| } | ||
|
|
||
| if (parseInt(ball.style.left) >= 780) { | ||
| player1Score.textContent = parseInt(player1Score.textContent) + 1; | ||
| resetBall(); | ||
| } | ||
| } | ||
| function movePaddles(event) { | ||
| if (event.key === 'w') { | ||
| paddleLeft.style.top = `${parseInt(paddleLeft.style.top) - paddleSpeed}px`; | ||
| } | ||
|
|
||
| if (event.key === 's') { | ||
| paddleLeft.style.top = `${parseInt(paddleLeft.style.top) + paddleSpeed}px`; | ||
| } | ||
| if (event.key === 'ArrowUp') { | ||
| paddleRight.style.top = `${parseInt(paddleRight.style.top) - paddleSpeed}px`; | ||
| } | ||
|
|
||
| if (event.key === 'ArrowDown') { | ||
| paddleRight.style.top = `${parseInt(paddleRight.style.top) + paddleSpeed}px`; | ||
| } | ||
| } | ||
| function resetBall() { | ||
| ball.style.top = '50%'; | ||
| ball.style.left = '50%'; | ||
| ballSpeedX = 4; | ||
| ballSpeedY = 4; | ||
| } | ||
|
|
||
| document.addEventListener('keydown', movePaddles); | ||
| setInterval(moveBall, 16); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,48 @@ | ||
| .game-container { | ||
| width: 800px; | ||
| height: 600px; | ||
| margin: 40px auto; | ||
| background-color: #f0f0f0; | ||
| } | ||
|
|
||
| .table { | ||
| width: 100%; | ||
| height: 100%; | ||
| position: relative; | ||
| background-color: #008000; | ||
| } | ||
|
|
||
| .ball { | ||
| width: 20px; | ||
| height: 20px; | ||
| background-color: #fff; | ||
| border-radius: 50%; | ||
| position: absolute; | ||
| top: 50%; | ||
| left: 50%; | ||
| transform: translate(-50%, -50%); | ||
| } | ||
| .paddle { | ||
| width: 10px; | ||
| height: 100px; | ||
| background-color: #fff; | ||
| position: absolute; | ||
| top: 50%; | ||
| transform: translate(0, -50%); | ||
| } | ||
|
|
||
| .paddle-left { | ||
| left: 10px; | ||
| } | ||
|
|
||
| .paddle-right { | ||
| right: 10px; | ||
| } | ||
| .scoreboard { | ||
| position: absolute; | ||
| top: 10px; | ||
| left: 50%; | ||
| transform: translate(-50%, 0); | ||
| font-size: 24px; | ||
| font-weight: bold; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters