diff --git a/Guess The Word/index.html b/Guess The Word/index.html new file mode 100644 index 0000000..f83683d --- /dev/null +++ b/Guess The Word/index.html @@ -0,0 +1,49 @@ + + + + + + Document + + + +

Guess The Word

+ Difficulty: + +

+ Category: + +

+ Hint: + +

+ +

+ Attempts left: + +

+ +

+ + + diff --git a/Guess The Word/script.js b/Guess The Word/script.js new file mode 100644 index 0000000..effc87d --- /dev/null +++ b/Guess The Word/script.js @@ -0,0 +1,233 @@ +const words = [ + { + word: "javascript", + category: "Programming", + hint: "A scripting language for the web.", + }, + { + word: "python", + category: "Programming", + hint: "A snake and a popular programming language.", + }, + { + word: "react", + category: "Programming", + hint: "A JavaScript library for building UIs.", + }, + { + word: "algorithm", + category: "Programming", + hint: "A step-by-step procedure to solve a problem.", + }, + { + word: "variable", + category: "Programming", + hint: "Used to store data values in a program.", + }, + + { word: "elephant", category: "Animal", hint: "The largest land animal." }, + { word: "tiger", category: "Animal", hint: "The national animal of India." }, + { + word: "penguin", + category: "Animal", + hint: "A bird that cannot fly but can swim.", + }, + { + word: "dolphin", + category: "Animal", + hint: "An intelligent aquatic mammal.", + }, + { + word: "kangaroo", + category: "Animal", + hint: "An animal that hops and carries babies in a pouch.", + }, + + { + word: "pizza", + category: "Food", + hint: "A popular Italian dish with cheese.", + }, + { + word: "burger", + category: "Food", + hint: "A sandwich with a patty inside buns.", + }, + { + word: "pasta", + category: "Food", + hint: "An Italian dish made with noodles and sauce.", + }, + { + word: "sushi", + category: "Food", + hint: "A Japanese dish made with rice and raw fish.", + }, + { + word: "biryani", + category: "Food", + hint: "A flavorful rice dish popular in South Asia.", + }, + + { word: "mumbai", category: "City", hint: "A coastal city in India." }, + { + word: "paris", + category: "City", + hint: "The city of love and the Eiffel Tower.", + }, + { word: "tokyo", category: "City", hint: "The capital of Japan." }, + { word: "newyork", category: "City", hint: "The Big Apple." }, + { + word: "london", + category: "City", + hint: "Famous for the Big Ben and the Thames.", + }, + + { + word: "guitar", + category: "Instrument", + hint: "Has strings and is played with fingers.", + }, + { + word: "piano", + category: "Instrument", + hint: "Has keys and is played with fingers.", + }, + { + word: "drums", + category: "Instrument", + hint: "Played with sticks and gives rhythm.", + }, + { + word: "violin", + category: "Instrument", + hint: "A string instrument played with a bow.", + }, + { + word: "flute", + category: "Instrument", + hint: "A wind instrument you blow into.", + }, + + { word: "moon", category: "Space", hint: "Earth’s only natural satellite." }, + { + word: "sun", + category: "Space", + hint: "The star at the center of our solar system.", + }, + { word: "mars", category: "Space", hint: "The red planet." }, + { + word: "galaxy", + category: "Space", + hint: "A system of stars, dust, and gas bound by gravity.", + }, + { + word: "comet", + category: "Space", + hint: "An icy body that glows as it passes near the sun.", + }, + + { + word: "cricket", + category: "Sport", + hint: "A bat-and-ball game popular in India.", + }, + { + word: "football", + category: "Sport", + hint: "A game played with a round ball and two goals.", + }, + { + word: "chess", + category: "Sport", + hint: "A game of strategy played on a checkered board.", + }, + { + word: "tennis", + category: "Sport", + hint: "Played with rackets and a small yellow ball.", + }, + { + word: "basketball", + category: "Sport", + hint: "A game where players shoot hoops.", + }, + + { word: "rose", category: "Flower", hint: "A symbol of love and romance." }, + { word: "lotus", category: "Flower", hint: "The national flower of India." }, + { + word: "sunflower", + category: "Flower", + hint: "Follows the sun across the sky.", + }, + { + word: "tulip", + category: "Flower", + hint: "A spring flower often found in the Netherlands.", + }, + { + word: "lily", + category: "Flower", + hint: "A fragrant white flower often used in ceremonies.", + }, +]; +const categoryEl = document.getElementById("selected-category"); +const hintEl = document.getElementById("hint-text"); +const blankEl = document.getElementById("blank"); +const guessInput = document.getElementById("guessInput"); +const submitBtn = document.getElementById("submitBtn"); +const newWordBtn = document.getElementById("new-word"); +const resultEl = document.getElementById("result-arena"); +const countEl = document.getElementById("count"); +const difficultySelect = document.getElementById("diff-option"); +let secretWord = ""; +let attempt = 0; + +setDifficulty = () => { + const level = difficultySelect.value; + if (level === "easy") attempt = 8; + else if (level === "medium") attempt = 6; + else attempt = 4; +}; +startGame = () => { + const random = words[Math.floor(Math.random() * words.length)]; + categoryEl.innerHTML = random.category; + hintEl.innerHTML = random.hint; + secretWord = random.word.toLowerCase(); + blankEl.innerHTML = "_".repeat(secretWord.length); + resultEl.textContent = ""; + setDifficulty(); + countEl.textContent = attempt; + guessInput.value = ""; +}; +guessWord = () => { + const guess = guessInput.value.trim().toLowerCase(); + if (!guess || attempt < 1) { + return; + } + if (guess === secretWord) { + resultEl.textContent = `✅ Correct! The word was ${secretWord.toUpperCase()}`; + resultEl.style.color = "var(--sucess)"; + } else { + attempt--; + resultEl.textContent = `❌ Wrong! Try again.`; + resultEl.style.color = `var(--error)`; + countEl.textContent = attempt; + if (attempt <= 0) { + resultEl.textContent = + "💀 Game Over! The word was " + secretWord.toUpperCase(); + resultEl.style.color = "var(--error)"; + } + } + guessInput.value = ""; +}; +submitBtn.addEventListener("click", () => { + guessWord(); +}); +guessInput.addEventListener("keydown", (e) => { + if (e.key === "Enter") checkGuess(); +}); +newWordBtn.addEventListener("click", startGame); +difficultySelect.addEventListener("change", startGame); + +startGame(); diff --git a/Guess The Word/style.css b/Guess The Word/style.css new file mode 100644 index 0000000..47ff2d5 --- /dev/null +++ b/Guess The Word/style.css @@ -0,0 +1,145 @@ +:root { + --primary: #1a1f36; + --secondary: #f0f4f8; + --accent: #ff6b6b; + --success: #32d48a; + --error: #ff4e4e; + --font: "Poppins", sans-serif; +} + +* { + box-sizing: border-box; +} + +body { + margin: 0; + font-family: var(--font); + background: linear-gradient(135deg, #1a1f36, #232946); + color: var(--secondary); + display: flex; + justify-content: center; + align-items: center; + min-height: 100vh; + padding: 1rem; +} + +#hero { + background: rgba(255, 255, 255, 0.05); + backdrop-filter: blur(10px); + border-radius: 20px; + padding: 2rem; + width: 100%; + max-width: 480px; + display: flex; + flex-direction: column; + gap: 1.2rem; + box-shadow: 0 8px 30px rgba(0, 0, 0, 0.3); +} + +#title { + text-align: center; +} + +#heading { + font-size: 2rem; + color: var(--accent); + margin-bottom: 0.5rem; +} + +label { + font-size: 0.9rem; + margin-bottom: 0.3rem; + display: block; +} +#Difficulty { + gap: 1rem; + display: flex; + justify-content: center; + align-items: center; + margin: 0 1rem; + margin-top: 1.5rem; +} + +select, +input, +button { + width: 100%; + padding: 10px 12px; + border-radius: 8px; + border: none; + font-size: 1rem; + margin-bottom: 0.8rem; + outline: none; +} + +select, +input { + background: rgba(255, 255, 255, 0.12); + color: var(--secondary); +} + +input::placeholder { + color: rgba(255, 255, 255, 0.6); +} + +button { + background: var(--accent); + color: white; + font-weight: 600; + cursor: pointer; + transition: 0.25s; +} + +button:hover { + background: #ff5252; + transform: scale(1.03); +} + +#play-arena { + display: flex; + flex-direction: column; + margin: 0 1rem; +} + +#category, +#hint, +#blank, +#Attempts-counts, +#result-arena { + padding: 0.5rem 0; + font-size: 1rem; +} + +#blank { + font-size: 1.5rem; + letter-spacing: 6px; + text-align: center; + margin-bottom: 0.8rem; +} + +#result-arena { + font-weight: bold; + min-height: 1.4em; + text-align: center; +} +#Attempts-counts { + text-align: center; + margin-bottom: 1.5rem; +} +#category { + text-align: center; +} +@media (max-width: 480px) { + #heading { + font-size: 1.6rem; + } + select, + input, + button { + font-size: 0.9rem; + } + #blank { + font-size: 1.2rem; + letter-spacing: 4px; + } +}