arnekeller/qwörtle
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Display status on keyboard

Browse Source
This commit is contained in:
Arne Keller 2022-02-23 15:12:20 +01:00
parent 1c8f5453f6
commit 5127266fce
1 changed files with 47 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
index.js
View File

@ -123,6 +123,32 @@ function gameOver() {
}, 0); }, 0);
} }
let keys = {};
let characters = [{}, {}, {}, {}];
function makeGradient(a, b, c, d) {
const CORRECT = "rgb(0 204 136)";
const POSITION = "rgb(255 204 0)";
const OTHER = "rgb(156, 163, 175)";
const color = {
"correct": CORRECT,
"position": POSITION
};
if (a === "nope" && b === "nope" && c === "nope" && d === "nope") {
return "rgb(21 94 117)";
}
const style = "conic-gradient(" +
(color[a] || OTHER) + " 0deg," +
(color[a] || OTHER) + " 90deg," +
(color[b] || OTHER) + " 90deg," +
(color[b] || OTHER) + " 180deg," +
(color[c] || OTHER) + " 180deg," +
(color[c] || OTHER) + " 270deg," +
(color[d] || OTHER) + " 270deg," +
(color[d] || OTHER) + " 360deg)";
return style;
}
function processKey(e) { function processKey(e) {
if (e.key === "Enter" && guessed.length < MAX_GUESSES) { if (e.key === "Enter" && guessed.length < MAX_GUESSES) {
if (input.length < 5) { if (input.length < 5) {
@ -145,6 +171,7 @@ function processKey(e) {
if (word[i] === input[i]) { if (word[i] === input[i]) {
hints[i] = "correct"; hints[i] = "correct";
used[i] = true; used[i] = true;
characters[pos][input[i]] = "correct";
} }
} }
for (let i = 0; i < WORD_LENGTH; i++) { for (let i = 0; i < WORD_LENGTH; i++) {
@ -159,10 +186,18 @@ function processKey(e) {
if (input[i] === word[j]) { if (input[i] === word[j]) {
hints[i] = "position"; hints[i] = "position";
used[j] = true; used[j] = true;
if (characters[pos][input[i]] !== "correct") {
characters[pos][input[i]] = "position";
}
break; break;
} }
} }
} }
for (let i = 0; i < WORD_LENGTH; i++) {
if (!characters[pos][input[i]]) {
characters[pos][input[i]] = "nope";
}
}
for (let i = 0; i < WORD_LENGTH; i++) { for (let i = 0; i < WORD_LENGTH; i++) {
const el = data[pos * MAX_GUESSES + guessed.length][i]; const el = data[pos * MAX_GUESSES + guessed.length][i];
if (hints[i] === "correct") { if (hints[i] === "correct") {
@ -183,6 +218,17 @@ function processKey(e) {
} }
saveLocalStorage(); saveLocalStorage();
input = ""; input = "";
for (let char in keys) {
const c = char.toUpperCase();
if (characters[0][c] || characters[1][c] || characters[2][c] || characters[3][c]) {
keys[char].style.background = makeGradient(characters[0][c], characters[1][c], characters[2][c], characters[3][c]);
if (characters[0][c] === "nope" && characters[1][c] === "nope" && characters[2][c] === "nope" && characters[3][c] === "nope") {
keys[char].style.opacity = "0.5";
} else {
keys[char].style.color = "#000";
}
}
}
if (guessed.length == MAX_GUESSES || done.indexOf(false) === -1) { if (guessed.length == MAX_GUESSES || done.indexOf(false) === -1) {
gameOver(); gameOver();
} }
@ -250,6 +296,7 @@ for (let i = 0; i < 3; i++) {
button.className = "key"; button.className = "key";
button.addEventListener("click", e => processKey({ key: c })); button.addEventListener("click", e => processKey({ key: c }));
row.appendChild(button); row.appendChild(button);
keys[c] = button;
} }
} }