Merge branch 'main' into add/jigsaw-puzzle

kunjgit · Jul 6, 2024 · 51bd3aa · 51bd3aa
2 parents ae82d34 + 7b9d7f2
commit 51bd3aa
Show file tree

Hide file tree

Showing 33 changed files with 1,043 additions and 2 deletions.
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+    "liveServer.settings.port": 5501
+}
diff --git a/Games/MathematicsEscapeRoom/MathematicsEscapeRoom.mp4 b/Games/MathematicsEscapeRoom/MathematicsEscapeRoom.mp4
diff --git a/Games/MathematicsEscapeRoom/README.md b/Games/MathematicsEscapeRoom/README.md
@@ -0,0 +1,44 @@
+# Mathematics Escape Room Game
+
+Welcome to the Mathematics Escape Room game! Test your math skills and solve puzzles to escape from each room. Each room presents a new mathematical challenge that you must solve to progress to the next room. Are you ready for the challenge?
+
+## Features
+
+- **Interactive Puzzles:** Solve math puzzles to find the key and progress to the next room.
+- **Engaging Gameplay:** Each room presents a unique mathematical challenge.
+- **Dynamic Interface:** Enjoy a visually appealing interface with an animated background and interactive elements.
+
+## How to Play
+
+### Starting the Game
+
+1. Open `index.html` in your web browser.
+
+### Game Interface
+
+- You will see the game title and the current room description.
+- Enter your answer in the input box provided.
+- Click the "Check Answer" button or press Enter to submit your answer.
+
+### Solving Puzzles
+
+- Each room presents a math puzzle.
+- Enter the correct answer to unlock the next room.
+- If the answer is correct, you will proceed to the next room. If not, try again!
+
+### Game Completion
+
+- Successfully escape from all rooms to complete the game.
+- A congratulatory message will appear when you finish all rooms.
+
+## Screenshots
+
+<br>
+![image](../../assets/images/MathematicsEscapeRoom.png)
+<br>
+
+## Technologies Used
+
+- HTML5
+- CSS3
+- JavaScript
diff --git a/Games/MathematicsEscapeRoom/index.html b/Games/MathematicsEscapeRoom/index.html
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Mathematics Escape Room</title>
+  <link rel="stylesheet" href="style.css">
+  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
+</head>
+<body>
+   <div class="home_btn">
+        <a href="https://kunjgit.github.io/GameZone/">
+          <i style="color:white;" class="fas fa-home home-icon"></i>
+        </a>
+  </div>
+  <div class="container">
+    <h1 class="game-title">Mathematics Escape Room</h1>
+    <div id="room" class="room">
+      <p class="room-description">You are in Room 1. Solve the puzzle to find the key to Room 2!</p>
+      <input type="text" id="answer" class="answer-input" placeholder="Enter your answer">
+      <button id="check-btn" class="check-btn">Check Answer</button>
+      <p id="message" class="message"></p>
+    </div>
+  </div>
+  <div id="video-container">
+    <video autoplay loop muted>
+      <source src="MathematicsEscapeRoom.mp4" type="video/mp4">
+      Your browser does not support the video tag.
+    </video>
+  </div>
+<script src="script.js"></script>
+</body>
+</html>
diff --git a/Games/MathematicsEscapeRoom/script.js b/Games/MathematicsEscapeRoom/script.js
@@ -0,0 +1,71 @@
+const roomDescription = document.querySelector('.room-description');
+const answerInput = document.getElementById('answer');
+const checkBtn = document.getElementById('check-btn');
+const message = document.getElementById('message');
+
+// Define puzzles and answers for each room
+const puzzles = [
+  { room: 1, question: 'What is 2 + 2?', answer: '4' },
+  { room: 2, question: 'What is 5 * 3?', answer: '15' },
+  { room: 3, question: 'What is 8 - 3?', answer: '5' },
+  { room: 4, question: 'What is 10 / 2?', answer: '5' },
+  { room: 5, question: 'What is 4 * 6?', answer: '24' },
+  { room: 6, question: 'What is 12 + 7?', answer: '19' },
+  { room: 7, question: 'What is 15 - 9?', answer: '6' },
+  { room: 8, question: 'What is 18 / 3?', answer: '6' },
+  { room: 9, question: 'What is 9 * 9?', answer: '81' },
+  { room: 10, question: 'What is 25 - 12?', answer: '13' },
+  { room: 11, question: 'What is 30 / 5?', answer: '6' },
+  { room: 12, question: 'What is 11 * 4?', answer: '44' },
+  { room: 13, question: 'What is 45 - 27?', answer: '18' },
+  { room: 14, question: 'What is 64 / 8?', answer: '8' },
+  { room: 15, question: 'What is 16 * 3?', answer: '48' },
+  { room: 16, question: 'What is 72 + 18?', answer: '90' },
+  { room: 17, question: 'What is 100 - 85?', answer: '15' },
+  { room: 18, question: 'What is 144 / 12?', answer: '12' },
+  { room: 19, question: 'What is 25 * 5?', answer: '125' },
+  { room: 20, question: 'What is 99 - 64?', answer: '35' },
+];
+
+let currentRoom = 0;
+
+function displayRoom() {
+  const currentPuzzle = puzzles[currentRoom];
+  roomDescription.textContent = `You are in Room ${currentPuzzle.room}. ${currentPuzzle.question}`;
+  answerInput.value = '';
+  answerInput.focus();
+}
+
+function checkAnswer() {
+  const userAnswer = answerInput.value.trim().toLowerCase();
+  const currentPuzzle = puzzles[currentRoom];
+
+  if (userAnswer === currentPuzzle.answer.toLowerCase()) {
+    message.textContent = 'Correct answer! Moving to the next room...';
+    message.style.color = '#008000'; // Green color for correct answer message
+
+    // Move to the next room
+    currentRoom++;
+    if (currentRoom < puzzles.length) {
+      setTimeout(displayRoom, 1000); // Display next room after 1 second
+    } else {
+      roomDescription.textContent = 'Congratulations! You have escaped from all the rooms!';
+      answerInput.style.display = 'none';
+      checkBtn.style.display = 'none';
+    }
+  } else {
+    message.textContent = 'Oops! Wrong answer. Try again!';
+    message.style.color = '#ff0000'; // Red color for wrong answer message
+  }
+}
+
+checkBtn.addEventListener('click', checkAnswer);
+answerInput.addEventListener('keydown', function(event) {
+  if (event.key === 'Enter') {
+    checkAnswer();
+  }
+});
+
+// Start the game by displaying the first room
+displayRoom();
+
diff --git a/Games/MathematicsEscapeRoom/style.css b/Games/MathematicsEscapeRoom/style.css
@@ -0,0 +1,154 @@
+@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;700&display=swap" rel="stylesheet');
+
+body {
+  font-family: Arial, sans-serif;
+  margin: 0;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 100vh;
+  overflow: hidden; 
+  position: relative; 
+  background-color: #000; /* Fallback color in case video doesn't load */
+}
+
+html, body {
+  margin: 0;
+  padding: 0;
+  height: 100%;
+}
+.home_btn{
+    position: fixed;
+    top: 20px;
+    left: 20px;
+    z-index: 1000;
+}
+.home_btn i {
+    font-size: 2em;
+  }
+.container {
+  text-align: center;
+  width: 100%;
+  height: 100%;
+  z-index: 1;
+}
+
+.game-title {
+  font-family: 'Press Start 2P', sans-serif; 
+  font-size: 2rem;
+  font-weight:bolder;
+  margin:40px 20px;
+  color: #fd04c7;
+  transition: color 0.3s ease, transform 0.5s ease; 
+  animation: bounce 1s infinite alternate;
+}
+
+.game-title:hover {
+  color: #89eef1; 
+  transform: scale(1.1); 
+}
+
+@keyframes bounce {
+  0% {
+    transform: scale(1); 
+  }
+  100% {
+    transform: scale(1.05); 
+  }
+}
+
+.room {
+  background-color: rgba(255, 255, 255, 0.7);
+  padding: 20px;
+  border-radius: 8px;
+  animation: fade-in 0.5s ease;
+  height: 50vh;
+  width:80vh; 
+  display: flex;
+  flex-direction:column;
+  justify-content: center;
+  align-items: center;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
+
+.room-description {
+  font-size: 28px;
+  margin-bottom: 20px;
+  color: #0c0c0c;
+  font-weight: bolder;
+}
+
+.answer-input {
+  margin-bottom: 10px;
+  padding: 8px;
+  width: 500px;
+  box-sizing: border-box;
+  font-size: 16px;
+}
+
+.check-btn {
+  font-family: 'Orbitron', sans-serif;
+  padding: 10px 20px;
+  background-color: #130831; 
+  color: #eeeeee;
+  margin-top: 20px;
+  border: 2px solid #1b1464; 
+  border-radius: 20px; 
+  font-size: 16px; 
+  cursor: pointer;
+  font-weight: bolder;
+  transition: background-color 0.3s ease, color 0.3s ease; 
+  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); 
+}
+
+.check-btn:hover {
+  background-color: #9df0d4;
+  color: #1b1464; 
+  transform: scale(1.05);
+}
+
+.check-btn:active {
+  transform: translateY(2px); 
+}
+
+.message {
+  margin-top: 20px;
+  font-weight: bold;
+  font-size: 14px;
+  color: #ff0000;
+}
+
+@keyframes fade-in {
+  from {
+    opacity: 0;
+    transform: translateY(-10px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
+
+#video-container {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  z-index: -1;
+}
+video {
+  min-width: 100%;
+  min-height: 100%;
+  width: auto;
+  height: auto;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+}
diff --git a/Games/Samurai_Fighting_Game/README.md b/Games/Samurai_Fighting_Game/README.md
@@ -0,0 +1,22 @@
+# Samurai Fighting Game
+
+Samurai fighting games have carved out a unique niche in the gaming world, blending intense combat with rich cultural and historical themes. These games often feature stunning visuals, detailed characters, and engaging storylines that immerse players in the world of the samurai. 
+
+## How to Play
+
+- PLAYER 1 can use the following keys:
+A D and W to move
+spacebar to hit
+
+- PLAYER 2 can use the following keys:
+leftarrow rightarrow and uparrow to move
+downarrow to hit
+
+## Installation
+
+No installation is required. Simply open the `index.html` file in your web browser to start playing the game.
+
+## Usage
+
+1. Clone the repository or download the files.
+2. Open `index.html` in your preferred web browser.
diff --git a/Games/Samurai_Fighting_Game/img/background.png b/Games/Samurai_Fighting_Game/img/background.png
diff --git a/Games/Samurai_Fighting_Game/img/kenji/Attack1.png b/Games/Samurai_Fighting_Game/img/kenji/Attack1.png
diff --git a/Games/Samurai_Fighting_Game/img/kenji/Attack2.png b/Games/Samurai_Fighting_Game/img/kenji/Attack2.png
diff --git a/Games/Samurai_Fighting_Game/img/kenji/Death.png b/Games/Samurai_Fighting_Game/img/kenji/Death.png
diff --git a/Games/Samurai_Fighting_Game/img/kenji/Fall.png b/Games/Samurai_Fighting_Game/img/kenji/Fall.png
diff --git a/Games/Samurai_Fighting_Game/img/kenji/Idle.png b/Games/Samurai_Fighting_Game/img/kenji/Idle.png
diff --git a/Games/Samurai_Fighting_Game/img/kenji/Jump.png b/Games/Samurai_Fighting_Game/img/kenji/Jump.png
diff --git a/Games/Samurai_Fighting_Game/img/kenji/Run.png b/Games/Samurai_Fighting_Game/img/kenji/Run.png
diff --git a/Games/Samurai_Fighting_Game/img/kenji/Take hit.png b/Games/Samurai_Fighting_Game/img/kenji/Take hit.png
diff --git a/Games/Samurai_Fighting_Game/img/samuraiMack/Attack1.png b/Games/Samurai_Fighting_Game/img/samuraiMack/Attack1.png
diff --git a/Games/Samurai_Fighting_Game/img/samuraiMack/Attack2.png b/Games/Samurai_Fighting_Game/img/samuraiMack/Attack2.png
diff --git a/Games/Samurai_Fighting_Game/img/samuraiMack/Death.png b/Games/Samurai_Fighting_Game/img/samuraiMack/Death.png
diff --git a/Games/Samurai_Fighting_Game/img/samuraiMack/Fall.png b/Games/Samurai_Fighting_Game/img/samuraiMack/Fall.png
diff --git a/Games/Samurai_Fighting_Game/img/samuraiMack/Idle.png b/Games/Samurai_Fighting_Game/img/samuraiMack/Idle.png
diff --git a/Games/Samurai_Fighting_Game/img/samuraiMack/Jump.png b/Games/Samurai_Fighting_Game/img/samuraiMack/Jump.png
diff --git a/Games/Samurai_Fighting_Game/img/samuraiMack/Run.png b/Games/Samurai_Fighting_Game/img/samuraiMack/Run.png
diff --git a/Games/Samurai_Fighting_Game/img/samuraiMack/Take Hit - white silhouette.png b/Games/Samurai_Fighting_Game/img/samuraiMack/Take Hit - white silhouette.png
diff --git a/Games/Samurai_Fighting_Game/img/samuraiMack/Take Hit.png b/Games/Samurai_Fighting_Game/img/samuraiMack/Take Hit.png
diff --git a/Games/Samurai_Fighting_Game/img/shop.png b/Games/Samurai_Fighting_Game/img/shop.png