From 947ed37974c2e239a7c9565c4ed44c5a6022c8a5 Mon Sep 17 00:00:00 2001 From: Leon Mika Date: Mon, 10 Mar 2025 16:22:34 +1100 Subject: [PATCH] Added saving of guesses in progress --- site/assets/scripts/controllers/playfield.js | 71 +++++++++++++++----- site/assets/scripts/models/gamecontroller.js | 32 ++++++--- site/assets/scripts/models/words.js | 2 +- 3 files changed, 79 insertions(+), 26 deletions(-) diff --git a/site/assets/scripts/controllers/playfield.js b/site/assets/scripts/controllers/playfield.js index 48815d7..20e478a 100644 --- a/site/assets/scripts/controllers/playfield.js +++ b/site/assets/scripts/controllers/playfield.js @@ -75,13 +75,15 @@ export default class extends Controller { let guessedWord = Array.from(rowElem.querySelectorAll("span")).map((x) => x.innerText).join(""); console.log("The guessed word is: " + guessedWord); - let results = this._gameController.checkGuess(guessedWord); + let results = this._gameController.submitGuess(guessedWord); switch (results.guessResult) { case GUESS_RESULT.FOUL: this.overlayOutlet.showMessage("Not in dictionary"); - rowElem.replaceWith(this._buildPlayfieldRow(this._gameController.wordLength())); + let newRow = this._buildPlayfieldRow(this._gameController.wordLength()); + this._showHints(newRow); + rowElem.replaceWith(newRow); this._activeLetter = 0; window.dispatchEvent(new CustomEvent("guessResults", { @@ -93,8 +95,7 @@ export default class extends Controller { this._activeRowIndex += 1; if (this._activeRowIndex >= this._gameController.guesses()) { - this.topMessageTarget.innerText = this._gameController.currentWord().toUpperCase(); - this.nextPuzzleButtonsTarget.classList.remove("hide"); + this._revealAnswer(); } else { this._activeLetter = 0; this._showHints(this.rowTargets[this._activeRowIndex], results.markers); @@ -103,9 +104,7 @@ export default class extends Controller { break; case GUESS_RESULT.WIN: this._colorizeRow(rowElem, results); - - this.topMessageTarget.innerText = "Hooray! You did it."; - this.nextPuzzleButtonsTarget.classList.remove("hide"); + this._showWin(); break; } } @@ -119,36 +118,76 @@ export default class extends Controller { } } + _showWin() { + this.topMessageTarget.innerText = "Hooray! You did it."; + this.nextPuzzleButtonsTarget.classList.remove("hide"); + } + + _revealAnswer() { + this.topMessageTarget.innerText = this._gameController.currentWord().toUpperCase(); + this.nextPuzzleButtonsTarget.classList.remove("hide"); + } + _buildPlayfield() { let rows = this._gameController.guesses(); let wordLength = this._gameController.wordLength(); + let {currentGuesses, wasWin} = this._gameController.currentState(); - this._activeRowIndex = 0; + this._activeRowIndex = currentGuesses.length; this._activeLetter = 0; + window.dispatchEvent(new CustomEvent("resetKeyColors")); + let newRows = []; for (let r = 0; r < rows; r++) { - newRows.push(this._buildPlayfieldRow(wordLength)); + let currentGuess = null; + let currentGuessResults = null; + + if (r < currentGuesses.length) { + currentGuess = currentGuesses[r]; + currentGuessResults = this._gameController.checkGuess(currentGuess); + } + + newRows.push(this._buildPlayfieldRow(wordLength, currentGuess, currentGuessResults)); + if (currentGuessResults) { + window.dispatchEvent(new CustomEvent("guessResults", { + detail: currentGuessResults + })); + } + } + + if (wasWin) { + this._showWin(); + } else if (currentGuesses.length >= rows) { + // User has already used up all their guesses so just show the results; + this._revealAnswer(); + } else { + this._showHints(newRows[currentGuesses.length]); + + this.topMessageTarget.innerHTML = " " + this.nextPuzzleButtonsTarget.classList.add("hide"); } - this._showHints(newRows[0]); this.playfieldTarget.replaceChildren.apply(this.playfieldTarget, newRows); - - this.topMessageTarget.innerHTML = " " - this.nextPuzzleButtonsTarget.classList.add("hide"); - - window.dispatchEvent(new CustomEvent("resetKeyColors")); } - _buildPlayfieldRow(wordLength) { + _buildPlayfieldRow(wordLength, currentGuess, currentGuessResults) { let divElem = document.createElement("div"); divElem.classList.add("row"); divElem.setAttribute("data-playfield-target", "row"); for (let c = 0; c < wordLength; c++) { let letterSpan = document.createElement("span"); + if (currentGuess) { + letterSpan.innerText = currentGuess[c].toUpperCase(); + } divElem.appendChild(letterSpan); } + + if (currentGuess) { + this._colorizeRow(divElem, currentGuessResults); + } + return divElem; } diff --git a/site/assets/scripts/models/gamecontroller.js b/site/assets/scripts/models/gamecontroller.js index 0813fb3..7ae2131 100644 --- a/site/assets/scripts/models/gamecontroller.js +++ b/site/assets/scripts/models/gamecontroller.js @@ -68,12 +68,15 @@ export class GameController { return this._guesses; } - currentGuesses() { + currentState() { let prog = this._progressionState.getProgression(); if (!prog || !prog.currentGuesses) { return []; } - return prog.currentGuesses; + return { + wasWin: prog.wasWin, + currentGuesses: prog.currentGuesses + }; } currentWord() { @@ -87,7 +90,7 @@ export class GameController { prog.wordIndex[prog.wordLength + ""] += 1; prog.wordLength = (((Math.random() * 23) | 0) / 10 | 0) + 4; prog.currentGuesses = []; - + prog.wasWin = false; this._progressionState.saveProgression(prog); this._currentWord = await this._wordSource.getCurrentWord(prog); @@ -110,7 +113,23 @@ export class GameController { return hints; } - + + submitGuess(guess) { + guess = guess.toLowerCase(); + + let results = this.checkGuess(guess); + + // Add this guess to the progression state + if (results.guessResult !== GUESS_RESULT.FOUL) { + let prog = this._progressionState.getProgression(); + prog.currentGuesses.push(guess); + prog.wasWin = results.guessResult === GUESS_RESULT.WIN; + this._progressionState.saveProgression(prog); + } + + return results; + } + checkGuess(guess) { this._checkHasStarted(); @@ -182,11 +201,6 @@ export class GameController { guessResult = GUESS_RESULT.MISS; } - // Add this guess to the progression state - let prog = this._progressionState.getProgression(); - prog.currentGuesses.push(guess); - this._progressionState.saveProgression(prog); - return { guessResult: guessResult, hits: hits, diff --git a/site/assets/scripts/models/words.js b/site/assets/scripts/models/words.js index fb0dc58..5e27786 100644 --- a/site/assets/scripts/models/words.js +++ b/site/assets/scripts/models/words.js @@ -36,7 +36,7 @@ export class WordSource { async needToResetProgression(prog) { await this._fetchAllWordsIfNecessary(); - return (!prog.shuffleId) || this._pattern.id !== prog.shuffleId; + return !prog || !prog.shuffleId || this._pattern.id !== prog.shuffleId; } async getPattenShuffleID() {