Added very basic 2 minute countdown timer logic.

This commit is contained in:
Max Stevenson 2020-06-09 17:54:13 +01:00
parent a155c0685b
commit c92c8d074a
2 changed files with 30 additions and 1 deletions

View File

@ -346,7 +346,11 @@
<div class="outer-edge__dark">
<div class="inner-edge__dark">
<div class="instructions-header__container">
<h1>Timer</h1>
<h1 id="test">Countdown Clock</h1>
<div id="countdown-timer">
<span id="countdown-timer__display"></span>
</div>
<button id="start-timer">Start</button>
</div>
</div>
</div>
@ -354,4 +358,5 @@
</div>
</div>
</body>
<script type="text/javascript" src="./public/scripts/app.js"></script>
</html>

24
public/scripts/app.js Normal file
View File

@ -0,0 +1,24 @@
function startTimer(duration, display) {
var timer = duration,
minutes,
seconds;
setInterval(function() {
minutes = parseInt(timer / 60, 10);
seconds = parseInt(timer % 60, 10);
minutes = minutes < 10 ? "0" + minutes : minutes;
seconds = seconds < 10 ? "0" + seconds : seconds;
display.textContent = minutes + ":" + seconds;
if (--timer < 0) {
timer = duration;
}
}, 1000);
}
document.getElementById("start-timer").addEventListener("click", () => {
var twoMinutes = 60 * 2,
display = document.getElementById("countdown-timer__display");
startTimer(twoMinutes, display);
});