simon/quickdraw-game
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

QOL code

Browse Source
This commit is contained in:
simon
2026-08-07 23:35:25 -05:00
parent adb9390e89
commit 223e67c6b8
1 changed files with 20 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
quickdraw-game.html
+20 -16
View File
@@ -152,14 +152,14 @@
overflow: hidden;
}
body {
padding: .5rem .25rem;
padding: 1rem .5rem;
max-height: 80vh;
}
#target-frame {
width: 90%;
}
#text-frame {
margin-top: 1.25rem;
margin-top: 3rem;
}
#game-modes {
gap: .5rem;
@@ -265,6 +265,7 @@
let highScore = 0;
let targetsClicked = 0;
let numTargets = 0;
let preRoundText = "hold still on the circle, then click targets as fast as possible!";
// "NORMAL" MODE ONLY VARIABLES
let currentRound = 0;
@@ -460,7 +461,7 @@
}
// set game instruction text + fade it in
gameText.innerText = "hover on red circle to start the countdown, then click the targets as fast as possible!";
gameText.innerText = preRoundText;
gameText.style.opacity = "0";
gameText.style.display = "inline";
await sleep(500);
@@ -591,7 +592,7 @@
}
// set game instruction text + fade it in
gameText.innerText = "hover on red circle to start the countdown, then click as many targets as possible!";
gameText.innerText = preRoundText;
gameText.style.opacity = "0";
gameText.style.display = "inline";
await sleep(500);
@@ -701,43 +702,47 @@
/** HELPER TO KICK-OFF COUNTDOWNS FROM HOVER */
// this prevents countdown from continuing if user removes / reapplies hover while we're sleeping
function cancelCountdown(hoverNumber) {
return !hovering || (hoverNumber != hoverCount);
}
async function drawCountdown(hoverNumber) {
gameText.style.display = "none";
countingDown = true;
// this if-check prevents countdown from continuing if user removes / reapplies hover while we're sleeping
if (!hovering || hoverNumber != hoverCount) return false;
if (cancelCountdown(hoverNumber)) return false;
ready.style.display = "inline";
ready.style.opacity = "100";
await sleep(1000);
if (!hovering || hoverNumber != hoverCount) return false;
if (cancelCountdown(hoverNumber)) return false;
ready.style.display = "none";
ready.style.opacity = "0";
if (!hovering || hoverNumber != hoverCount) return false;
if (cancelCountdown(hoverNumber)) return false;
one.style.opacity = "0";
two.style.opacity = "0";
three.style.opacity = "0";
if (!hovering || hoverNumber != hoverCount) return false;
if (cancelCountdown(hoverNumber)) return false;
one.style.display = "inline";
two.style.display = "inline";
three.style.display = "inline";
if (!hovering || hoverNumber != hoverCount) return false;
if (cancelCountdown(hoverNumber)) return false;
three.style.opacity = "100";
await sleep(500);
if (!hovering || hoverNumber != hoverCount) return false;
if (cancelCountdown(hoverNumber)) return false;
two.style.opacity = "100";
await sleep(500);
if (!hovering || hoverNumber != hoverCount) return false;
if (cancelCountdown(hoverNumber)) return false;
one.style.opacity = "100";
await sleep(500);
if (!hovering || hoverNumber != hoverCount) return false;
if (cancelCountdown(hoverNumber)) return false;
one.style.display = "none";
two.style.display = "none";
three.style.display = "none";
@@ -755,7 +760,6 @@
return true;
}
function handleHoverEnd(e) {
hovering = false;
@@ -775,7 +779,7 @@
if (gamemode == "normal") {
if (currentRound == 1) {
gameText.innerText = "hover on red circle to start the countdown, then click the targets as fast as possible!";
gameText.innerText = preRoundText;
}
else {
gameText.innerText = "ROUND: " + roundSeconds.toFixed(3) + "s\nTOTAL: " + totalTime.toFixed(3) + "s\nhover on circle to start round " + currentRound;
@@ -783,7 +787,7 @@
}
else if (gamemode == "countdown") {
gameText.innerText = "hover on red circle to start the countdown, then click as many targets as possible!";
gameText.innerText = preRoundText;
}
gameText.style.display = "inline";