Hej mam problem z małą grą którą robię a mianowicie to że nie działa mi funkcja removeImage oraz drawImage (chyba?), robią one to że jak królik nie zostnie kliknięty przez 4 sekundy to powinien zniknąć a tego nie robi, również to że nie pojawia się z powrotem po 5 sekundach po tym jak zniknie.
Proszę o pomoc bo już mi ręce opadają, nie mam pomysłu co mam źle zrobione.
Tutaj ten kawałek kodu który nie działa:
} else if(trudnosc_licz === 1) {
canvas.style.backgroundImage = "url(zdj/planszagry_latwe.jpg)";
let dziala = false;
let imageDisplayed = false;
let canClick = true;
let wyn = 0;
if (!dziala) {
const ctx = canvas.getContext("2d");
const image1 = new Image();
image1.src = "zdj/krolik.png";
function drawImage() {
ctx.clearRect(0, 0, canvas.width, canvas.height);
ctx.drawImage(image1, 95, 160);
ctx.font = "italic bold 50px Arial";
ctx.fillText("Wynik: " + wyn, 10, 60);
imageDisplayed = true;
}
function removeImage() {
if (!canClick && imageDisplayed) {
ctx.clearRect(0, 0, canvas.width, canvas.height);
imageDisplayed = false;
}
}
function displayImageDelayed() {
setTimeout(() => {
if (!imageDisplayed) {
drawImage();
setTimeout(() => {
removeImage();
}, 4000);
}
}, 2000);
}
image1.addEventListener("load", () => {
displayImageDelayed();
});
canvas.addEventListener('click', function(event) {
if (canClick && imageDisplayed) {
var x = event.offsetX;
var y = event.offsetY;
if (x >= 95 && x <= 95 + image1.width && y >= 160 && y <= 160 + image1.height) {
wyn -= 10;
canClick = false;
let wyn_kon = wyn;
ctx.clearRect(0, 0, canvas.width, canvas.height);
ctx.font = "italic bold 50px Arial";
ctx.fillText("Wynik: " + wyn_kon, 10, 60);
setCookie('Ostatni_wyn', wyn_kon, 365, '/', 'example.com', true);
if (rek_Cookie && ost_Cookie) {
if (showCookie('Rekord') < wyn_kon) {
setCookie('Rekord', wyn_kon, 365, '/', 'example.com', true);
}
} else {
setCookie('Rekord', wyn_kon, 365, '/', 'example.com', true);
}
}
}
});
}
}