-
Guess what the word is
+
-
-
- Please enter a single alphabetical character (A-Z) into the input
- box belowand and click "Guess" to see if the letter
- exists in the hidden word.
-
+
-
-
-
-
-
diff --git a/html/word-guesser/scripts/script.js b/html/word-guesser/scripts/script.js
index f90de94..717011e 100644
--- a/html/word-guesser/scripts/script.js
+++ b/html/word-guesser/scripts/script.js
@@ -1,4 +1,3 @@
-// -- Determines if a letter is in a list of letters
function charInChars(char, chars) {
const indexes = charsAt(char, chars);
return indexes !== false;
@@ -12,25 +11,6 @@
}
return indexes.length == 0 ? false : indexes;
}
-function createAlphabetGrid(gameInstance) {
- const alphabet = "abcdefghijklmnopqrstuvwxyz".split("");
- const container = document.createElement("div");
- container.className = "alphabet-grid";
-
- alphabet.forEach((char) => {
- const btn = document.createElement("button");
- btn.innerText = char.toUpperCase();
- btn.className = "letter-btn";
- btn.onclick = () => {
- gameInstance.fields.guessLetter.value = char;
- gameInstance.handleGuessedLetter();
- btn.disabled = true; // Prevent double-clicking
- };
- container.appendChild(btn);
- });
-
- document.getElementById("gameForm").appendChild(container);
-}
function updateLetters(chars) {
const letters = document.createElement("ul");
// create a DOM element for each letter
@@ -158,6 +138,7 @@
currentWordId = "current_word",
notificationsId = "notifications",
gameIntroId = "game_intro",
+ gameHowToId = "game-howto",
) {
this.gameForm = document.getElementById(gameFormId);
this.guesses = document.getElementById(guessesId);
@@ -167,6 +148,7 @@
this.currentWord = document.getElementById(currentWordId);
this.notifications = document.getElementById(notificationsId);
this.gameIntro = document.getElementById(gameIntroId);
+ this.gameHowTo = document.getElementById(gameHowToId);
}
}
function reset(fields) {
@@ -175,9 +157,12 @@
fields.guessButton.value = "Guess";
fields.notifications.innerText = "";
fields.guessCount.value = "0";
- fields.guessLetter.value = "";
+ // fields.guessLetter.value = "";
fields.guesses.replaceChildren();
fields.currentWord.replaceChildren();
+ if (fields.gameHowTo) {
+ fields.gameHowTo.style.display = "block";
+ }
}
class Game {
static gamesPlayed = 0;
@@ -189,65 +174,83 @@
// Use onclick to prevent stacking event listeners across multiple test initializations
const eventHandler = (event) => {
+ event.preventDefault();
if (this.game.gameOver()) {
- reset(this);
+ // reset(this);
// this.gameIntro.innerText =
// "The game that insults you, whether you win or lose!";
// this.guessButton.value = "Guess";
- this.game = new WordGuesser(this.wordChoices);
+ // this.game = new WordGuesser(this.wordChoices);
+ this.newGame();
} else {
- const messages = [
- "Guess",
- "Send it",
- "Feeling lucky?",
- "Is that it?",
- "Final answer?",
- "Spin the wheel",
- "Don't fail now",
- "Roll the dice",
- "Last chance",
- "Click for fate",
- "Make it count",
- "Sure about that?",
- 'git commit -m "hope"',
- "Compile & Pray",
- "Deploy to Prod",
- "Test My Patience",
- "Confirm Mediocrity",
- "Submit to the Abyss",
- "Execute Bad Logic",
- "Break the Build",
- "Force Push",
- "Trigger Segfault",
- "Manifest Failure",
- "Commit Career Suicide",
- "Push to Origin",
- "Yank & Put",
- "Do your worst",
- "Click for Fate",
- "Input Error",
- "Roll for Initiative",
- "Terminate Process",
- ];
- this.guessButton.value = randomMessage(messages);
+ this.updateGuessButton();
this.handleGuessedLetter(event);
}
};
this.gameForm.onsubmit = eventHandler;
this.guessButton.onclick = eventHandler;
}
+ updateGuessButton() {
+ const messages = [
+ "Guess",
+ "Send it",
+ "Feeling lucky?",
+ "Is that it?",
+ "Final answer?",
+ "Spin the wheel",
+ "Don't fail now",
+ "Roll the dice",
+ "Last chance",
+ "Click for fate",
+ "Make it count",
+ "Sure about that?",
+ 'git commit -m "hope"',
+ "Compile & Pray",
+ "Deploy to Prod",
+ "Test My Patience",
+ "Confirm Mediocrity",
+ "Submit to the Abyss",
+ "Execute Bad Logic",
+ "Break the Build",
+ "Force Push",
+ "Trigger Segfault",
+ "Manifest Failure",
+ "Commit Career Suicide",
+ "Push to Origin",
+ "Yank & Put",
+ "Do your worst",
+ "Click for Fate",
+ "Input Error",
+ "Roll for Initiative",
+ "Terminate Process",
+ ];
+ this.guessButton.value = randomMessage(messages);
+ }
renderAlphabet() {
const container = document.getElementById("alphabet_container");
container.innerHTML = ""; // Clear for new game
"abcdefghijklmnopqrstuvwxyz".split("").forEach((char) => {
const btn = document.createElement("button");
+ btn.type = "button";
btn.innerText = char.toUpperCase();
btn.className = "letter-btn";
+
+ // Custom attribute to find this button later by character
+ btn.dataset.char = char;
+
btn.onclick = () => {
+ // 1. Remove selection from previous button
+ if (this.selectedButton) {
+ this.selectedButton.classList.remove("selected");
+ }
+
this.guessLetter.value = char;
+ this.selectedButton = btn;
+ btn.classList.add("selected");
this.handleGuessedLetter();
- btn.disabled = true;
+ this.updateGuessButton();
+ // btn.disabled = true;
};
container.appendChild(btn);
});
@@ -256,9 +259,9 @@
reset(this);
}
newGame() {
- this.renderAlphabet();
this.reset();
this.game = new WordGuesser(this.wordChoices);
+ this.renderAlphabet();
}
// -- Getters
getGuess() {
@@ -488,14 +491,28 @@
if (game.guessCount() == 0) {
this.changeGameIntro();
+ if (this.gameHowTo) {
+ this.gameHowTo.style.display = "none";
+ }
}
try {
const goodGuess = game.guessLetter(letter);
this.goodGuess(letter);
+
+ // Disable the button since it was a correct guess
+ if (this.selectedButton) {
+ this.selectedButton.disabled = true;
+ this.selectedButton.classList.remove("selected");
+ }
} catch (e) {
if (e instanceof BadGuessError) {
this.badGuessError(letter);
+ // Disable even on bad guesses to prevent duplicates
+ if (this.selectedButton) {
+ this.selectedButton.disabled = true;
+ this.selectedButton.classList.remove("selected");
+ }
} else if (e instanceof DuplicateBadGuessError) {
this.duplicateBadGuessError(letter);
} else if (e instanceof DuplicateGoodGuessError) {
@@ -511,6 +528,7 @@
this.updateGuesses(game.getGuesses());
this.updateGuessCount(game.guessCount());
this.clearGuess();
+ this.selectedButton = null;
if (game.gameOver()) {
this.gameOver();
}