-
Notifications
You must be signed in to change notification settings - Fork 0
/
docs.html
130 lines (116 loc) · 4.09 KB
/
docs.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
<!DOCTYPE html>
<html>
<script src="static/dist/jquery/jquery.min.js"></script>
<script src="static/dist/semantic-ui/semantic.min.js"></script>
<link rel="stylesheet" type="text/css" href="static/dist/semantic-ui/semantic.min.css" />
<link rel="stylesheet" href="static/stylesheets/markdown.css" />
<style>
.markdown-body {
box-sizing: border-box;
min-width: 200px;
max-width: 980px;
margin: 0 auto;
padding: 10px 10px 10px 30px;
}
@media (max-width: 767px) {
.markdown-body {
padding: 15px;
}
}
</style>
<body>
<div class="ui container">
<div class="ui huge menu" style="border-radius: 0;">
<a href="index.html" class="item"><h1>AirPPT</h1></a> <a class="item active">Docs</a>
<a class="item" href="https://github.com/airpptx">Github</a> <a class="item" href="https://www.npmjs.com/package/airppt">NPMJS</a>
</div>
<div class="ui stackable grid">
<div class="four wide column">
<div class="ui segment">
<ol class="ui list" id="tableOfContents">
<li><a href="#getting-started">Get Started</a></li>
<li><a href="#limitations">Limitations</a></li>
<li><a href="#shape-renderer-1">Debug and Understand Renderers</a></li>
<li><a href="#shape-renderer-2">Write your Own Shape Renderer</a></li>
</ol>
</div>
</div>
<div class="twelve wide column">
<div class="ui warning message">
<h4>Note: I'm working on other projects. Always happy to help if this project catches your eye. Please be wary of any errors, typos and broken links.</h4>
<p>
Open an issue or PR in <a href="https://github.com/airpptx/airpptx.github.io">github</a> with questions or problems in the
docs.
</p>
</div>
<div id="document" class="markdown-body"></div>
</div>
</div>
</div>
</body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/showdown/1.9.0/showdown.min.js"></script>
<script>
loadtemplates();
$(document).ready(function() {
// executes when HTML-Document is loaded and DOM is ready
var hash = window.location.hash.substr(1);
determineDocPage(hash);
});
function determineDocPage(hash) {
switch (hash) {
case "getting-started":
loadtemplates("docs/getstarted.md");
break;
case "limitations":
loadtemplates("docs/limitations.md");
break;
case "shape-renderer-1":
loadtemplates("docs/shape-renderer-1.md");
break;
case "shape-renderer-2":
loadtemplates("docs/shape-renderer-2.md");
break;
default:
loadtemplates("docs/getstarted.md");
}
}
async function loadtemplates(markdownPath) {
let mdDocument = await $.get(markdownPath);
var converter = new showdown.Converter({ tables: true }),
text = mdDocument,
html = converter.makeHtml(text);
$("#document").html(html);
}
$(window).on("hashchange", function(e) {
//render a new template based on the hashchange
console.log(e);
var hash = window.location.hash.substr(1);
console.log(hash);
determineDocPage(hash);
});
/* //parse the headers
function generateOrderedListFromHeaders(listOfHeaders){
console.log(listOfHeaders);
for(var i = 0; i < listOfHeaders.length; i++){
let element = listOfHeaders[i];
let nextElement = listOfHeaders[i+1];
console.log(element.nodeName)
let nestedCounter = 0;
if(nextElement.nodeName > element.nodeName){
console.log(element.innerText)
nestedCounter++;
$("#tableOfContents").append("<li>" + element.innerText + "</li>")
return;
}
if(nextElement.nodeName < element.nodeName){
console.log(element.innerText)
nestedCounter--;
$("#tableOfContents").append("<li>" + element.innerText + "</li>")
return;
}
$("#tableOfContents").append("<li>" + element.innerText + "</li>")
}
//for each header create a more nested level
}*/
</script>
</html>