web/wordle-clone
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Regenerated dictionary and started showing guesses

Browse source
This commit is contained in:
Leon Mika 2025-03-10 15:50:07 +11:00
parent c668b1e266
commit af1c5ace72
12 changed files with 13275 additions and 47 deletions
Download patch file Download diff file Expand all files Collapse all files

80
site/assets/scripts/controllers/playfield.js
View file

@ -7,7 +7,7 @@ import { WordSource } from "../models/words.js";
export default class extends Controller {
static targets = ["row", "playfield", "topMessage", "nextPuzzleButtons"];
static outlets = ["overlay"];
async connect() {
this._wordSource = new WordSource();
this._gameController = new GameController(this._wordSource);
@ -16,32 +16,33 @@ export default class extends Controller {
this._buildPlayfield();
}
tappedKey(key) {
console.log(`Key ${key} was tapped via outliet`);
this._addLetter(key);
}
_addLetter(letter) {
if (this._activeRowIndex < 0) {
return;
} else if (this._activeLetter >= this._gameController.wordLength()) {
return;
}
let rowElem = this.rowTargets[this._activeRowIndex];
let colElem = rowElem.querySelectorAll("span")[this._activeLetter];
colElem.innerText = letter.toUpperCase();
colElem.classList.remove("hint");
this._activeLetter += 1;
}
enterGuess() {
if (this._activeLetter >= this._gameController.wordLength()) {
let rowElem = this.rowTargets[this._activeRowIndex];
this._verifyGuess(rowElem);
this._verifyGuess(rowElem);
}
}
@ -51,7 +52,7 @@ export default class extends Controller {
let word = this._gameController.currentWord();
window.open(`https://www.ecosia.org/search?q=define+${word}`, "_blank");
}
tappedBackspace() {
if (this._activeLetter == 0) {
return;
@ -61,18 +62,24 @@ export default class extends Controller {
let rowElem = this.rowTargets[this._activeRowIndex];
let colElem = rowElem.querySelectorAll("span")[this._activeLetter];
colElem.innerText = "";
let colHint = colElem.dataset["hint"];
if (colHint) {
colElem.classList.add("hint");
colElem.innerText = colHint;
} else {
colElem.innerText = "";
}
}
_verifyGuess(rowElem) {
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);
switch (results.guessResult) {
case GUESS_RESULT.FOUL:
this.overlayOutlet.showMessage("Not a valid word");
this.overlayOutlet.showMessage("Not in dictionary");
rowElem.replaceWith(this._buildPlayfieldRow(this._gameController.wordLength()));
this._activeLetter = 0;
@ -90,6 +97,7 @@ export default class extends Controller {
this.nextPuzzleButtonsTarget.classList.remove("hide");
} else {
this._activeLetter = 0;
this._showHints(this.rowTargets[this._activeRowIndex], results.markers);
}
break;
@ -110,42 +118,43 @@ export default class extends Controller {
this.overlayOutlet.showMessage("No more words available.");
}
}
_buildPlayfield() {
let rows = this._gameController.guesses();
let wordLength = this._gameController.wordLength();
this._activeRowIndex = 0;
this._activeLetter = 0;
let newRows = [];
for (let r = 0; r < rows; r++) {
for (let r = 0; r < rows; r++) {
newRows.push(this._buildPlayfieldRow(wordLength));
}
this._showHints(newRows[0]);
this.playfieldTarget.replaceChildren.apply(this.playfieldTarget, newRows);
this.topMessageTarget.innerHTML = "&nbsp;"
this.nextPuzzleButtonsTarget.classList.add("hide");
window.dispatchEvent(new CustomEvent("resetKeyColors"));
}
_buildPlayfieldRow(wordLength) {
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");
divElem.appendChild(letterSpan);
}
return divElem;
return divElem;
}
_colorizeRow(row, results) {
let markers = results.markers;
for (let i = 0; i < this._gameController.wordLength(); i++) {
switch (markers[i]) {
case MARKERS.RIGHT_POS:
@ -153,15 +162,28 @@ export default class extends Controller {
break;
case MARKERS.RIGHT_CHAR:
row.children[i].classList.add("right-char");
break;
break;
case MARKERS.MISS:
row.children[i].classList.add("miss");
break;
break;
}
}
window.dispatchEvent(new CustomEvent("guessResults", {
detail: results
}));
}
_showHints(row) {
let hint = this._gameController.showHint();
for (let i = 0; i < this._gameController.wordLength(); i++) {
if (hint[i]) {
let colElem = row.children[i];
colElem.classList.add("hint");
colElem.innerText = hint[i].toUpperCase();
colElem.dataset["hint"] = hint[i].toUpperCase();
}
}
}
}

47
site/assets/scripts/models/gamecontroller.js
View file

@ -18,7 +18,17 @@ class ProgressionState {
return JSON.parse(prog);
}
prog = {wordLength: 4, wordIndex: {"4": 0, "5": 0, "6": 0}};
this.clearProgression("");
return prog;
}
clearProgression(shuffleId) {
let prog = {
shuffleId: shuffleId,
wordLength: 4,
wordIndex: {"4": 0, "5": 0, "6": 0},
currentGuesses: []
};
localStorage.setItem('progression', JSON.stringify(prog));
return prog;
}
@ -37,6 +47,11 @@ export class GameController {
async start() {
let prog = this._progressionState.getProgression();
if (await this._wordSource.needToResetProgression(prog)) {
console.log("Clearing patten shuffle id")
prog = this._progressionState.clearProgression(await this._wordSource.getPattenShuffleID());
}
this._currentWord = await this._wordSource.getCurrentWord(prog);
this._guesses = Math.max(this._currentWord.length, 5) + 1;
@ -53,6 +68,14 @@ export class GameController {
return this._guesses;
}
currentGuesses() {
let prog = this._progressionState.getProgression();
if (!prog || !prog.currentGuesses) {
return [];
}
return prog.currentGuesses;
}
currentWord() {
this._checkHasStarted();
return this._currentWord;
@ -63,6 +86,7 @@ export class GameController {
let prog = this._progressionState.getProgression();
prog.wordIndex[prog.wordLength + ""] += 1;
prog.wordLength = (((Math.random() * 23) | 0) / 10 | 0) + 4;
prog.currentGuesses = [];
this._progressionState.saveProgression(prog);
@ -70,6 +94,22 @@ export class GameController {
this._guesses = Math.max(this._currentWord.length, 5) + 1;
return true;
}
showHint() {
let hints = new Array(this._currentWord.length);
let priorGuesses = this._progressionState.getProgression().currentGuesses;
hints[0] = this._currentWord[0];
for (let i = 1; i < this._currentWord.length; i++) {
for (let guess of priorGuesses) {
if (guess[i] === this._currentWord[i]) {
hints[i] = this._currentWord[i];
}
}
}
return hints;
}
checkGuess(guess) {
this._checkHasStarted();
@ -141,6 +181,11 @@ export class GameController {
} else {
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,

18
site/assets/scripts/models/words.js
View file

@ -33,6 +33,15 @@ export class WordSource {
return binSearch(list, word);
}
async needToResetProgression(prog) {
await this._fetchAllWordsIfNecessary();
return (!prog.shuffleId) || this._pattern.id !== prog.shuffleId;
}
async getPattenShuffleID() {
return this._pattern.id;
}
async getCurrentWord(prog) {
let words = await this._fetchAllWordsIfNecessary();
@ -44,15 +53,6 @@ export class WordSource {
return words.words[wordLengthKey][idx];
}
// async nextWord() {
// if (this._currentWord >= this._words.length - 1) {
// return false;
// }
//
// this._currentWord += 1;
// return true;
// }
async _fetchAllWordsIfNecessary() {
if (this._wordData) {
return this._wordData;