changeset 1285:fad40fe3282d

add personal web tools
author Franklin Schmidt <fschmidt@gmail.com>
date Wed, 26 Dec 2018 14:11:08 -0700
parents 1b46c8e6c647
children 9eb3a9724853
files website/src/fschmidt/dimensions.html website/src/fschmidt/stopwatch.html
diffstat 2 files changed, 115 insertions(+), 0 deletions(-) [+]
line wrap: on
line diff
diff -r 1b46c8e6c647 -r fad40fe3282d website/src/fschmidt/dimensions.html
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/website/src/fschmidt/dimensions.html	Wed Dec 26 14:11:08 2018 -0700
@@ -0,0 +1,19 @@
+<!doctype html>
+<html>
+	<head>
+		<meta name="viewport" content="width=device-width, initial-scale=1">
+		<script>
+			function p() {
+				document.body.innerText = ''
+					+ window.innerWidth + 'px innerWidth\n' 
+					+ window.innerHeight + 'px innerHeight\n'
+					+ '\n'
+					+ window.outerWidth + 'px outerWidth\n' 
+					+ window.outerHeight + 'px outerHeight\n'
+				;
+			}
+		</script>
+	</head>
+	<body onload="p()" onresize="p()">
+	</body>
+</html>
diff -r 1b46c8e6c647 -r fad40fe3282d website/src/fschmidt/stopwatch.html
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/website/src/fschmidt/stopwatch.html	Wed Dec 26 14:11:08 2018 -0700
@@ -0,0 +1,96 @@
+<!doctype html>
+<html>
+	<head>
+		<meta name="viewport" content="width=device-width, initial-scale=1">
+		<style>
+			button {
+				cursor: pointer;
+				font-size: 1em;
+				border-radius: 6px;
+				display: none;
+			}
+			button:focus {
+				outline: inherit;
+			}
+		</style>
+		<script>
+
+			function now() {
+				return Math.floor(Date.now()/1000);
+			}
+
+			function showTime() {
+				var start = localStorage.start;
+				var time;
+				if( !start ) {
+					time = 0;
+				} else {
+					var stop = localStorage.stop || now();
+					time = stop - start;
+				}
+				var seconds = time % 60;
+				time = Math.floor(time/60);
+				var minutes = time % 60;
+				time = Math.floor(time/60);
+				var hours = time;
+				seconds = ("0"+seconds).slice(-2);
+				minutes = ("0"+minutes).slice(-2);
+				time = hours + ":" + minutes + ":" + seconds;
+				document.querySelector('[time]').innerHTML = time;
+			}
+
+			function fixButtons() {
+				var isRunning = localStorage.start && !localStorage.stop;
+				if( isRunning ) {
+					document.querySelector('[start]').style.display = 'none';
+					document.querySelector('[stop]').style.display = 'inline-block';
+					document.querySelector('[reset]').style.display = 'none';
+				} else {
+					document.querySelector('[start]').style.display = 'inline-block';
+					document.querySelector('[stop]').style.display = 'none';
+					if( localStorage.start ) {
+						document.querySelector('[reset]').style.display = 'inline-block';
+					} else {
+						document.querySelector('[reset]').style.display = 'none';
+					}
+				}
+			}
+
+			function start() {
+				var stop = localStorage.stop;
+				if( !stop ) {
+					localStorage.start = now();
+				} else {
+					localStorage.removeItem("stop");
+					localStorage.start = now() - (stop - localStorage.start);
+				}
+				fixButtons();
+			}
+
+			function stop() {
+				localStorage.stop = now();
+				fixButtons();
+			}
+
+			function reset() {
+				localStorage.removeItem("start");
+				localStorage.removeItem("stop");
+				showTime();
+				fixButtons();
+			}
+
+			function loaded() {
+				showTime();
+				fixButtons();
+				setInterval(showTime,1000);
+			}
+
+		</script>
+	</head>
+	<body onload="loaded()">
+		<h1 time></h1>
+		<button start onclick="start()">start</button>
+		<button stop onclick="stop()">stop</button>
+		<button reset onclick="reset()">reset</button>
+	</body>
+</html>