From 63621d0f9bceb7fa6309076e8c1be1ad37175d25 Mon Sep 17 00:00:00 2001
From: Matt Baer <matt@write.as>
Date: Thu, 8 Oct 2020 09:30:57 -0400
Subject: [PATCH] Move Markdown preview page to template

---
 markdown.html       | 70 -----------------------------------------------------
 pages/markdown.tmpl | 67 ++++++++++++++++++++++++++++++++++++++++++++++++++
 server.go           |  1 +
 3 files changed, 68 insertions(+), 70 deletions(-)
 delete mode 100644 markdown.html
 create mode 100644 pages/markdown.tmpl
diff --git a/markdown.html b/markdown.html
deleted file mode 100644
index 14aab61..0000000
--- a/markdown.html
+++ /dev/null
@@ -1,70 +0,0 @@
-<html>
-<head>
-	<title>Markdown preview demo</title>
-
-	<link rel="stylesheet" type="text/css" href="https://write.as/css/write.354bde4c8aba9afdc8e24.css" />
-
-	<style>
-	h1#markdown {
-		margin: 1em 0;
-	}
-	textarea {
-		margin: 2em 0 1em;
-		min-height: 10em;
-		font-size: 1em;
-		border: 1px solid #ccc !important;
-		padding: 1em;
-		border-radius: 0.25em;
-		resize: vertical;
-	}
-	</style>
-	
-	<script>
-		function preview() {
-			var $submit = document.querySelector('input[type=submit]');
-			$submit.disabled = true;
-			$submit.value = '...';
-			var http = new XMLHttpRequest();
-			var url = "https://write.as/api/markdown";
-			var params = {
-				"raw_body": document.querySelector('#writer').value,
-			}
-			http.open("POST", url, true);
-			http.setRequestHeader("Content-type", "application/json");
-			http.onreadystatechange = function() {
-				if (http.readyState == 4) {
-					$submit.disabled = false;
-					$submit.value = 'Preview';
-					if (http.status == 200) {
-						data = JSON.parse(http.responseText);
-						document.querySelector('#preview').innerHTML = data.data.body;
-					} else {
-						alert("Failed: "+http.status);
-					}
-				}
-			}
-			http.send(JSON.stringify(params));
-		}
-	</script>
-</head>
-<body id="post">
-	<div class="content-container tight" style="margin-bottom: 0;">
-		<h1 id="markdown">Markdown Preview</h1>
-		<p>This uses the Write.as / WriteFreely API to generate HTML from the given Markdown content.</p>
-		<p><a href="https://developers.write.as/docs/api/#render-markdown">Read the documentation</a>.</p>
-	</div>
-
-	<div class="content-container">
-		<form method="post" action="https://write.as/api/markdown" onsubmit="preview(); return false;">
-			<textarea id="writer" name="raw_body" placeholder="Write..." class="norm" autofocus># Test out some Markdown
-
-Enter anything here and press **Preview** to see what it looks like.</textarea>
-			<input type="submit" value="Preview" />
-		</form>
-	</div>
-
-	<hr />
-
-	<article class="norm h-entry" id="preview"></article>
-</body>
-</html>
diff --git a/pages/markdown.tmpl b/pages/markdown.tmpl
new file mode 100644
index 0000000..6578bcd
--- /dev/null
+++ b/pages/markdown.tmpl
@@ -0,0 +1,67 @@
+{{define "head"}}<title>Markdown Preview</title>
+<style type="text/css">
+	h1#markdown {
+		margin: 1em 0;
+	}
+	textarea {
+		margin: 2em 0 1em;
+		min-height: 10em;
+		font-size: 1em;
+		border: 1px solid #ccc !important;
+		padding: 1em;
+		border-radius: 0.25em;
+		resize: vertical;
+	}
+</style>
+
+<script>
+    function preview() {
+        var $submit = document.querySelector('input[type=submit]');
+        $submit.disabled = true;
+        $submit.value = '...';
+        var http = new XMLHttpRequest();
+        var url = "https://write.as/api/markdown";
+        var params = {
+            "raw_body": document.querySelector('#writer').value,
+        }
+        http.open("POST", url, true);
+        http.setRequestHeader("Content-type", "application/json");
+        http.onreadystatechange = function() {
+            if (http.readyState == 4) {
+                $submit.disabled = false;
+                $submit.value = 'Preview';
+                if (http.status == 200) {
+                    data = JSON.parse(http.responseText);
+                    document.querySelector('#preview').innerHTML = data.data.body;
+                } else {
+                    alert("Failed: "+http.status);
+                }
+            }
+        }
+        http.send(JSON.stringify(params));
+    }
+</script>
+{{end}}
+
+{{define "body-attrs"}}id="post"{{end}}
+
+{{define "content"}}
+	<div class="content-container tight" style="margin-bottom: 0;">
+		<h1 id="markdown">Markdown Preview</h1>
+		<p>This uses the Write.as / WriteFreely API to generate HTML from the given Markdown content.</p>
+		<p><a href="https://developers.write.as/docs/api/#render-markdown">Read the documentation</a>.</p>
+	</div>
+
+	<div class="content-container">
+		<form method="post" action="https://write.as/api/markdown" onsubmit="preview(); return false;">
+				<textarea id="writer" name="raw_body" placeholder="Write..." class="norm" autofocus># Test out some Markdown
+
+Enter anything here and press **Preview** to see what it looks like.</textarea>
+			<input type="submit" value="Preview" />
+		</form>
+	</div>
+
+	<hr />
+
+	<article class="norm h-entry" id="preview"><p style="display: block; text-align:center; font-style:italic; color:#999;">(Post preview will appear here.)</p></article>
+{{end}}
\ No newline at end of file
diff --git a/server.go b/server.go
index cde066d..b8a2cbf 100644
--- a/server.go
+++ b/server.go
@@ -22,6 +22,7 @@ func main() {
 
 	// Add routes
 	r := mux.NewRouter()
+	r.HandleFunc("/{page:[a-z]+}", viewPage)
 	r.HandleFunc("/", viewPage)
 	r.PathPrefix("/").Handler(http.FileServer(http.Dir(staticDir)))
 
