103 lines
2.6 KiB
JavaScript
103 lines
2.6 KiB
JavaScript
|
|
const states = {
|
|
GETKEYS: 'getkeys',
|
|
TRILLING: 'trilling',
|
|
READY: 'ready',
|
|
RESULT: 'result'
|
|
}
|
|
|
|
const colors = {
|
|
GETKEYS: 'gray',
|
|
TRILLING: 'crimson',
|
|
READY: 'darkgray',
|
|
RESULT: 'dodgerblue'
|
|
}
|
|
|
|
var state = states.GETKEYS;
|
|
var times = []
|
|
|
|
const max_count = 20;
|
|
|
|
var key1, key2;
|
|
var time_start;
|
|
var counter = 0;
|
|
|
|
function handle_press(e) {
|
|
switch (state) {
|
|
case states.GETKEYS: {
|
|
if (!key1) {
|
|
key1 = e.code;
|
|
|
|
area.style["background-color"] = colors.GETKEYS;
|
|
area.innerText = "Press 2nd key!";
|
|
} else {
|
|
key2 = e.code;
|
|
state = states.READY;
|
|
|
|
area.style["background-color"] = colors.READY;
|
|
area.innerText = "Test will start on first keypress.";
|
|
}
|
|
} break;
|
|
|
|
case states.READY: {
|
|
if (e.code == key1 || e.code == key2) {
|
|
state = states.TRILLING;
|
|
|
|
time_start = Date.now();
|
|
|
|
area.style["background-color"] = colors.TRILLING;
|
|
handle_press(e); // update couter/text for first keypress
|
|
}
|
|
} break;
|
|
|
|
case states.TRILLING: {
|
|
if (e.code == key1 || e.code == key2) {
|
|
counter++;
|
|
}
|
|
|
|
area.innerText = counter + "/" + max_count;
|
|
|
|
if (counter == max_count) {
|
|
state = states.RESULT;
|
|
|
|
counter = 0;
|
|
|
|
let time = parseInt((max_count / ((Date.now() - time_start) / 1000) * 60 / 4));
|
|
times.push(time);
|
|
|
|
let average = times.reduce((a, b) => a + b) / times.length;
|
|
|
|
document.getElementById("average").innerText = "Average: " + average + "bpm";
|
|
|
|
var li = document.createElement("li");
|
|
li.appendChild(document.createTextNode(time + "bpm"));
|
|
document.getElementById("times").appendChild(li);
|
|
|
|
area.style["background-color"] = colors.RESULT;
|
|
area.innerText = time + "bpm" + '\n(press space to try again)';
|
|
}
|
|
} break;
|
|
|
|
case states.RESULT: {
|
|
if (e.code == "Space") {
|
|
state = states.READY;
|
|
|
|
area.style["background-color"] = colors.READY;
|
|
area.innerText = "Test will start on first keypress.";
|
|
}
|
|
} break;
|
|
|
|
default:
|
|
break
|
|
}
|
|
}
|
|
|
|
window.onload = function () {
|
|
create_prologue();
|
|
|
|
area = document.getElementById("area");
|
|
area.innerText = "Press 1st key!";
|
|
|
|
document.addEventListener('keydown', handle_press);
|
|
}
|