diff --git a/script.js b/script.js index 43cfa50..1e1ccf8 100644 --- a/script.js +++ b/script.js @@ -24,29 +24,9 @@ document.addEventListener('DOMContentLoaded', function() { generateKeyboard(); }); -function toggleTheme() { - const themeIcon = document.querySelector('.theme-icon'); - - if (themeIcon.textContent === '🌙') { - themeIcon.textContent = '☀️'; - } else { - themeIcon.textContent = '🌙'; - } -} - -function switchTab(tabName) { - const tabs = document.querySelectorAll('.tab-content'); - tabs.forEach(tab => tab.classList.remove('active')); - - const tabButtons = document.querySelectorAll('.tab'); - tabButtons.forEach(btn => btn.classList.remove('active')); - - document.getElementById(tabName).classList.add('active'); - event.target.classList.add('active'); -} - +// Load words from localStorage or default function loadWordBank() { - const stored = localStorage.getItem('wordBank'); + const stored = localStorage.getItem('devopsWords'); if (stored) { wordBank = JSON.parse(stored); } else { @@ -56,10 +36,12 @@ function loadWordBank() { displayWordBank(); } +// Save wordBank to localStorage function saveWordBank() { localStorage.setItem('devopsWords', JSON.stringify(wordBank)); } +// Display the word bank function displayWordBank() { const wordList = document.getElementById('wordList'); const wordCount = document.getElementById('wordCount'); @@ -91,32 +73,65 @@ function displayWordBank() { }); } +// ADD WORD: validate, reject duplicates, invalid chars function addWord() { const input = document.getElementById('newWord'); const word = input.value.trim().toUpperCase(); - + + if (!word) { + alert('Cannot add empty word!'); + return; + } + if (wordBank.includes(word)) { + alert('Word already exists!'); + return; + } + if (/[^A-Z]/.test(word)) { + alert('Word can only contain letters A-Z!'); + return; + } + wordBank.push(word); input.value = ''; saveWordBank(); displayWordBank(); } +// EDIT WORD: validate, prevent duplicates, valid letters only function editWord(index) { const newWord = prompt('Edit word:', wordBank[index]); - if (newWord) { - wordBank.splice(index, 1); - saveWordBank(); - displayWordBank(); + if (!newWord) return; + + const word = newWord.trim().toUpperCase(); + + if (!word) { + alert('Cannot set empty word!'); + return; + } + if (wordBank.includes(word) && word !== wordBank[index]) { + alert('Word already exists!'); + return; } + if (/[^A-Z]/.test(word)) { + alert('Word can only contain letters A-Z!'); + return; + } + + wordBank[index] = word; + saveWordBank(); + displayWordBank(); } +// DELETE WORD: confirm deletion, update localStorage function deleteWord(index) { if (confirm('Are you sure you want to delete this word?')) { + wordBank.splice(index, 1); saveWordBank(); displayWordBank(); } } +// GENERATE KEYBOARD function generateKeyboard() { const keyboard = document.getElementById('keyboard'); const letters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'; @@ -132,6 +147,7 @@ function generateKeyboard() { } } +// START GAME function startGame() { const p1Name = document.getElementById('player1Name').value.trim(); const p2Name = document.getElementById('player2Name').value.trim(); @@ -147,35 +163,40 @@ function startGame() { nextRound(); } +// NEXT ROUND: alternate players, pick random word function nextRound() { if (wordBank.length === 0) { alert('No words in the word bank! Add some words first.'); return; } - + gameState.guessedLetters = []; gameState.wrongGuesses = 0; gameState.gameActive = true; - - const randomIndex = Math.floor(Math.random() * wordBank.length); + + let randomIndex; + do { + randomIndex = Math.floor(Math.random() * wordBank.length); + } while (wordBank[randomIndex] === gameState.currentWord && wordBank.length > 1); + gameState.currentWord = wordBank[randomIndex]; - - document.getElementById('gameStatus').classList.remove('show'); + document.getElementById('gameStatus').className = 'game-status'; resetHangman(); resetKeyboard(); updateWordDisplay(); updateWrongLetters(); updateLives(); + + gameState.currentPlayer = gameState.currentPlayer === 1 ? 2 : 1; updateCurrentPlayer(); } +// GUESS LETTER function guessLetter(letter) { if (!gameState.gameActive) return; - if (gameState.guessedLetters.includes(letter)) { - return; - } + if (gameState.guessedLetters.includes(letter)) return; gameState.guessedLetters.push(letter); @@ -190,129 +211,83 @@ function guessLetter(letter) { checkGameStatus(); } +// UPDATE DISPLAY function updateWordDisplay() { const display = document.getElementById('wordDisplay'); - let displayText = ''; - - for (let letter of gameState.currentWord) { - if (gameState.guessedLetters.includes(letter)) { - displayText += letter + ' '; - } else { - displayText += '_ '; - } - } - - display.textContent = displayText.trim(); + display.textContent = [...gameState.currentWord].map(l => gameState.guessedLetters.includes(l) ? l : '_').join(' '); } function updateWrongLetters() { const wrongLettersDiv = document.getElementById('wrongLetters'); - const wrong = gameState.guessedLetters.filter(letter => - !gameState.currentWord.includes(letter) - ); - - if (wrong.length === 0) { - wrongLettersDiv.textContent = 'None yet'; - } else { - wrongLettersDiv.textContent = gameState.guessedLetters.join(', '); - } + const wrong = gameState.guessedLetters.filter(l => !gameState.currentWord.includes(l)); + wrongLettersDiv.textContent = wrong.length ? wrong.join(', ') : 'None yet'; } function updateLives() { - const livesLeft = gameState.maxWrong - gameState.wrongGuesses + 1; + const livesLeft = gameState.maxWrong - gameState.wrongGuesses; document.getElementById('livesLeft').textContent = livesLeft; } +// HANGMAN function updateHangman() { - const parts = ['head', 'body', 'leftArm', 'rightArm', 'leftLeg', 'rightLeg']; - const wrongOrder = ['head', 'leftArm', 'rightArm', 'body', 'leftLeg', 'rightLeg']; const partIndex = gameState.wrongGuesses - 1; - if (partIndex >= 0 && partIndex < wrongOrder.length) { - const partToShow = wrongOrder[partIndex]; - document.getElementById(partToShow).style.display = 'block'; + document.getElementById(wrongOrder[partIndex]).style.display = 'block'; } } function resetHangman() { - const parts = ['head', 'body', 'leftArm', 'rightArm', 'leftLeg', 'rightLeg']; - parts.forEach(part => { - document.getElementById(part).style.display = 'none'; + ['head','body','leftArm','rightArm','leftLeg','rightLeg'].forEach(id => { + document.getElementById(id).style.display = 'none'; }); } function resetKeyboard() { - const letters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'; - for (let letter of letters) { - const button = document.getElementById('key-' + letter); - if (button) { - button.disabled = false; - } - } + 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'.split('').forEach(letter => { + const btn = document.getElementById('key-' + letter); + if (btn) btn.disabled = false; + }); } +// PLAYER DISPLAY function updateCurrentPlayer() { - const player1Div = document.getElementById('player1Score'); - const player2Div = document.getElementById('player2Score'); + const p1Div = document.getElementById('player1Score'); + const p2Div = document.getElementById('player2Score'); - if (gameState.currentPlayer === 1) { - player1Div.classList.add('active'); - player2Div.classList.remove('active'); - } else { - player1Div.classList.remove('active'); - player2Div.classList.add('active'); - } + p1Div.classList.toggle('active', gameState.currentPlayer === 1); + p2Div.classList.toggle('active', gameState.currentPlayer === 2); } +// GAME STATUS function checkGameStatus() { - const allLettersGuessed = [...gameState.currentWord].every(letter => - gameState.guessedLetters.includes(letter) - ); + const allGuessed = [...gameState.currentWord].every(l => gameState.guessedLetters.includes(l)); - if (allLettersGuessed) { - gameWon(); - return; - } - - if (gameState.wrongGuesses >= gameState.maxWrong) { - gameLost(); - return; - } + if (allGuessed) gameWon(); + else if (gameState.wrongGuesses >= gameState.maxWrong) gameLost(); } function gameWon() { gameState.gameActive = false; + const winner = gameState.currentPlayer === 1 ? gameState.player2 : gameState.player1; + winner.score += 10; + document.getElementById('score1').textContent = gameState.player1.score; + document.getElementById('score2').textContent = gameState.player2.score; - if (gameState.currentPlayer === 1) { - gameState.player2.score += 10; - document.getElementById('score2').textContent = gameState.player2.score; - } else { - gameState.player1.score += 10; - document.getElementById('score1').textContent = gameState.player1.score; - } - + const winnerName = winner.name; const statusDiv = document.getElementById('gameStatus'); - const statusMsg = document.getElementById('statusMessage'); - - const winnerName = gameState.currentPlayer === 1 ? - gameState.player2.name : gameState.player1.name; - - statusMsg.textContent = `🎉 ${winnerName} won! The word was: ${gameState.currentWord}`; + document.getElementById('statusMessage').textContent = `🎉 ${winnerName} won! The word was: ${gameState.currentWord}`; statusDiv.classList.add('show', 'winner'); } function gameLost() { gameState.gameActive = false; + const currentPlayerName = gameState.currentPlayer === 1 ? gameState.player1.name : gameState.player2.name; const statusDiv = document.getElementById('gameStatus'); - const statusMsg = document.getElementById('statusMessage'); - - const currentPlayerName = gameState.currentPlayer === 1 ? - gameState.player1.name : gameState.player2.name; - - statusMsg.textContent = `😢 ${currentPlayerName} lost! The word was: ${gameState.currentWord}`; + document.getElementById('statusMessage').textContent = `😢 ${currentPlayerName} lost! The word was: ${gameState.currentWord}`; statusDiv.classList.add('show', 'loser'); gameState.currentPlayer = gameState.currentPlayer === 1 ? 2 : 1; + updateCurrentPlayer(); }