Skip to content
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
199 changes: 87 additions & 112 deletions script.js
Original file line number Diff line number Diff line change
Expand Up @@ -24,29 +24,8 @@ 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');
}

function loadWordBank() {
const stored = localStorage.getItem('wordBank');
const stored = localStorage.getItem('devopsWords');
if (stored) {
wordBank = JSON.parse(stored);
} else {
Expand Down Expand Up @@ -91,32 +70,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
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';
Expand All @@ -132,6 +144,7 @@ function generateKeyboard() {
}
}

// START GAME
function startGame() {
const p1Name = document.getElementById('player1Name').value.trim();
const p2Name = document.getElementById('player2Name').value.trim();
Expand All @@ -147,35 +160,42 @@ function startGame() {
nextRound();
}

// NEXT ROUND
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);

// Pick a random word
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();

// Alternate player turns
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);

Expand All @@ -190,129 +210,84 @@ 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');

// Switch player for next round
gameState.currentPlayer = gameState.currentPlayer === 1 ? 2 : 1;
updateCurrentPlayer();
}