111 lines
3.4 KiB
HTML
111 lines
3.4 KiB
HTML
<head>
|
|
<link rel="stylesheet" href="style.css">
|
|
<script src="jquery.min.js"></script>
|
|
</head>
|
|
<body>
|
|
<div id="container">
|
|
<table id="gameField">
|
|
|
|
</table>
|
|
</div>
|
|
|
|
|
|
<script>
|
|
let round = 0
|
|
let current = ""
|
|
|
|
let field = document.getElementById("gameField")
|
|
for (let i = 0; i < 16; i++) {
|
|
let row = `<tr class="row">`
|
|
for (let o = 0; o < 32; o++) {
|
|
row += (`<td class="field" id="field-${i}-${o}"></td>`)
|
|
}
|
|
field.innerHTML += (row + "</tr>")
|
|
}
|
|
|
|
|
|
document.addEventListener("keydown", (key)=>{
|
|
if(key.keyCode >= 65 && key.keyCode <= 70){
|
|
// Key Press for a letter
|
|
console.log(key.key);
|
|
addkey(key.key)
|
|
}
|
|
if(key.keyCode >= 48 && key.keyCode <= 57){
|
|
// Key Press for a number
|
|
console.log(key.key);
|
|
addkey(key.key)
|
|
}
|
|
if(key.keyCode == 13){
|
|
// Key Press for Enter
|
|
check()
|
|
console.log(key.key);
|
|
}
|
|
if(key.keyCode == 8){
|
|
// Key Press for Backspace
|
|
console.log(key.key);
|
|
removekey()
|
|
}
|
|
})
|
|
|
|
function addkey(key) {
|
|
if(current.length == 32)
|
|
return
|
|
document.getElementById(`field-${round}-${current.length}`).innerHTML = key
|
|
current += key
|
|
}
|
|
function removekey() {
|
|
if(current.length == 0)
|
|
return
|
|
current = current.substring(0, current.length - 1);
|
|
document.getElementById(`field-${round}-${current.length}`).innerHTML = ""
|
|
|
|
}
|
|
async function check(){
|
|
if(current.length == 32){
|
|
let response = await fetch("/guess", {
|
|
method: "POST",
|
|
body: JSON.stringify({
|
|
guess:current
|
|
}),
|
|
headers: {
|
|
"Content-type": "application/json; charset=UTF-8"
|
|
}
|
|
});
|
|
response = await response.json()
|
|
|
|
for (let i = 0; i < response.response.length; i++) {
|
|
switch (response.response[i]) {
|
|
case 0:
|
|
$(`#field-${round}-${i}`).addClass("letter-no")
|
|
break;
|
|
|
|
case 1:
|
|
$(`#field-${round}-${i}`).addClass("letter-wrong-position")
|
|
break;
|
|
|
|
case 2:
|
|
$(`#field-${round}-${i}`).addClass("letter-right-position")
|
|
break;
|
|
}
|
|
}
|
|
let count = 0
|
|
for (let i = 0; i < response.response.length; i++) {
|
|
if(response.response[i] == 2)
|
|
++count
|
|
}
|
|
|
|
++round
|
|
current = ""
|
|
if(count == 32){
|
|
alert("You win")
|
|
document.removeEventListener("keydown")
|
|
}
|
|
if(round == 16 && count != 32){
|
|
alert("You lost")
|
|
document.removeEventListener("keydown")
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
</body>
|