R167 · August 29, 2015 14:23
diff --git a/sf_clock.html b/sf_clock.html
 <!DOCTYPE html>
 <!--
 - Full screen clock (24-hour with seconds)
 - Copyright (c) 2015 Project Nayuki
 - 
 - http://www.nayuki.io/page/full-screen-clock-javascript
 -->
 <html style="display:block; height:100%; margin:0; padding:0">
 	<head>
 		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
 		<title>Clock</title>
 		<style type="text/css">
 			/* Customizable font and colors */
 			html {
 				background: #000000;
 			}
 			#clocktext {
 				font-family: sans-serif;
 				font-weight: bold;
 				color: #FFFFFF;
 			}
 		</style>
 	</head>
 	
 	<body style="display:table; width:100%; height:100%; margin:0; padding:0">
 		<div style="display:table-cell; width:100%; height:100%; text-align:center; vertical-align:middle">
 			<span id="clocktext" style="font-size:24pt; font-kerning:none"></span>
 		</div>
 		
 		<script type="text/javascript">
 			"use strict";
 			
 			var textElem = document.getElementById("clocktext");
 			var textNode = document.createTextNode("");
 			textElem.appendChild(textNode);
 			var curFontSize = 24;  // Do not change
 			
 			function updateClock() {
 				var n = new Date();
 				var utc = n.getTime() + (n.getTimezoneOffset() * 60000);
 				var d = new Date(utc + (3600000*-7));
 				var s = "";
 				s += (10 > d.getHours  () ? "0" : "") + d.getHours  () + ":";
 				s += (10 > d.getMinutes() ? "0" : "") + d.getMinutes() + ":";
 				s += (10 > d.getSeconds() ? "0" : "") + d.getSeconds();
 				textNode.data = s;
 				setTimeout(updateClock, 1000 - d.getTime() % 1000 + 20);
 			}
 			
 			function updateTextSize() {
 				var targetWidth = 0.9;  // Proportion of full screen width
 				for (var i = 0; 3 > i; i++) {  // Iterate for better better convergence
 					var newFontSize = textElem.parentNode.offsetWidth * targetWidth / textElem.offsetWidth * curFontSize;
 					textElem.style.fontSize = newFontSize.toFixed(3) + "pt";
 					curFontSize = newFontSize;
 				}
 			}
 			
 			updateClock();
 			updateTextSize();
 			window.addEventListener("resize", updateTextSize);
 		</script>
 	</body>
 </html>
	<!DOCTYPE html>
	<!--
	- Full screen clock (24-hour with seconds)
	- Copyright (c) 2015 Project Nayuki
	-
	- http://www.nayuki.io/page/full-screen-clock-javascript
	-->
	<html style="display:block; height:100%; margin:0; padding:0">
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
	<title>Clock</title>
	<style type="text/css">
	/* Customizable font and colors */
	html {
	background: #000000;
	}
	#clocktext {
	font-family: sans-serif;
	font-weight: bold;
	color: #FFFFFF;
	}
	</style>
	</head>

	<body style="display:table; width:100%; height:100%; margin:0; padding:0">
	<div style="display:table-cell; width:100%; height:100%; text-align:center; vertical-align:middle">
	<span id="clocktext" style="font-size:24pt; font-kerning:none"></span>
	</div>

	<script type="text/javascript">
	"use strict";

	var textElem = document.getElementById("clocktext");
	var textNode = document.createTextNode("");
	textElem.appendChild(textNode);
	var curFontSize = 24; // Do not change

	function updateClock() {
	var n = new Date();
	var utc = n.getTime() + (n.getTimezoneOffset() * 60000);
	var d = new Date(utc + (3600000*-7));
	var s = "";
	s += (10 > d.getHours () ? "0" : "") + d.getHours () + ":";
	s += (10 > d.getMinutes() ? "0" : "") + d.getMinutes() + ":";
	s += (10 > d.getSeconds() ? "0" : "") + d.getSeconds();
	textNode.data = s;
	setTimeout(updateClock, 1000 - d.getTime() % 1000 + 20);
	}

	function updateTextSize() {
	var targetWidth = 0.9; // Proportion of full screen width
	for (var i = 0; 3 > i; i++) { // Iterate for better better convergence
	var newFontSize = textElem.parentNode.offsetWidth * targetWidth / textElem.offsetWidth * curFontSize;
	textElem.style.fontSize = newFontSize.toFixed(3) + "pt";
	curFontSize = newFontSize;
	}
	}

	updateClock();
	updateTextSize();
	window.addEventListener("resize", updateTextSize);
	</script>
	</body>
	</html>