From 330030e87289e10d98a4f1c27c7f2bea2c151e8c Mon Sep 17 00:00:00 2001 From: 1911aditi <146438609+1911aditi@users.noreply.github.com> Date: Mon, 15 Jul 2024 21:25:24 +0530 Subject: [PATCH 1/3] Add files via upload --- Games/Shape Shifter/README.md | 49 +++++++++++++++++++++++++++ Games/Shape Shifter/index.html | 17 ++++++++++ Games/Shape Shifter/script.js | 60 ++++++++++++++++++++++++++++++++++ Games/Shape Shifter/styles.css | 34 +++++++++++++++++++ 4 files changed, 160 insertions(+) create mode 100644 Games/Shape Shifter/README.md create mode 100644 Games/Shape Shifter/index.html create mode 100644 Games/Shape Shifter/script.js create mode 100644 Games/Shape Shifter/styles.css diff --git a/Games/Shape Shifter/README.md b/Games/Shape Shifter/README.md new file mode 100644 index 0000000000..6e1e759ff4 --- /dev/null +++ b/Games/Shape Shifter/README.md @@ -0,0 +1,49 @@ +# Shape Shifter Game + +Shape Shifter is an innovative and interactive game where players must click on a randomly appearing shape within a limited time frame. The shape changes in size, color, and position to increase the challenge. + +## Game Features + +- Randomly appearing shapes with varying sizes and colors +- Scoreboard to track your progress +- Simple and intuitive user interface +- Responsive design + +## Technologies Used + +- HTML +- CSS +- JavaScript + +## How to Play + +1. Open the `index.html` file in your web browser. +2. Click the "Start Game" button to begin. +3. Click on the shape as quickly as possible to score points. +4. The shape will move to a new random position every second. +5. The game continues until you stop it or refresh the page. + +## Installation + +To run the game locally, follow these steps: + +1. Clone the repository: + ```bash + git clone https://github.com/your-username/shape-shifter-game.git + ``` +2. Navigate to the project directory: + ```bash + cd shape-shifter-game + ``` +3. Open `index.html` in your web browser: + ```bash + open index.html + ``` + +## Project Structure + +```plaintext +shape-shifter-game/ +├── index.html +├── styles.css +└── script.js diff --git a/Games/Shape Shifter/index.html b/Games/Shape Shifter/index.html new file mode 100644 index 0000000000..7a2c6576cb --- /dev/null +++ b/Games/Shape Shifter/index.html @@ -0,0 +1,17 @@ + + + + + + Shape Shifter + + + +
+
+
Score: 0
+ +
+ + + diff --git a/Games/Shape Shifter/script.js b/Games/Shape Shifter/script.js new file mode 100644 index 0000000000..e9795b62f3 --- /dev/null +++ b/Games/Shape Shifter/script.js @@ -0,0 +1,60 @@ +// script.js + +document.addEventListener('DOMContentLoaded', (event) => { + const targetShape = document.getElementById('target-shape'); + const scoreBoard = document.getElementById('score-board'); + const startButton = document.getElementById('start-button'); + let score = 0; + let gameInterval; + + function getRandomPosition() { + const containerRect = document.body.getBoundingClientRect(); + const x = Math.floor(Math.random() * (containerRect.width - 50)); + const y = Math.floor(Math.random() * (containerRect.height - 50)); + return { x, y }; + } + + function getRandomColor() { + const letters = '0123456789ABCDEF'; + let color = '#'; + for (let i = 0; i < 6; i++) { + color += letters[Math.floor(Math.random() * 16)]; + } + return color; + } + + function getRandomSize() { + return Math.floor(Math.random() * 50) + 30; + } + + function moveShape() { + const { x, y } = getRandomPosition(); + const color = getRandomColor(); + const size = getRandomSize(); + targetShape.style.left = `${x}px`; + targetShape.style.top = `${y}px`; + targetShape.style.backgroundColor = color; + targetShape.style.width = `${size}px`; + targetShape.style.height = `${size}px`; + } + + function startGame() { + score = 0; + scoreBoard.innerText = `Score: ${score}`; + targetShape.style.display = 'block'; + gameInterval = setInterval(moveShape, 1000); + } + + function stopGame() { + clearInterval(gameInterval); + targetShape.style.display = 'none'; + } + + targetShape.addEventListener('click', () => { + score++; + scoreBoard.innerText = `Score: ${score}`; + moveShape(); + }); + + startButton.addEventListener('click', startGame); +}); diff --git a/Games/Shape Shifter/styles.css b/Games/Shape Shifter/styles.css new file mode 100644 index 0000000000..33cb47a9e4 --- /dev/null +++ b/Games/Shape Shifter/styles.css @@ -0,0 +1,34 @@ +/* styles.css */ + +body { + display: flex; + justify-content: center; + align-items: center; + height: 100vh; + background-color: #f0f0f0; + margin: 0; +} + +.game-container { + text-align: center; +} + +.shape { + width: 50px; + height: 50px; + position: absolute; + border-radius: 50%; + background-color: red; + cursor: pointer; +} + +#score-board { + font-size: 24px; + margin-top: 20px; +} + +#start-button { + margin-top: 20px; + padding: 10px 20px; + font-size: 16px; +} From 7c90fc1a79d54c64aa94894ba3d41093d72aa199 Mon Sep 17 00:00:00 2001 From: 1911aditi <146438609+1911aditi@users.noreply.github.com> Date: Mon, 15 Jul 2024 21:27:33 +0530 Subject: [PATCH 2/3] Add files via upload --- assets/images/shape shifter.png | Bin 0 -> 14859 bytes 1 file changed, 0 insertions(+), 0 deletions(-) create mode 100644 assets/images/shape shifter.png diff --git a/assets/images/shape shifter.png b/assets/images/shape shifter.png new file mode 100644 index 0000000000000000000000000000000000000000..98f4c5dd8212cf5b4daea4e7b906e45cc099db9c GIT binary patch literal 14859 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 Imu~;?pBafdUH||9 literal 0 HcmV?d00001 From 1779ab5897c4197cb397f19bcacd80e4d191232c Mon Sep 17 00:00:00 2001 From: 1911aditi <146438609+1911aditi@users.noreply.github.com> Date: Mon, 15 Jul 2024 23:54:12 +0530 Subject: [PATCH 3/3] Update README.md --- README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/README.md b/README.md index fd48417567..e56d0e7544 100644 --- a/README.md +++ b/README.md @@ -360,6 +360,7 @@ This repository also provides one such platforms where contributers come over an | [Dodge_the_Blocks](https://github.com/kunjgit/GameZone/tree/main/Games/Dodge_the_Blocks) | | [Memory_Flip](https://github.com/kunjgit/GameZone/tree/main/Games/Memory_Flip) | +| [Shape_Shifter](https://github.com/kunjgit/GameZone/tree/main/Games/Shape_Shifter) | |[Town-Rise](https://github.com/kunjgit/GameZone/tree/main/Games/Town_Rise_Game)| | [IKnowYou-Mind-Reading-Game](https://github.com/kunjgit/GameZone/tree/main/Games/IKnowYou-Mind-Reading-Game) |