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

resizing / page reset is much cleaner and words fully with normal mode

Browse Source
This commit is contained in:
simon
2026-08-02 21:33:03 -05:00
parent 88c8dca057
commit 44a8332e29
1 changed files with 32 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files
quickdraw-game.html
+25 -26
View File
@@ -188,9 +188,9 @@
</div>
<div id="normal-sub-modes" class="button-container hidden fade">
<button id="normal-3-rounds" onclick="setNormalRounds(3)">3 rounds</button>
<button id="normal-6-rounds" onclick="setNormalRounds(6)">6 rounds</button>
<button id="normal-10-rounds" onclick="setNormalRounds(10)">10 rounds</button>
<button id="normal-3-rounds" onclick="setupNormalMode(3)">3 rounds</button>
<button id="normal-6-rounds" onclick="setupNormalMode(6)">6 rounds</button>
<button id="normal-10-rounds" onclick="setupNormalMode(10)">10 rounds</button>
</div>
<!-- pre-round text -->
@@ -247,11 +247,13 @@
// "NORMAL" MODE ONLY VARIABLES
let currentRound = 0;
let maxNormalRounds = 0;
let totalTime = 0.0;
let roundSeconds = 0.0;
let roundTimeStart = 0;
let roundTimeEnd = 0;
let bestNormalTime = 0;
let normalBullseyeNeeded = false;
// "COUNTDOWN" MODE ONLY VARIABLES
let countdownBullseyeNeeded = false;
@@ -329,10 +331,7 @@
async function handleNormalMode(e) {
gamemode = "normal";
// ensure mode parameters are reset
currentRound = 1;
totalTime = 0;
normalBullseyeNeeded = true;
await fadeMainMenuOut();
@@ -340,13 +339,17 @@
normalSubModes.style.opacity = "100";
}
function setNormalRounds(numRounds) {
function setupNormalMode(numRounds) {
// fade buttons out
normalSubModes.style.opacity = "0";
sleep(500);
normalSubModes.style.display = "none";
// ensure mode parameters are [re]set
currentRound = 1;
maxNormalRounds = numRounds;
totalTime = 0;
beginNormalMode();
}
@@ -376,6 +379,7 @@
return;
}
targetsClicked = 0;
if (roundNumber == maxNormalRounds) {
numTargets = roundNumber * 2;
}
@@ -386,8 +390,8 @@
// effectively begin the round
console.log("starting round " + roundNumber);
center.remove();
normalBullseyeNeeded = false;
targetsClicked = 0;
roundTimeStart = Date.now();
randomTargetGenerator(numTargets);
@@ -400,11 +404,9 @@
roundSeconds = (roundTimeEnd - roundTimeStart) / 1000;
totalTime += roundSeconds;
currentRound++;
// auto-reset bullseye if page gets resized at all
if (needsResizeAdjustment) {
handlePageResize();
setParameters();
}
// ensure "DRAW" isn't still lingering on screen after round
@@ -446,6 +448,9 @@
center.addEventListener("mouseover", handleHoverStart);
center.addEventListener("mouseleave", handleHoverEnd);
center.addEventListener("touchend", handleHoverEnd);
normalBullseyeNeeded = true;
currentRound++;
}
gameText.style.display = "inline";
@@ -721,25 +726,18 @@ async function handlePlayAgain(e) {
frameElement.replaceChildren();
setParameters();
// if at main menu, resize bullseye
// if at main menu, move bullseye
if (gamemode == "") {
center.remove();
center = generateTarget(xFrameAdjustment, yFrameAdjustment);
center.id = "center";
document.body.insertAdjacentElement("afterbegin", center);
center.style.top = yFrameAdjustment + "px";
center.style.left = xFrameAdjustment + "px";
drawCircle(0);
}
// if inbetween gameplay rounds, move middle circle and add game event listener
else if ((gamemode == "normal" && currentRound < 4) ||
// if inbetween gameplay rounds, move bullseye w/ game event listener
else if ((gamemode == "normal" && normalBullseyeNeeded) ||
(gamemode == "countdown" && countdownBullseyeNeeded)
) {
center.remove();
center = generateTarget(xFrameAdjustment, yFrameAdjustment);
center.id = "center";
document.body.insertAdjacentElement("afterbegin", center);
center.addEventListener("mouseover", handleHoverStart);
center.addEventListener("mouseleave", handleHoverEnd);
center.addEventListener("touchend", handleHoverEnd);
center.style.top = yFrameAdjustment + "px";
center.style.left = xFrameAdjustment + "px";
}
console.log('page: ' + pageWidth + ' x ' + pageHeight);
@@ -806,6 +804,7 @@ async function handlePlayAgain(e) {
title2.style.opacity = "0";
gameModes.style.opacity = "0";
await sleep(500);
frame.replaceChildren();
titleContainer.style.display = "none";
gameModes.style.display = "none";