From 1632bd737792953138865d99494051922d47c266 Mon Sep 17 00:00:00 2001 From: rbozek Date: Thu, 4 Jan 2024 00:04:06 -0500 Subject: [PATCH] add basic timer functionality - variables, a few functions --- js/app.js | 33 +++++++++++++++++++++++++++++++-- 1 file changed, 31 insertions(+), 2 deletions(-) diff --git a/js/app.js b/js/app.js index 37496c7..09f7bc5 100644 --- a/js/app.js +++ b/js/app.js @@ -13,7 +13,8 @@ let playerScore = 0 // can reset in init or render let currentQuesIdx = 0 let currQuesCorrAnsIdx // for playerChooseAnswer let currentCategory // to fix problem in renderQUestion & playerCHoice - +let timeLeft = 80 // TIMER +let timerSeconds, timerInterval /*---- Cached Element References ----*/ const btnCategory1 = document.getElementById("btn-category-1") @@ -26,16 +27,44 @@ const rulesBtnDiv = document.getElementById("rules-btn-container") let initialState = rulesBtnDiv.innerHTML; // for eventual game reset const playerScoreContainer = document.getElementById("player-score") let initialScoreState = playerScoreContainer.innerHTML; -const countdown = document.getElementById("countdown") +const countdown = document.getElementById("countdown") // TIMER /*--------- Event Listeners ---------*/ btnCategory1.addEventListener('click', renderQuestionCat1) +btnCategory1.addEventListener('click', startTimer) // TIMER btnCategory2.addEventListener('click', renderQuestionCat2) +btnCategory2.addEventListener('click', startTimer) // TIMER btnCategory3.addEventListener('click', renderQuestionCat3) +btnCategory3.addEventListener('click', startTimer) // TIMER btnReset.addEventListener('click', reset) /*------------ Functions ------------*/ +// let startTimer = setInterval(function() { +// countdown.textContent = timeLeft + ' seconds remaining.' +// timeLeft -= 1 +// if (timeLeft < 0) { +// countdownEl.textContent = 'Finished!' +// confetti.start(500) +// } +// }, 1000) + +function startTimer() { + // Reset the timer + timerSeconds = 80; + // Set up the interval to update the timer every second + timerInterval = setInterval(updateTimer, 1000); +} +function updateTimer() { + countdown.textContent = `Time: ${timerSeconds}s`; + timerSeconds -= 1; +} +function stopTimer() { + // Clear the interval to stop the timer + clearInterval(timerInterval); +} + + function renderQuestionCat1() { rulesBtnDiv.innerHTML = '' currentCategory = 1 // to fix problem at end of playerChooseAnswer