diff --git a/Games/Unword_it/asset/Images/Unword_It_gameplay.png b/Games/Unword_it/asset/Images/Unword_It_gameplay.png new file mode 100644 index 0000000000..51c32bf7f0 Binary files /dev/null and b/Games/Unword_it/asset/Images/Unword_It_gameplay.png differ diff --git a/Games/Unword_it/asset/Images/Unword_It_landing.png b/Games/Unword_it/asset/Images/Unword_It_landing.png new file mode 100644 index 0000000000..c366bca81a Binary files /dev/null and b/Games/Unword_it/asset/Images/Unword_It_landing.png differ diff --git a/Games/Unword_it/asset/Images/Unword_It_reveal_letter.png b/Games/Unword_it/asset/Images/Unword_It_reveal_letter.png new file mode 100644 index 0000000000..424ae1d701 Binary files /dev/null and b/Games/Unword_it/asset/Images/Unword_It_reveal_letter.png differ diff --git a/Games/Unword_it/asset/Images/Unword_It_successful_guess.png b/Games/Unword_it/asset/Images/Unword_It_successful_guess.png new file mode 100644 index 0000000000..c469b05c32 Binary files /dev/null and b/Games/Unword_it/asset/Images/Unword_It_successful_guess.png differ diff --git a/Games/Unword_it/asset/Images/Unword_It_times_up.png b/Games/Unword_it/asset/Images/Unword_It_times_up.png new file mode 100644 index 0000000000..9c9b6cfd39 Binary files /dev/null and b/Games/Unword_it/asset/Images/Unword_It_times_up.png differ diff --git a/Games/Unword_it/asset/Images/desktop.ini b/Games/Unword_it/asset/Images/desktop.ini new file mode 100644 index 0000000000..8dbd29d61e --- /dev/null +++ b/Games/Unword_it/asset/Images/desktop.ini @@ -0,0 +1,2 @@ +[LocalizedFileNames] +Screenshot 2024-07-24 100130.png=@Screenshot 2024-07-24 100130,0 diff --git a/Games/Unword_it/index.html b/Games/Unword_it/index.html new file mode 100644 index 0000000000..fe4f6f4cac --- /dev/null +++ b/Games/Unword_it/index.html @@ -0,0 +1,36 @@ + + + + + + unwordIT - Jumbled Word Charades + + + + +
+

Unword It

+
+
+
30
+ + +
+ + +
+
+
+
+

Team 1

+

Score: 0

+
+
+

Team 2

+

Score: 0

+
+
+
+ + + \ No newline at end of file diff --git a/Games/Unword_it/readme.md b/Games/Unword_it/readme.md new file mode 100644 index 0000000000..cceacf2fe7 --- /dev/null +++ b/Games/Unword_it/readme.md @@ -0,0 +1,49 @@ +# unwordIT - Jumbled Word Charades + +## Description + +unwordIT is a modern, digital twist on the classic game of charades. In this game, players are presented with jumbled words and must describe them to their teammates without using the word itself. The opposing team then tries to guess the word based on the description. This game combines word skills, quick thinking, and team cooperation in a unique, challenging format. + +## Features + +- Jumbled word display +- 30-second timer per round +- Two-team scoring system +- "Reveal Letter" option (costs 1 point) +- Guess input and submission +- Alternating turns between teams +- Random word selection from a predefined list +- Responsive design for both desktop and mobile devices +- Dark, modern user interface + +## How to Play + +1. Start the game by clicking the "Start Game" button. +2. The active team sees a jumbled version of the word. +3. The active team describes the word without using the word itself or any part of it. +4. The opposing team tries to guess the word within 30 seconds. +5. If needed, the active team can reveal a letter (at the cost of 1 point) using the "Reveal Letter" button. +6. The opposing team can submit their guess using the input field and "Submit Guess" button. +7. Points are awarded for correct guesses or when time runs out. +8. Teams alternate turns. + +## Installation + +1. Clone this repository . +```bash + clone git https://github.com/kunjgit/GameZone/tree/main/Games/Unword_It +``` +2. Open the `index.html` file in a web browser to start the game. + +## Credits + +Developed by @Shantnu-singh + + +## Technologies Used + +- HTML5 +- CSS3 +- JavaScript (ES6+) + +Feel free to fork this project and customize it to your liking. Enjoy playing Unword It! \ No newline at end of file diff --git a/Games/Unword_it/script.js b/Games/Unword_it/script.js new file mode 100644 index 0000000000..21c52a2b36 --- /dev/null +++ b/Games/Unword_it/script.js @@ -0,0 +1,116 @@ +const wordDisplay = document.getElementById('word-display'); +const timerDisplay = document.getElementById('timer'); +const startButton = document.getElementById('start-button'); +const revealLetterButton = document.getElementById('reveal-letter'); +const team1Score = document.getElementById('team1-score'); +const team2Score = document.getElementById('team2-score'); +const guessInput = document.getElementById('guess-input'); +const submitGuessButton = document.getElementById('submit-guess'); + +let currentWord = ''; +let jumbledWord = ''; +let timer; +let currentTeam = 1; +let scores = [0, 0]; +let revealedIndices = []; + +const words = [ + 'sunshine', 'butterfly', 'telephone', 'computer', 'elephant', + 'umbrella', 'chocolate', 'football', 'restaurant', 'fireworks' +]; + +function getRandomWord() { + return words[Math.floor(Math.random() * words.length)]; +} + +function jumbleWord(word) { + return word.split('').sort(() => Math.random() - 0.5).join(''); +} + +function updateScores() { + team1Score.textContent = scores[0]; + team2Score.textContent = scores[1]; +} + +function startGame() { + currentWord = getRandomWord(); + jumbledWord = jumbleWord(currentWord); + wordDisplay.textContent = `Jumbled: ${jumbledWord}`; + revealedIndices = []; + startTimer(); + startButton.disabled = true; + revealLetterButton.disabled = false; + guessInput.disabled = false; + submitGuessButton.disabled = false; +} + +function startTimer() { + let timeLeft = 30; + timerDisplay.textContent = timeLeft; + timer = setInterval(() => { + timeLeft--; + timerDisplay.textContent = timeLeft; + if (timeLeft === 0) { + clearInterval(timer); + endRound(false); + } + }, 1000); +} + +function endRound(guessedCorrectly) { + clearInterval(timer); + if (guessedCorrectly) { + scores[currentTeam - 1]++; + wordDisplay.textContent = `Correct! Team ${currentTeam} guessed the word: ${currentWord}`; + } else { + scores[currentTeam % 2]++; + wordDisplay.textContent = `Time's up! The word was: ${currentWord}`; + } + updateScores(); + currentTeam = currentTeam % 2 + 1; + startButton.disabled = false; + revealLetterButton.disabled = true; + guessInput.disabled = true; + submitGuessButton.disabled = true; + guessInput.value = ''; +} + +function revealLetter() { + if (revealedIndices.length < currentWord.length) { + let index; + do { + index = Math.floor(Math.random() * currentWord.length); + } while (revealedIndices.includes(index)); + + revealedIndices.push(index); + + const revealedWord = currentWord.split('').map((char, i) => + revealedIndices.includes(i) ? char : '_' + ).join(''); + + wordDisplay.textContent = `Jumbled: ${jumbledWord} | Revealed: ${revealedWord}`; + scores[currentTeam - 1]--; + updateScores(); + + if (revealedIndices.length === currentWord.length) { + endRound(false); + } + } +} + +function submitGuess() { + const guess = guessInput.value.trim().toLowerCase(); + if (guess === currentWord.toLowerCase()) { + endRound(true); + } else { + guessInput.value = ''; + alert('Incorrect guess. Try again!'); + } +} + +startButton.addEventListener('click', startGame); +revealLetterButton.addEventListener('click', revealLetter); +submitGuessButton.addEventListener('click', submitGuess); + +// Initialize scores +updateScores(); \ No newline at end of file diff --git a/Games/Unword_it/style.css b/Games/Unword_it/style.css new file mode 100644 index 0000000000..5d764f8f3c --- /dev/null +++ b/Games/Unword_it/style.css @@ -0,0 +1,147 @@ +body { + font-family: 'Roboto', sans-serif; + background-color: #1a1a2e; + color: #ffffff; + margin: 0; + padding: 0; + display: flex; + justify-content: center; + align-items: center; + min-height: 100vh; +} + +.container { + max-width: 800px; + width: 90%; + padding: 20px; + text-align: center; +} + +h1 { + font-size: 3rem; + color: #4ecca3; + text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3); + margin-bottom: 30px; +} + +.game-board { + background-color: #16213e; + border-radius: 10px; + padding: 30px; + margin-bottom: 30px; + box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2); +} + +#word-display { + font-size: 24px; + margin-bottom: 20px; + min-height: 60px; + background-color: #0f3460; + border-radius: 5px; + padding: 15px; + word-wrap: break-word; +} + +#timer { + font-size: 36px; + font-weight: bold; + color: #e94560; + margin-bottom: 20px; +} + +button { + background-color: #4ecca3; + border: none; + color: #1a1a2e; + padding: 12px 24px; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 16px; + margin: 8px 4px; + cursor: pointer; + border-radius: 5px; + transition: all 0.3s ease; + font-weight: bold; +} + +button:hover { + background-color: #45b393; + transform: translateY(-2px); + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); +} + +button:active { + transform: translateY(0); + box-shadow: none; +} + +#reveal-letter { + background-color: #e94560; + color: #ffffff; +} + +#reveal-letter:hover { + background-color: #d64058; +} + +.guess-container { + margin-top: 20px; +} + +#guess-input { + padding: 12px; + font-size: 16px; + border: none; + border-radius: 5px; + margin-right: 10px; + background-color: #0f3460; + color: #ffffff; + width: 60%; + max-width: 300px; +} + +#guess-input::placeholder { + color: #a0a0a0; +} + +#submit-guess { + background-color: #0f3460; + color: #ffffff; +} + +#submit-guess:hover { + background-color: #0c2b4e; +} + +.team-scores { + display: flex; + justify-content: space-around; +} + +.team { + background-color: #16213e; + border-radius: 10px; + padding: 20px; + width: 45%; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); +} + +#team1 { + border-left: 5px solid #4ecca3; +} + +#team2 { + border-left: 5px solid #e94560; +} + +@media (max-width: 600px) { + .team-scores { + flex-direction: column; + } + + .team { + width: 100%; + margin-bottom: 20px; + } +} \ No newline at end of file