Generate results when word is found

This commit is contained in:
2024-11-05 15:10:20 +01:00
parent 43dbf54e53
commit a7499d4e74
2 changed files with 15 additions and 8 deletions

View File

@@ -16,6 +16,10 @@ document.addEventListener('alpine:init', () => {
guessError: '', guessError: '',
resultGameID: '',
resultGuesses: '',
resultTimeTaken: '',
async getGameID() { async getGameID() {
/* Get the game number from the backend */ /* Get the game number from the backend */
this.loading = true; this.loading = true;
@@ -30,7 +34,6 @@ document.addEventListener('alpine:init', () => {
}, },
async doGuess() { async doGuess() {
/* Check guess against server */
this.guessError = null; this.guessError = null;
this.guessValue = this.guessValue.toLowerCase(); this.guessValue = this.guessValue.toLowerCase();
@@ -46,11 +49,12 @@ document.addEventListener('alpine:init', () => {
} }
this.nrGuesses++; this.nrGuesses++;
if (this.startTime === '') { if (this.startTime === null) {
console.log('Setting startTime to now'); console.log('Setting startTime to now');
this.startTime = now(); this.startTime = new Date();
} }
/* Check guess against server */
this.loading = true; this.loading = true;
let response = await fetch('/api/guess/' + this.guessValue); let response = await fetch('/api/guess/' + this.guessValue);
@@ -76,7 +80,10 @@ document.addEventListener('alpine:init', () => {
} }
if (result.hint && result.hint === 'it') { if (result.hint && result.hint === 'it') {
console.log('gevonden!'); console.log('gevonden!');
this.winTime = now(); this.winTime = new Date();
this.resultGameID = '🧩 Puzzel #' + this.gameID;
this.resultGuesses = '🤔 '+ this.nrGuesses + ' gokken';
this.resultTimeTaken = '⏱️ ' + getFormattedTime(this.winTime - this.startTime);
} }
} }
}), }),
@@ -111,7 +118,7 @@ function getFormattedTime(milliseconds) {
const formattedTime = []; const formattedTime = [];
if (hours) { if (hours) {
formattedTime.push(`${hours}h`); formattedTime.push(`${hours}u`);
} }
if (minutes) { if (minutes) {
formattedTime.push(`${minutes}m`); formattedTime.push(`${minutes}m`);

View File

@@ -44,9 +44,9 @@
<p>Het woord van vandaag was <b x-text="$store.alfagok.guessValue"></b>.</p> <p>Het woord van vandaag was <b x-text="$store.alfagok.guessValue"></b>.</p>
<div id="stats"> <div id="stats">
<div id="results"> <div id="results">
<p><b x-data="{ message: '🧩 Puzzel #' + $store.alfagok.gameID }" x-text="message"></b></p> <p><b x-text="$store.alfagok.resultGameID"></b></p>
<p x-data="{ message: '🤔 '+ $store.alfagok.nrGuesses + ' gokken' }" x-text="message"></p> <p x-text="$store.alfagok.resultGuesses"></p>
<p x-data="{ message: '⏱️ ' + getFormattedTime($store.alfagok.winTime - $store.alfagok.startTime) }" x-text="message"></p> <p x-text="$store.alfagok.resultTimeTaken"></p>
<p>🔗 <span style="color:var(--blue)">alfagok.diginaut.net</span></p> <p>🔗 <span style="color:var(--blue)">alfagok.diginaut.net</span></p>
</div> </div>
</div> </div>