kunjgit · hemant933 · Jan 14, 2024 · Jan 14, 2024
diff --git a/Games/ladoo game/index.html b/Games/ladoo game/index.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Ladoo Catcher Game</title>
+  <link rel="stylesheet" href="style.css">
+</head>
+<body>
+  <div class="game-container">
+    <div class="ladoo-catcher"></div>
+    <div class="ladoo"></div>
+    <div class="non-edible"></div>
+  </div>
+  <div id="score">Score: 0</div>
+  <script src="script.js"></script>
+</body>
+</html>
diff --git a/Games/ladoo game/readme.md b/Games/ladoo game/readme.md
@@ -0,0 +1,40 @@
+# Ladoo Catcher Game
+
+A simple game where the character catches ladoos falling from the sky. Avoid non-edible items like paper or stone to maintain a high score.
+
+## How to Play
+
+- Move the ladoo catcher left or right using the left and right arrow keys.
+- Catch ladoos to earn points (+10 for each ladoo caught).
+- Avoid non-edible items to prevent point deduction (-5 for each non-edible item caught).
+
+## Getting Started
+
+1. Clone or download the repository.
+2. Open `index.html` in your web browser to start the game.
+
+## Gameplay Controls
+
+- **Left Arrow Key:** Move the ladoo catcher to the left.
+- **Right Arrow Key:** Move the ladoo catcher to the right.
+
+## Scoring
+
+- Catching Ladoos: +10 points
+- Catching Non-edible Items: -5 points
+
+## Game Customization
+
+Feel free to customize the game by modifying the code in the following files:
+
+- **index.html:** HTML structure of the game.
+- **style.css:** Styling for the game elements.
+- **script.js:** Game logic and behavior.
+
+## Contributing
+
+If you find any issues or have suggestions for improvements, feel free to open an issue or create a pull request.
+
+## License
+
+This project is licensed under the [MIT License](LICENSE).
diff --git a/Games/ladoo game/script.js b/Games/ladoo game/script.js
@@ -0,0 +1,100 @@
+document.addEventListener('DOMContentLoaded', () => {
+  const ladooCatcher = document.querySelector('.ladoo-catcher');
+  const ladoo = document.querySelector('.ladoo');
+  const nonEdible = document.querySelector('.non-edible');
+  const scoreDisplay = document.getElementById('score');
+
+  let score = 0;
+
+  document.addEventListener('keydown', (event) => {
+    if (event.key === 'ArrowLeft') {
+      moveCatcher(-15); // Increased cursor speed
+    } else if (event.key === 'ArrowRight') {
+      moveCatcher(15); // Increased cursor speed
+    }
+  });
+
+  function moveCatcher(offset) {
+    const currentLeft = parseInt(getComputedStyle(ladooCatcher).left);
+    const newLeft = Math.max(0, Math.min(window.innerWidth - 50, currentLeft + offset));
+    ladooCatcher.style.left = `${newLeft}px`;
+  }
+
+  function dropItem(item) {
+    const initialPosition = Math.random() * (window.innerWidth - 30);
+    item.style.left = `${initialPosition}px`;
+    item.style.top = '0';
+
+    const fallInterval = setInterval(() => {
+      const currentTop = parseInt(getComputedStyle(item).top);
+      const newTop = currentTop + 2; // Slowed down item falling speed
+
+      if (newTop >= window.innerHeight) {
+        clearInterval(fallInterval);
+        item.style.display = 'none';
+
+        // Respawn the item
+        setTimeout(() => {
+          item.style.display = 'block';
+          dropItem(item);
+        }, 2000); // Increased delay before respawning item
+      } else {
+        item.style.top = `${newTop}px`;
+
+        // Check for collision with ladooCatcher
+        checkCollision(item);
+      }
+    }, 20);
+  }
+
+  function checkCollision(item) {
+    const ladooCatcherRect = ladooCatcher.getBoundingClientRect();
+    const itemRect = item.getBoundingClientRect();
+
+    if (
+      itemRect.left < ladooCatcherRect.right &&
+      itemRect.right > ladooCatcherRect.left &&
+      itemRect.bottom > ladooCatcherRect.top &&
+      itemRect.top < ladooCatcherRect.bottom
+    ) {
+      // Collision occurred
+      if (item === ladoo) {
+        // Handle ladoo caught
+        score += 10;
+        displayMessage(`+10! Ladoo caught! Total Score: ${score}`, '#32CD32'); // Green color
+      } else if (item === nonEdible) {
+        // Handle non-edible item caught
+        score -= 5;
+        displayMessage('-5! Non-edible item caught! Total Score: ${score}', '#FF0000'); // Red color
+      }
+
+      // Update score display
+      scoreDisplay.textContent = score;
+
+      // Respawn the item
+      dropItem(item);
+    }
+  }
+
+  function displayMessage(message, color) {
+    const messageElement = document.createElement('div');
+    messageElement.textContent = message;
+    messageElement.style.position = 'absolute';
+    messageElement.style.top = '50%';
+    messageElement.style.left = '50%';
+    messageElement.style.transform = 'translate(-50%, -50%)';
+    messageElement.style.color = color;
+    messageElement.style.fontSize = '24px';
+    messageElement.style.fontWeight = 'bold';
+    document.body.appendChild(messageElement);
+
+    // Remove the message after a short delay
+    setTimeout(() => {
+      document.body.removeChild(messageElement);
+    }, 1000);
+  }
+
+  // Start dropping ladoo and non-edible items
+  dropItem(ladoo);
+  dropItem(nonEdible);
+});
diff --git a/Games/ladoo game/style.css b/Games/ladoo game/style.css
@@ -0,0 +1,47 @@
+body {
+    margin: 0;
+    overflow: hidden;
+  }
+
+  .game-container {
+    position: relative;
+    width: 100%;
+    height: 100vh;
+    background-color: #87CEEB; /* Sky Blue */
+  }
+
+  .ladoo-catcher {
+    position: absolute;
+    bottom: 20px;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 50px;
+    height: 50px;
+    background-color: #FFD700; /* Gold */
+    border-radius: 50%;
+  }
+
+  .ladoo, .non-edible {
+    position: absolute;
+    width: 30px;
+    height: 30px;
+    border-radius: 50%;
+  }
+
+  .ladoo {
+    background-color: #8B4513; /* Saddle Brown */
+  }
+
+  .non-edible {
+    background-color: #808080; /* Gray */
+  }
+
+  #score {
+    position: absolute;
+    top: 10px;
+    right: 10px;
+    color: #FF4500; /* Orange Red */
+    font-size: 30px;
+    font-weight: bold;
+  }
+