let startTime;
let clicks = 0;
let cps = 0;
let intervalId;

document.getElementById('start-button').addEventListener('click', startTest);

function startTest() {
    startTime = new Date().getTime();
    intervalId = setInterval(updateTimer, 1000);
    document.getElementById('start-button').classList.add('active');
    document.getElementById('start-button').innerHTML = '';
    document.getElementById('click-counter').innerHTML = '0';
    document.addEventListener('click', countClick);
}

function updateTimer() {
    let currentTime = new Date().getTime();
    let timeElapsed = currentTime - startTime;
    let secondsRemaining = 15 - Math.floor(timeElapsed / 1000);
    let minutesRemaining = Math.floor(secondsRemaining / 60);
    let secondsRemainingDisplay = secondsRemaining % 60;
    document.getElementById('timer').innerHTML = `${minutesRemaining}:${secondsRemainingDisplay.toString().padStart(2, '0')}`;
    if (secondsRemaining <= 0) {
        endTest();
    }
}

function countClick() {
    clicks++;
    document.getElementById('click-counter').innerHTML = clicks.toString();
    cps = clicks / (new Date().getTime() - startTime) * 1000;
    document.getElementById('cps-display').innerHTML = `Clicks Per Second: ${cps.toFixed(2)}`;
}

function endTest() {
    clearInterval(intervalId);
    document.getElementById('cps-display').innerHTML = `Total Clicks Per Second: ${cps.toFixed(2)}`;
    document.removeEventListener('click', countClick);
}