RoundTimer
Path out your rounds templates, then place them on a timeline. Set to repeat n or forever until done.
by Sam Fereday
HTML
<div id="output"></div>
<button id="start">
Start
</button>
<button id="stop">
Stop
</button>
JavaScript
// ------- To integrate: https://infernojs.org/
// ------- Doesn't work with bad browsers. Quite happy with that. //
let output = document.getElementById("output");
// const ok here?
const gameloop = (function() {
'use strict';
let reqAnimFrame = window.requestAnimationFrame ||
window.webkitRequestAnimationFrame ||
window.mozRequestAnimationFrame;
let stopped = false;
let running = false;
function update(callback) {
if(stopped) stopped = false;
if(running) return;
running = true;
let lastUpdate = +new Date();
(function loop() {
if(stopped) return;
callback(((+new Date()) - lastUpdate) / 1000);
reqAnimFrame(loop);
lastUpdate = +new Date();
}());
};
function stop()
{
stopped = true;
running = false;
}
return {
start: update,
stop: stop
}
}());
// ------ //
function logger(str)
{
output.innerHTML = str;
}
logger( "0.00" );
// ...
let rounds = [{
'roundTime': 30000
},
{
'roundTime': 10000
}];
let repeatTimes = 2;
// ...
function getNewTime(n)
{
return new Date().setTime(new Date().getTime() + n);
}
// ...
document.getElementById("start").addEventListener('click', function(){
let currentRepeatIndex = 0;
let currentRoundIndex = 0;
// blank out start button if running, reset all if stop hit.
let finish = getNewTime(rounds[currentRoundIndex].roundTime);
gameloop.start(function(a){
currentTime = new Date().getTime();
if(currentTime - finish > 0) {
if(currentRoundIndex >= rounds.length - 1) {
currentRepeatIndex += 1;
currentRoundIndex = 0;
} else {
currentRoundIndex += 1;
}
if(currentRepeatIndex > repeatTimes - 1) {
gameloop.stop();
logger( "Circuits left: 0 Current round: " + currentRoundIndex + " Time Left: 0.00" );
}
finish =...