diff --git a/Games/Belt_Black/README.md b/Games/Belt_Black/README.md new file mode 100644 index 0000000000..9871c90a35 --- /dev/null +++ b/Games/Belt_Black/README.md @@ -0,0 +1,32 @@ +# **Belt_Black** + +--- + +
+ +## **Description 📃** +- Belt_Bleck is a fighting game inspired from taken3. + +## **functionalities 🎮** +- Player can move in horizontal directions. +- Player can shoot using bullets & hit with two random moves. +- There will be a lifespan for each player. +
+ +## **How to play? 🕹ī¸** + +- Start the game by clicking on the "Play Now" button. +- Enemy will randomly attack you. +- Use your Left-Arrow or Right-Arrow keys to move. +- Each successful hit on a enemy will reduce enemy's points. +- The game ends when you defeat the enemy or lose. +
+ +## **Screenshots 📸** +
+ +![image](./assets/images/Belt_Black.png) + +
+ +Made with ❤ī¸ by [Anurag Vishwakarma](https://vishanurag.github.io/) \ No newline at end of file diff --git a/Games/Belt_Black/assets/images/Belt_Black.png b/Games/Belt_Black/assets/images/Belt_Black.png new file mode 100644 index 0000000000..ad35cabd17 Binary files /dev/null and b/Games/Belt_Black/assets/images/Belt_Black.png differ diff --git a/Games/Belt_Black/assets/images/background.png b/Games/Belt_Black/assets/images/background.png new file mode 100644 index 0000000000..b16ad89b71 Binary files /dev/null and b/Games/Belt_Black/assets/images/background.png differ diff --git a/Games/Belt_Black/assets/images/logo.png b/Games/Belt_Black/assets/images/logo.png new file mode 100644 index 0000000000..59b7ae6f33 Binary files /dev/null and b/Games/Belt_Black/assets/images/logo.png differ diff --git a/Games/Belt_Black/assets/ninjas-imgs/1/1.gif b/Games/Belt_Black/assets/ninjas-imgs/1/1.gif new file mode 100644 index 0000000000..2f3558febb Binary files /dev/null and b/Games/Belt_Black/assets/ninjas-imgs/1/1.gif differ diff --git a/Games/Belt_Black/assets/ninjas-imgs/1/2.gif b/Games/Belt_Black/assets/ninjas-imgs/1/2.gif new file mode 100644 index 0000000000..572d0d928e Binary files /dev/null and b/Games/Belt_Black/assets/ninjas-imgs/1/2.gif differ diff --git a/Games/Belt_Black/assets/ninjas-imgs/1/3.gif b/Games/Belt_Black/assets/ninjas-imgs/1/3.gif new file mode 100644 index 0000000000..f6d574b474 Binary files /dev/null and b/Games/Belt_Black/assets/ninjas-imgs/1/3.gif differ diff --git a/Games/Belt_Black/assets/ninjas-imgs/1/4.gif b/Games/Belt_Black/assets/ninjas-imgs/1/4.gif new file mode 100644 index 0000000000..b3942d18ad Binary files /dev/null and b/Games/Belt_Black/assets/ninjas-imgs/1/4.gif differ diff --git a/Games/Belt_Black/assets/ninjas-imgs/1/5.gif b/Games/Belt_Black/assets/ninjas-imgs/1/5.gif new file mode 100644 index 0000000000..43dd107768 Binary files /dev/null and b/Games/Belt_Black/assets/ninjas-imgs/1/5.gif differ diff --git a/Games/Belt_Black/assets/ninjas-imgs/1/6.gif b/Games/Belt_Black/assets/ninjas-imgs/1/6.gif new file mode 100644 index 0000000000..325918f92d Binary files /dev/null and b/Games/Belt_Black/assets/ninjas-imgs/1/6.gif differ diff --git a/Games/Belt_Black/assets/ninjas-imgs/1/tmp.gif b/Games/Belt_Black/assets/ninjas-imgs/1/tmp.gif new file mode 100644 index 0000000000..43dd107768 Binary files /dev/null and b/Games/Belt_Black/assets/ninjas-imgs/1/tmp.gif differ diff --git a/Games/Belt_Black/assets/ninjas-imgs/2/1.gif b/Games/Belt_Black/assets/ninjas-imgs/2/1.gif new file mode 100644 index 0000000000..823433c4b4 Binary files /dev/null and b/Games/Belt_Black/assets/ninjas-imgs/2/1.gif differ diff --git a/Games/Belt_Black/assets/ninjas-imgs/2/2.gif b/Games/Belt_Black/assets/ninjas-imgs/2/2.gif new file mode 100644 index 0000000000..8fe227b981 Binary files /dev/null and b/Games/Belt_Black/assets/ninjas-imgs/2/2.gif differ diff --git a/Games/Belt_Black/assets/ninjas-imgs/2/3.gif b/Games/Belt_Black/assets/ninjas-imgs/2/3.gif new file mode 100644 index 0000000000..44ef05be68 Binary files /dev/null and b/Games/Belt_Black/assets/ninjas-imgs/2/3.gif differ diff --git a/Games/Belt_Black/assets/ninjas-imgs/2/4.gif b/Games/Belt_Black/assets/ninjas-imgs/2/4.gif new file mode 100644 index 0000000000..d4f4a58988 Binary files /dev/null and b/Games/Belt_Black/assets/ninjas-imgs/2/4.gif differ diff --git a/Games/Belt_Black/assets/ninjas-imgs/2/tmp1.gif b/Games/Belt_Black/assets/ninjas-imgs/2/tmp1.gif new file mode 100644 index 0000000000..df52c99172 Binary files /dev/null and b/Games/Belt_Black/assets/ninjas-imgs/2/tmp1.gif differ diff --git a/Games/Belt_Black/assets/sound/fight.mp3 b/Games/Belt_Black/assets/sound/fight.mp3 new file mode 100644 index 0000000000..d1c92c5972 Binary files /dev/null and b/Games/Belt_Black/assets/sound/fight.mp3 differ diff --git a/Games/Belt_Black/game.html b/Games/Belt_Black/game.html new file mode 100644 index 0000000000..fb1140564b --- /dev/null +++ b/Games/Belt_Black/game.html @@ -0,0 +1,44 @@ + + + + + + Belt-Black + + + + + +
+

+ Oops! Your device doesn't supports this game. +

+
+ +
+

+ Play Again +

Made with ❤ī¸ byAnurag Vishwakarma

+
+ + +
+ +
+
+ + + + + +
+ + + + + + + \ No newline at end of file diff --git a/Games/Belt_Black/index.html b/Games/Belt_Black/index.html new file mode 100644 index 0000000000..5dd898c7d1 --- /dev/null +++ b/Games/Belt_Black/index.html @@ -0,0 +1,43 @@ + + + + + + Belt-Black + + + + + + +
+

+ Oops! Your device doesn't supports this game. +

+
+ +
+

Belt-Black by Anurag VishwakarmaBelt-Black

+ Play Now +

Made with ❤ī¸ byAnurag Vishwakarma

+
+ + + + + + \ No newline at end of file diff --git a/Games/Belt_Black/script.js b/Games/Belt_Black/script.js new file mode 100644 index 0000000000..ddc5005c88 --- /dev/null +++ b/Games/Belt_Black/script.js @@ -0,0 +1,221 @@ +const CLIENT_WIDTH = document.documentElement.clientWidth; +const CLIENT_HEIGHT = document.documentElement.clientHeight; + +// const fight = new Audio('./assets/sound/fight.mp3'); +// fight.play(); + + +const enemy = document.getElementById('enemy'); +const player = document.getElementById('player'); +const popup = document.getElementById('popup'); +const popupStatus = document.getElementById('popup-status'); +const specialMove = 30; +let playerLife = document.querySelector('#playerLife'); +let enemyLife = document.querySelector('#enemyLife'); + +// const audio = new Audio('./assets/sound/fight.mp3'); +// audio.play(); + +let isGameOver = false; + +let playerLifeVal = 100; +let enemyLifeVal = 100; + +let currPos = 0; +let i = 0; + +const gameOverOverlay = (playerNo)=> { + if(playerNo) { + popupStatus.innerText = 'You Win'; + } else{ + popupStatus.innerText = 'You Lost'; + + } + popup.classList.remove('d-none') +} + +const enemyMoves = [ + { img: 1, width: 300, height: 500, mirror: true}, + { img: 2, width: 550, height: 600, mirror: false}, + { img: 3, width: 600, height: 600, mirror: false}, + { img: 4, width: 500, height: 600, mirror: false}, +]; +const playerMoves = [ + { img: 1, width: 300, height: 500, mirror: false}, + { img: 2, width: 300, height: 500, mirror: false}, + { img: 3, width: 300, height: 500, mirror: false}, + { img: 4, width: 300, height: 600, mirror: false}, + { img: 5, width: 800, height: 600, mirror: false}, + { img: 6, width: 500, height: 600, mirror: false}, +]; + +const changeEnemyMove = (move)=> { + if(!enemyMoves[move%enemyMoves.length].mirror) { + enemy.style.webkitTransform = 'scaleX(0)'; + enemy.style.transform = 'scaleX(1)'; + // console.log(enemy.style.transform) + } else { + enemy.style.webkitTransform = 'scaleX(-1)'; + enemy.style.transform = 'scaleX(-1)'; + } + enemy.src = `./assets/ninjas-imgs/2/${enemyMoves[move%enemyMoves.length].img}.gif`; + enemy.style.width = `${enemyMoves[move%enemyMoves.length].width}px`; + enemy.style.height = `${enemyMoves[move%enemyMoves.length].height}px`; +} + +const chengePlayerImg = (img)=> { + // console.log(img) + player.src = `./assets/ninjas-imgs/1/${playerMoves[img%playerMoves.length].img}.gif`; + player.style.width = `${playerMoves[img%playerMoves.length].width}px`; + player.style.height = `${playerMoves[img%playerMoves.length].height}px`; +} + +const changeEnemyScore = (val)=> { + + if ((currPos >= CLIENT_WIDTH-500 || currPos < CLIENT_WIDTH-800) && val < specialMove) { + // console.log(player.style.left) + return; + } + + enemyLifeVal = (+enemyLifeVal - val > 0)? (+enemyLifeVal - val): 0; + + // console.log(enemyLifeVal) + if(+enemyLifeVal == 0) { + enemyLife.style.setProperty('--width', '0%'); + isGameOver = true; + gameOverOverlay(1); + } else { + enemyLife.style.setProperty('--width', `${enemyLifeVal}%`); + } +} +const changePlayerScore = (val)=> { + + if ((currPos >= CLIENT_WIDTH-500 || currPos < CLIENT_WIDTH-800) && val < specialMove) { + console.log(player.style.left) + return; + } + + playerLifeVal = (+playerLifeVal - val > 0)? (+playerLifeVal - val): 0; + + console.log(playerLifeVal) + if(+playerLifeVal == 0) { + playerLife.style.setProperty('--width', '0%'); + isGameOver = true; + gameOverOverlay(0); + } else { + playerLife.style.setProperty('--width', `${playerLifeVal}%`); + } +} + +const getPlayerMove=()=> { + let x = Math.floor(Math.random()*100); + return (x%2)? 1: 5; +} +const getEnemyMove=()=> { + let x = Math.floor(Math.random()*100); + return (x%2)? 3: 2; +} + +const changePlayerMove = (key)=> { + console.log(key) + if(key == 'ArrowRight' || key == 'keyD') { + player.style.webkitTransform = 'scaleX(1)'; + player.style.transform = 'scaleX(1)'; + currPos += 50; + } else if(key == 'ArrowLeft' || key == 'keyA') { + player.style.webkitTransform = 'scaleX(-1)'; + player.style.transform = 'scaleX(-1)'; + currPos -= 50; + } else if(key == 'Space') { + chengePlayerImg(3); + setTimeout(()=> { + chengePlayerImg(4); + }, 500); + setTimeout(()=> { + chengePlayerImg(2); + changeEnemyScore(specialMove); + }, 1500); + + } else if(key == 'Enter') { + // chengePlayerImg(Math.floor(Math.random()*100)); + chengePlayerImg(getPlayerMove()); + setTimeout(()=> { + chengePlayerImg(2); + changeEnemyScore(10); + }, 1500); + } + + + if(currPos < CLIENT_WIDTH-500 && currPos >= 0) { + player.style.left = `${currPos}px`; + } else if(currPos < 0){ + currPos = 0; + } else if(currPos > CLIENT_WIDTH-500){ + currPos = CLIENT_WIDTH-500; + } + // enemy.src = `./assets/ninjas-imgs/2/${enemyMoves[move%enemyMoves.length].img}.gif`; + // enemy.style.width = `${enemyMoves[move%enemyMoves.length].width}px`; + // enemy.style.height = `${enemyMoves[move%enemyMoves.length].height}px`; +} + +setInterval(()=> { + // changeEnemyMove(i++); +}, 2000); + +setTimeout(()=> { + chengePlayerImg(2); +}, 1500); + +let enemyRestTime = 0; + +const autoEnemyMoves = ()=>{ + + if(enemyLifeVal == 0) { + changeEnemyMove(1); + return; + } + + if ((currPos < CLIENT_WIDTH-450 && currPos >= CLIENT_WIDTH-800)) { + + // console.log("Attack"); + if(enemyRestTime%100 == 0) { + changeEnemyMove(getEnemyMove()); + changePlayerScore(20); + enemyRestTime++; + } + enemyRestTime++; + } else { + // console.log("No Attk"); + if(enemy.src != `${currPath}assets/ninjas-imgs/2/1.gif`) { + // changeEnemyMove(3); + changeEnemyMove(0); + enemyRestTime++; + } + } + + requestAnimationFrame(autoEnemyMoves); +}; + +requestAnimationFrame(autoEnemyMoves); + +const scripts = document.getElementsByTagName("script"), +src = scripts[0].src; +const currPath = src.slice(0, 22); +console.log(currPath) + +const body = document.getElementById('body'); + +body.addEventListener('keydown', (e)=> { + if(!isGameOver) { + changePlayerMove(e.code); + } +}) + +// body.addEventListener('DOMContentLoaded', (e)=> { +// console.log("fdg") +// }) +// const startFight = async()=> { +// + +// } +// startFight(); \ No newline at end of file diff --git a/Games/Belt_Black/style.css b/Games/Belt_Black/style.css new file mode 100644 index 0000000000..498ed2db91 --- /dev/null +++ b/Games/Belt_Black/style.css @@ -0,0 +1,57 @@ + +body { + background-image: url('./assets/images/background.png'); + background-size: cover; + background-position-y: bottom; + background-position-x: center; +} +body, body .container { + width: 100vw !important; + height: 100vh !important; +} +.players { + width: 300px; +} +#player { + bottom: 10%; + left: 0px; +} +#enemy { + bottom: 10%; + right: 50px; + -webkit-transform: scaleX(-1); + transform: scaleX(-1); +} + +#playerLife { + top: 10px; + left: 0; + --width: 100%; +} +#enemyLife { + top: 10px; + right: 0; + --width: 100%; +} +.players-life { + width: 200px; +} +.players-life::after { + content: ""; + display: block; + background-color: greenyellow; + height: 10px; + width: var(--width); + border-radius: 4px; + transition: all 0.5s linear !important; +} + +#popup { + display: flex; + z-index: 2 !important; + width: 500px; + height: 300px; + left: 50%; + transform: translate(-50%, 60%); + max-width: 100vw !important; +} \ No newline at end of file diff --git a/README.md b/README.md index a08df7777a..c4ac0ac6ec 100644 --- a/README.md +++ b/README.md @@ -140,7 +140,7 @@ This repository also provides one such platforms where contributers come over an | [The Last Spartan](https://github.com/kunjgit/GameZone/tree/main/Games/The_Last_Spartan) | [Space Exploration](https://github.com/kunjgit/GameZone/tree/main/Games/Space_Exploration) | [Bow Arrow Game](https://github.com/kunjgit/GameZone/tree/main/Games/Bow_Arrow) | [I Want To Google The Game](https://github.com/kunjgit/GameZone/tree/main/Games/I_Want_To_Google_The_Game) | [Space Gun](https://github.com/kunjgit/GameZone/tree/main/Games/Space_Gun) | | [Space Huggers](https://github.com/kunjgit/GameZone/tree/main/Games/Space_Huggers) | [Spaceship Escort](https://github.com/kunjgit/GameZone/tree/main/Games/Spaceship_Escort) | [Space Defence](https://github.com/kunjgit/GameZone/tree/main/Games/Space_Defence) | [Glitch Buster](https://github.com/kunjgit/GameZone/tree/main/Games/Glitch_Buster) | [3D Box Game](https://github.com/kunjgit/GameZone/tree/main/Games/3d_Box_Game) | | [Escape](https://github.com/kunjgit/GameZone/tree/main/Games/Escape) | [Retro Dungeon Puzzle](https://github.com/kunjgit/GameZone/tree/main/Games/Retro_Dungeon_Puzzle) | [Immunity Collapse](https://github.com/kunjgit/GameZone/tree/main/Games/Immunity_Collapse) | [Hunt Your Card](https://github.com/kunjgit/GameZone/tree/main/Games/Hunt_Your_Card) | [Tenacity](https://github.com/kunjgit/GameZone/tree/main/Games/Tenacity) | -| [Emoji Puzzle Game](https://github.com/kunjgit/GameZone/tree/main/Games/Emoji_Puzzle_Game) | [Back To Space](https://github.com/kunjgit/GameZone/tree/main/Games/Back_To_Space) | [Snooze](https://github.com/kunjgit/GameZone/tree/main/Games/Snooze) | [Galaxy Rider](https://github.com/kunjgit/GameZone/tree/main/Games/Galaxy_Rider) | [Squared Lines](https://github.com/kunjgit/GameZone/tree/main/Games/Squared_Lines) | +| [Emoji Puzzle Game](https://github.com/kunjgit/GameZone/tree/main/Games/Emoji_Puzzle_Game) | [Back To Space](https://github.com/kunjgit/GameZone/tree/main/Games/Back_To_Space) | [Snooze](https://github.com/kunjgit/GameZone/tree/main/Games/Snooze) | [Galaxy Rider](https://github.com/kunjgit/GameZone/tree/main/Games/Galaxy_Rider) | [Belt_Black](https://github.com/kunjgit/GameZone/tree/main/Games/Belt_Black) | [Squared Lines](https://github.com/kunjgit/GameZone/tree/main/Games/Squared_Lines) | | [Space War](https://github.com/kunjgit/GameZone/tree/main/Games/Space_War) | [Sciara of Colors](https://github.com/kunjgit/GameZone/tree/main/Games/Sciara_Of_Colors) | [JunoJs](https://github.com/kunjgit/GameZone/tree/main/Games/JunoJs) | [Fall Down](https://github.com/kunjgit/GameZone/tree/main/Games/Fall_Down) | [Cat Goric](https://github.com/kunjgit/GameZone/tree/main/Games/Cat_Goric) | | [Cable Maze](https://github.com/kunjgit/GameZone/tree/main/Games/Cable_Maze) | [Spaceducts](https://github.com/kunjgit/GameZone/tree/main/Games/Spaceducts) | [Zurbo](https://github.com/kunjgit/GameZone/tree/main/Games/Zurbo) | [Blast Zone](https://github.com/kunjgit/GameZone/tree/main/Games/BlastZone) | [Free Bird](https://github.com/kunjgit/GameZone/tree/main/Games/Free_Bird) | | [Maximise Boxes](https://github.com/kunjgit/GameZone/tree/main/Games/MaximiseBoxes) | [Slide Puzzle](https://github.com/kunjgit/GameZone/tree/main/Games/Slide_Puzzle) | [Diamond Run](https://github.com/kunjgit/GameZone/tree/main/Games/Diamond_Run) | [Everyones Sky](https://github.com/kunjgit/GameZone/tree/main/Games/Everyones_Sky) | [Line Of Fire](https://github.com/kunjgit/GameZone/tree/main/Games/Line_Of_Fire) | diff --git a/assets/images/Belt_Black.png b/assets/images/Belt_Black.png new file mode 100644 index 0000000000..ad35cabd17 Binary files /dev/null and b/assets/images/Belt_Black.png differ