diff --git a/Games/Catch Him/README.md b/Games/Catch Him/README.md new file mode 100644 index 0000000000..e835bf56ee --- /dev/null +++ b/Games/Catch Him/README.md @@ -0,0 +1,18 @@ +## Catch him +"Catch Him" is a fun and engaging game that involves quick reflexes and strategic thinking. The main objective of the game is to catch a character named Ralph, who moves swiftly across the screen. Players must click or tap on Ralph as he appears in different locations, often disappearing and reappearing quickly to increase the challenge. The game typically includes various levels of difficulty, with Ralph moving faster and more unpredictably as players advance. It's a great game for testing hand-eye coordination and speed, providing an entertaining and competitive experience for players of all ages. + +## How to play ?: + +1. **Objective**: Your goal is to catch Ralph by clicking or tapping on him whenever he appears on the screen. + +2. **Gameplay**: + - Ralph will move around the screen and may disappear and reappear in different locations. + - Use your mouse (if on a computer) tap to catch Ralph. + - Each time you successfully catch Ralph, you earn points. + +3. **Time Limit**: The game may have a time limit . Try to catch Ralph as many times as possible before time runs out. + +4. **Score**: Your score is based on how many times you catch Ralph. Aim for a high score and challenge yourself to improve with each playthrough. + +## Screenshot + \ No newline at end of file diff --git a/Games/Catch Him/audios/hit.m4a b/Games/Catch Him/audios/hit.m4a new file mode 100644 index 0000000000..d747823dd2 Binary files /dev/null and b/Games/Catch Him/audios/hit.m4a differ diff --git a/Games/Catch Him/images/Catch_him.png b/Games/Catch Him/images/Catch_him.png new file mode 100644 index 0000000000..d0d25ec8f4 Binary files /dev/null and b/Games/Catch Him/images/Catch_him.png differ diff --git a/Games/Catch Him/images/favicon.jpg b/Games/Catch Him/images/favicon.jpg new file mode 100644 index 0000000000..8c5153aafc Binary files /dev/null and b/Games/Catch Him/images/favicon.jpg differ diff --git a/Games/Catch Him/images/player.png b/Games/Catch Him/images/player.png new file mode 100644 index 0000000000..3d320717ff Binary files /dev/null and b/Games/Catch Him/images/player.png differ diff --git a/Games/Catch Him/images/ralph.png b/Games/Catch Him/images/ralph.png new file mode 100644 index 0000000000..e8e5b9dd5b Binary files /dev/null and b/Games/Catch Him/images/ralph.png differ diff --git a/Games/Catch Him/images/wall.png b/Games/Catch Him/images/wall.png new file mode 100644 index 0000000000..7e4216a480 Binary files /dev/null and b/Games/Catch Him/images/wall.png differ diff --git a/Games/Catch Him/index.html b/Games/Catch Him/index.html new file mode 100644 index 0000000000..31f90f2703 --- /dev/null +++ b/Games/Catch Him/index.html @@ -0,0 +1,63 @@ + + + + + + + + + Ctch Ralph + + + + + + + + + + + + + +
+ + +
+
+
+
+
+
+ +
+
+
+
+
+ +
+
+
+
+
+
+
+ + + + + \ No newline at end of file diff --git a/Games/Catch Him/scripts/engine.js b/Games/Catch Him/scripts/engine.js new file mode 100644 index 0000000000..c5622f0995 --- /dev/null +++ b/Games/Catch Him/scripts/engine.js @@ -0,0 +1,65 @@ +const state = { + view: { + squares: document.querySelectorAll(".square"), + enemy: document.querySelector(".enemy"), + timeLeft: document.querySelector("#time-left"), + score: document.querySelector("#score"), + }, + values: { + gameVelocity: 1000, + hitPosition: 0, + result: 0, + curretTime: 60, + }, + actions: { + timerId: setInterval(randomSquare, 1000), + countDownTimerId: setInterval(countDown, 1000), + }, +}; + +function countDown() { + state.values.curretTime--; + state.view.timeLeft.textContent = state.values.curretTime; + + if (state.values.curretTime <= 0) { + clearInterval(state.actions.countDownTimerId); + clearInterval(state.actions.timerId); + alert("Game Over! O seu resultado foi: " + state.values.result); + } +} + +function playSound(audioName) { + let audio = new Audio(`./src/audios/${audioName}.m4a`); + audio.volume = 0.2; + audio.play(); +} + +function randomSquare() { + state.view.squares.forEach((square) => { + square.classList.remove("enemy"); + }); + + let randomNumber = Math.floor(Math.random() * 9); + let randomSquare = state.view.squares[randomNumber]; + randomSquare.classList.add("enemy"); + state.values.hitPosition = randomSquare.id; +} + +function addListenerHitBox() { + state.view.squares.forEach((square) => { + square.addEventListener("mousedown", () => { + if (square.id === state.values.hitPosition) { + state.values.result++; + state.view.score.textContent = state.values.result; + state.values.hitPosition = null; + playSound("hit"); + } + }); + }); +} + +function initialize() { + addListenerHitBox(); +} + +initialize(); diff --git a/Games/Catch Him/styles/main.css b/Games/Catch Him/styles/main.css new file mode 100644 index 0000000000..ca1e684fd5 --- /dev/null +++ b/Games/Catch Him/styles/main.css @@ -0,0 +1,48 @@ +.container { + display: flex; + flex-direction: column; + height: 100vh; + background-image: url("../images/wall.png"); +} + +.menu { + display: flex; + justify-content: space-evenly; + align-items: center; + + height: 90px; + width: 100%; + background-color: #000000; + color: #ffffff; + border-bottom: 5px solid #ffd700; +} + +.panel { + margin-top: 1rem; + display: flex; + align-items: center; + justify-content: center; +} + +.square { + height: 150px; + width: 150px; + border: 1px solid #000000; + background-color: #1aeaa5; +} + +.enemy { + background-image: url("../images/ralph.png"); + background-size: cover; +} + +.menu-lives { + display: flex; + align-items: center; + justify-content: center; +} + +.menu-time h2:nth-child(2), +.menu-score h2:nth-child(2) { + margin-top: 1rem; +} \ No newline at end of file diff --git a/Games/Catch Him/styles/reset.css b/Games/Catch Him/styles/reset.css new file mode 100644 index 0000000000..47b93fe8e4 --- /dev/null +++ b/Games/Catch Him/styles/reset.css @@ -0,0 +1,7 @@ +* { + margin: 0; + padding: 0; + box-sizing: border-box; + /* font-family: "Bebas Neue", sans-serif; */ + font-family: "Press Start 2P", cursive; +} diff --git a/README.md b/README.md index 5e09bc80cd..0781e61068 100644 --- a/README.md +++ b/README.md @@ -376,10 +376,9 @@ This repository also provides one such platforms where contributers come over an | [IKnowYou-Mind-Reading-Game](https://github.com/kunjgit/GameZone/tree/main/Games/IKnowYou-Mind-Reading-Game) | |[Rock_Paper_Scissors_Neon](https://github.com/kunjgit/GameZone/tree/main/Games/Rock_Paper_Scissors_Neon)| |[Beat_a_mole](https://github.com/kunjgit/GameZone/tree/main/Games/Beat_a_mole)| +|[Catch Him](https://github.com/kunjgit/GameZone/tree/main/Games/Catch_him) | |[Hexsweep_Game](https://github.com/kunjgit/GameZone/tree/main/Games/Hexsweep-Game)| - -
diff --git a/assets/images/Catch_him.png b/assets/images/Catch_him.png new file mode 100644 index 0000000000..d0d25ec8f4 Binary files /dev/null and b/assets/images/Catch_him.png differ diff --git a/assets/images/Catch_him.webp b/assets/images/Catch_him.webp new file mode 100644 index 0000000000..6348a3cb15 Binary files /dev/null and b/assets/images/Catch_him.webp differ