1 files changed, 152 insertions, 0 deletions
diff --git a/templates/template.html b/templates/template.html
new file mode 100644
index 0000000..4b20536
--- /dev/null
+++ b/templates/template.html
@@ -0,0 +1,152 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<title>Startpage</title>
+		<style type="text/css">
+			body {
+				background-color: grey;
+				background-image: none;
+				background-repeat: no-repeat;
+				background-position: center center;
+				background-attachment: fixed;
+
+				-moz-background-size: cover;
+				-o-background-size: cover;
+				background-size: cover;
+				transition: background-color 0.5s, background-image 0.5s;
+			}
+			a {
+				color: #eee;
+				text-decoration: none;
+			}
+			a:hover {
+				color: white;
+				text-decoration: underline;
+			}
+			* {
+				font-family: "DejaVu Sans Light", sans-serif;
+				color: white;
+			}
+			footer {
+				font-size: 8pt;
+			}
+			#yr_no_credit {
+				position: fixed;
+				display: inline-block;
+				bottom: 2mm;
+				left: 10mm;
+				background: black;
+			}
+			#imageinfo {
+				position: fixed;
+				bottom: 2mm;
+				right: 10mm;
+				background: black;
+			}
+			#weather {
+				position: fixed;
+				top: 10mm;
+				left: 10mm;
+			}
+			#temp {
+				position: absolute;
+				top: 30px;
+				left: 60px;
+				font-size:70px;
+				text-shadow: black 2px 2px;
+				color: white;
+			}
+			#links {
+				position: absolute;
+				top: 40%;
+				left: 20%;
+				columns: 2;
+				-moz-columns: 2;
+				padding: 5mm;
+				background: rgba(0,0,0,0.6);
+			}
+			#links ul {
+				padding: 0px;
+				margin: 0px;
+				list-style: none;
+			}
+			#links ul li {
+				padding: 0px;
+				margin: 0px;
+				font-size: 10pt;
+			}
+		</style>
+	</head>
+	<body {{ if .BgImage }} style="background-color: black; background-image: url(/bgimg);"{{ end }}>
+		{{ if .Weather }}
+			<div id="weather">
+				<a href="{{ .Weather.URL }}"><img src="{{ .Weather.Icon }}" alt="" /></a>
+				<span id="temp">{{ .Weather.Temp.Value }}°</span>
+			</div>
+		{{ end }}
+		{{ if .Links }}
+			<div id="links">
+				<ul>
+					{{ range .Links }}
+						<li><a href="{{ .URL }}">{{ .Title }}</a></li>
+					{{ end }}
+				</ul>
+			</div>
+		{{ end }}
+
+
+		<footer>
+			{{ if .Weather }}
+				<div id="yr_no_credit">Weather forecast from Yr, delivered by the Norwegian Meteorological Institute and NRK</div>
+			{{ end }}
+
+			<span id="imageinfo"></span>
+		</footer>
+
+		<script type="text/javascript">
+			var CanSaveBg = {{ .CanSaveBg }};
+
+			function link(href, text) {
+				var a = document.createElement("a");
+				a.href = href;
+				a.innerText = text;
+				return a;
+			}
+
+			function updateImageInfo(image) {
+				var imageinfo = document.getElementById("imageinfo");
+				imageinfo.innerHTML = "";
+				imageinfo.appendChild(link("http://reddit.com" + image.Permalink, image.Title));
+				if (CanSaveBg) {
+					imageinfo.appendChild(document.createTextNode(" | "));
+					if (image.Saved) {
+						imageinfo.appendChild(document.createTextNode("saved"));
+					} else {
+						imageinfo.appendChild(link("/savebg", "save"));
+					}
+				}
+			}
+
+			{{ if .BgImage }}
+				updateImageInfo({{ .BgImage }});
+			{{ end }}
+
+			var xhr = new XMLHttpRequest();
+			xhr.addEventListener("load", function () {
+				if (!xhr.response.Updated) {
+					return;
+				}
+
+				var bodyStyle = document.body.style;
+				bodyStyle.setProperty("background-image", "url(/bgimg?rand=" + Math.random() + ")");
+				bodyStyle.setProperty("background-color", "black");
+
+				updateImageInfo(xhr.response.Image);
+			});
+
+			xhr.open("GET", "/update-bgimg");
+			xhr.responseType = "json";
+			xhr.send();
+		</script>
+	</body>
+</html>