Skip to content

Commit 4ec6df8

Browse files
committed
Custom Markdown preview template
1 parent b197515 commit 4ec6df8

File tree

1 file changed

+54
-0
lines changed

1 file changed

+54
-0
lines changed

markdown-preview-template.html

+54
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="utf-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1, minimal-ui">
6+
<title>Markdown preview</title>
7+
<link href="http://aaronbieber.com/assets/styles/github-markdown.css" rel="stylesheet"></link>
8+
<style>
9+
code.json {
10+
line-height: 1.2em;
11+
}
12+
#markdown-body {
13+
margin: 1em 5em;
14+
}
15+
</style>
16+
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
17+
<script>
18+
(function($, undefined) {
19+
var socket = new WebSocket("ws://localhost:7379");
20+
socket.onopen = function() {
21+
console.log("Connection established.");
22+
};
23+
socket.onclose = function(event) {
24+
if (event.wasClean) {
25+
alert('Connection closed gracefully.');
26+
} else {
27+
alert('Connection terminated.');
28+
}
29+
console.log('Code: ' + event.code + ' reason: ' + event.reason);
30+
};
31+
socket.onmessage = function(event) {
32+
loadCSS($(event.data).find("#style").text());
33+
$("#markdown-body").html($(event.data).find("#content").html());
34+
var scroll = $(document).height() * ($(event.data).find("#position-percentage").html() / 100);
35+
$("html, body").animate({ scrollTop: scroll }, 600);
36+
};
37+
socket.onerror = function(error) {
38+
alert("Error: " + error.message);
39+
};
40+
41+
loadCSS = function(href) {
42+
var cssLink = $("<link rel='stylesheet' type='text/css' href='"+href+"'>");
43+
$("link[rel='stylesheet']").remove();
44+
$("head").append(cssLink);
45+
};
46+
})(jQuery);
47+
</script>
48+
</head>
49+
<body class="markdown-body">
50+
<article id="markdown-body">
51+
<p>Markdown preview</p>
52+
</article>
53+
</body>
54+
</html>

0 commit comments

Comments
 (0)