amfoss · dilip27m · Dec 8, 2024
diff --git a/3-typing-game/game/index.html b/3-typing-game/game/index.html
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="style.css">
+    <title>Cows and bull game</title>
+
+</head>
+<body>
+    <h1>COws and bulls game</h1>
+    <p>Guess the 4-digit number. Before time completes</p>
+    <div id="timer">Time left: 300 seconds</div>
+    <input type="text" id="guess" maxlength="4" placeholder="Enter your guess" />
+    <button onclick="checkGuess()">Submit Guess</button>
+    <div id="result"></div>
+    <div id="History">
+        <h3>History</h3>
+        <ul id="historyList"></ul>
+    </div>
+
+    <script src="./script.js"></script>
+</body>
+</html>
diff --git a/3-typing-game/game/script.js b/3-typing-game/game/script.js
@@ -0,0 +1,59 @@
+function fourDigitNumber() {
+  let digits = [];
+  while (digits.length < 4) {
+      let randomDigit = Math.floor(Math.random() * 10);
+      if (!digits.includes(randomDigit)) {
+          digits.push(randomDigit);
+      }
+  }
+  return digits.join('');
+}
+
+const code = fourDigitNumber();
+
+let timeLeft = 300;
+
+
+const timer = setInterval(() => {
+  timeLeft--;
+  document.getElementById('timer').innerText = `Time left: ${timeLeft} seconds`;
+
+  if (timeLeft <= 0) {
+      clearInterval(timer);
+      document.getElementById('result').innerHTML = `You lost the game. The number was ${code}`;
+      document.getElementById('guess').disabled = true;
+  }
+}, 1000);
+
+
+function checkGuess() {
+  const guess = document.getElementById('guess').value;
+  if (guess.length !== 4 || isNaN(guess)) {
+      alert("Please enter a valid 4-digit number.");
+      return;
+  }
+
+  let bulls = 0;
+  let cows = 0;
+
+  for (let i = 0; i < 4; i++) {
+      if (guess[i] === code[i]) {
+          bulls++;
+      } else if (code.includes(guess[i])) {
+          cows++;
+      }
+  }
+
+  const historyList = document.getElementById('historyList');
+  const guessResult = document.createElement('li');
+  guessResult.textContent = `Guess: ${guess} - ${bulls} Bulls, ${cows} Cows`;
+  historyList.appendChild(guessResult);
+
+  if (bulls === 4) {
+      clearInterval(timer);
+      document.getElementById('result').innerHTML = ` Congratulations! You won the match,you guessed the number : ${secretNumber}`;
+      document.getElementById('guess').disabled = true;
+  } else {
+      document.getElementById('result').innerHTML = `Keep trying! Check your history below.`;
+  }
+}
diff --git a/3-typing-game/game/style.css b/3-typing-game/game/style.css
@@ -0,0 +1,24 @@
+body {
+    font-family: Arial, sans-serif;
+    text-align: center;
+    margin-top: 50px;
+}
+#timer {
+    font-size: 24px;
+    color: red;
+}
+#result {
+    margin-top: 20px;
+    font-size: 18px;
+}
+#history {
+    margin-top: 20px;
+}
+ul {
+    list-style-type: none;
+    padding: 0;
+}
+li {
+    margin: 5px 0;
+    font-size: 16px;
+}
diff --git a/3-typing-game/solution.md b/3-typing-game/solution.md
@@ -0,0 +1,8 @@
+## cow-bull Game
+
+Actually i have a created basic game only using the concepts that i learnt in the typing
+its just a basic ,we need to guess the 4 digit number randomly generated by the computer 
+and there is a 5 minutes time limit.you need to guess the number before time ends 
+example suppose computer generates 1276 and u guessed 1265 ,when both number and position 
+matchs it is bull when only number is present position is incorrect it shows cow
+in this 1,2 is bull and 6 is cow .it will display the previous guessed data also.