75 lines
1.9 KiB
JavaScript
75 lines
1.9 KiB
JavaScript
var target = document.getElementById("startup-target").innerText;
|
|
var buffer = "";
|
|
var successfulAttempts = 0;
|
|
var failedAttempts = 0;
|
|
var isGameActive = true;
|
|
|
|
document.body.removeChild(document.getElementById("startup-target"));
|
|
|
|
const field = document.getElementById("spell-field");
|
|
const scoreGood = document.getElementById("score-good");
|
|
const scoreBad = document.getElementById("score-bad");
|
|
const scorePercent = document.getElementById("score-percent");
|
|
|
|
const image = document.getElementById("word-image");
|
|
|
|
async function updateTarget() {
|
|
isGameActive = false;
|
|
const response = await fetch("/random");
|
|
const object = await response.json();
|
|
target = object.word;
|
|
image.src = object.image_url;
|
|
isGameActive = true;
|
|
console.log("ready!");
|
|
}
|
|
|
|
function isLetter(str) {
|
|
return str.length === 1 && str.match(/[a-z]/i);
|
|
}
|
|
|
|
updateSpellField = (text) => {
|
|
field.innerText = text;
|
|
field.style.color = "";
|
|
}
|
|
|
|
updateScores = () => {
|
|
scoreGood.innerText = successfulAttempts;
|
|
scoreBad.innerText = failedAttempts;
|
|
var total = successfulAttempts + failedAttempts;
|
|
var percent = (successfulAttempts / total) * 100;
|
|
scorePercent.innerText = Math.round(percent);
|
|
}
|
|
|
|
submitBuffer = () => {
|
|
if(buffer.toLowerCase() !== target.toLowerCase())
|
|
{
|
|
updateSpellField(target);
|
|
field.style.color = "red";
|
|
failedAttempts += 1;
|
|
} else {
|
|
updateSpellField(buffer);
|
|
field.style.color = "green";
|
|
successfulAttempts += 1;
|
|
}
|
|
updateScores();
|
|
buffer = "";
|
|
updateTarget();
|
|
}
|
|
|
|
document.onkeyup = (ev) => {
|
|
const key = ev.key;
|
|
if(isGameActive)
|
|
{
|
|
if(key === "Enter")
|
|
{
|
|
if(buffer.length != 0) submitBuffer();
|
|
}
|
|
if(isLetter(key))
|
|
{
|
|
buffer += key;
|
|
updateSpellField(buffer);
|
|
}
|
|
}
|
|
ev.preventDefault();
|
|
return false;
|
|
} |