<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<script src="script.js"></script>
</head>
<body>
<h1>HTML5 local storage timer</h1>
<p>Uses HTML5 localStorage to record the first time this page is loaded, and counts the seconds thereafter</p>
<div id="timerLabel">Loading...</div>
<button onclick="resetStartTime()">Reset</button>
</body>
</html>
// Code goes here
function resetStartTime() {
startTime = new Date();
window.localStorage.setItem('startTime', startTime);
return startTime;
}
document.addEventListener('DOMContentLoaded', function(event) {
// get timestamp
startTime = new Date(window.localStorage.getItem('startTime') || resetStartTime());
// start timer
window.setInterval(function() {
var secsDiff = new Date().getTime() - startTime.getTime();
document.getElementById('timerLabel').innerText = Math.floor(secsDiff / 1000) + ' seconds elapsed.';
}, 1000);
});
/* Styles go here */