slashinfty/race-timer.html

## race-timer.html
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Race Timer</title>
    <link href="https://fonts.googleapis.com/css2?family=Major+Mono+Display&display=swap" rel="stylesheet">
    <style>
        body {
            font-family: 'Major Mono Display', monospace;
            background-color: black;
            color: white;
            font-size: 10em;
        }
    </style>
    <script>
        document.addEventListener("DOMContentLoaded", () => {
            document.addEventListener('keyup', setTimer);
            function setTimer(e) {
                if (e.keyCode === 220) {
                    if (!running){
                        startTime = new Date().getTime();
                        tInterval = setInterval(getShowTime, 1000);
                        paused = 0;
                        running = 1;
                    } else if (!paused) {
                        clearInterval(tInterval);
                        savedTime = difference;
                        paused = 1;
                        running = 0;
                    }
                } else if (e.keyCode === 192) {
                    reset();
                }
            }
        });
        let startTime, updatedTime, difference, tInterval, savedTime;
        let paused = 0;
        let running = 0;

        const start = () => {
            if (!running) {
                startTime = new Date().getTime();
                tInterval = setInterval(getShowTime, 1000);
                paused = 0;
                running = 1;
            }
        };

        const pause = () => {
            if (!difference) {}
            else if (!paused) {
                clearInterval(tInterval);
                savedTime = difference;
                paused = 1;
                running = 0;
            } else {
	    	start();
            }
        };

        const reset = () => {
            clearInterval(tInterval);
            savedTime = 0;
            difference = 0;
            paused = 0;
            running = 0;
            document.getElementById("time").innerHTML = '00:00';
        };

        const getShowTime = () => {
            updatedTime = new Date().getTime();
            if (savedTime) difference = (updatedTime - startTime) + savedTime;
            else difference =  updatedTime - startTime;
            var seconds = Math.floor(difference / 1000);
            document.getElementById("time").innerHTML = ('0' + Math.floor(seconds / 60)).slice(-2) + ':' + ('0' + (seconds % 60)).slice(-2);;
        }
    </script>
</head>
<body>
    <div id="time">00:00</div>
</body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<title>Race Timer</title>
	<link href="https://fonts.googleapis.com/css2?family=Major+Mono+Display&display=swap" rel="stylesheet">
	<style>
	body {
	font-family: 'Major Mono Display', monospace;
	background-color: black;
	color: white;
	font-size: 10em;
	}
	</style>
	<script>
	document.addEventListener("DOMContentLoaded", () => {
	document.addEventListener('keyup', setTimer);
	function setTimer(e) {
	if (e.keyCode === 220) {
	if (!running){
	startTime = new Date().getTime();
	tInterval = setInterval(getShowTime, 1000);
	paused = 0;
	running = 1;
	} else if (!paused) {
	clearInterval(tInterval);
	savedTime = difference;
	paused = 1;
	running = 0;
	}
	} else if (e.keyCode === 192) {
	reset();
	}
	}
	});
	let startTime, updatedTime, difference, tInterval, savedTime;
	let paused = 0;
	let running = 0;

	const start = () => {
	if (!running) {
	startTime = new Date().getTime();
	tInterval = setInterval(getShowTime, 1000);
	paused = 0;
	running = 1;
	}
	};

	const pause = () => {
	if (!difference) {}
	else if (!paused) {
	clearInterval(tInterval);
	savedTime = difference;
	paused = 1;
	running = 0;
	} else {
	start();
	}
	};

	const reset = () => {
	clearInterval(tInterval);
	savedTime = 0;
	difference = 0;
	paused = 0;
	running = 0;
	document.getElementById("time").innerHTML = '00:00';
	};

	const getShowTime = () => {
	updatedTime = new Date().getTime();
	if (savedTime) difference = (updatedTime - startTime) + savedTime;
	else difference = updatedTime - startTime;
	var seconds = Math.floor(difference / 1000);
	document.getElementById("time").innerHTML = ('0' + Math.floor(seconds / 60)).slice(-2) + ':' + ('0' + (seconds % 60)).slice(-2);;
	}
	</script>
	</head>
	<body>
	<div id="time">00:00</div>
	</body>
	</html>