-
Notifications
You must be signed in to change notification settings - Fork 2
/
readme-reader.html
90 lines (71 loc) · 2.51 KB
/
readme-reader.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
<!doctype html>
<html lang=en>
<head>
<meta name=viewport content=width=device-width>
<meta charset=utf-8>
</head>
<body>
<script src=http://jaanga.github.io/libs/md/showdown.js ></script>
<script>
// Theo Armour ~ 2014-02-17
var content;
var converter;
init();
function init() {
converter = new Showdown.converter();
// Styles for the doc
var css = document.body.appendChild( document.createElement('style') );
css.innerHTML = 'body { font: normal 12pt sans-serif; margin: 0; overflow: hidden; }';
//Styles for menu and content
var basics = 'border: 3px double #eee; overflow-x: hidden; overflow-y: auto; padding: 10px; position: absolute; ';
var horizontalsMenu = 'left: 10%; width: 15%; ';
var horizontalsContent = 'left: 30%; width: 60%; ';
var verticals = 'height: ' + ( window.innerHeight * 0.88 ) + 'px; top: 60px; ';
// Menu panel
var menu = document.body.appendChild( document.createElement( 'div' ) );
menu.style.cssText = basics + horizontalsMenu + verticals ;
// Content panel
content = document.body.appendChild( document.createElement( 'div' ) );
content.style.cssText = basics + horizontalsContent + verticals ;
menu.innerHTML = converter.makeHtml( requestFile( 'readme-menu.md' ) );
// file to display if no hash or with hash
var index = window.location.pathname.lastIndexOf( '/' ) + 1;
var filename = window.location.pathname.substr( index ).replace( '.html','.md' );
if ( !location.hash ) {
displayPage( 'readme.md', rm );
} else {
displayPage( location.hash.substr(1), null );
}
}
function displayPage( fname, element ) {
// Fetch and show the content file
content.innerHTML = converter.makeHtml( requestFile( fname ) );
// Update window title to match H1 of content file
document.title = content.innerHTML.match( /<h1(.*?)>(.*?)<\/h1>/ )[2];
// Reset background color to all menu items
var paragraphs = document.getElementsByTagName('p');
for (var i = 0, len = paragraphs.length; i < len; i++) {
paragraphs[i].style.backgroundColor = '';
}
// Highlight current menu item
if ( !!element ) {
element.style.backgroundColor = '#edd';
// Update URL hash
if ( element === rm ) {
// if at home page, delete any hash and clean up the history
history.pushState( '', document.title, window.location.pathname );
} else {
location.hash = fname ;
}
}
}
// Fetch a file
function requestFile( fname ) {
var xmlHttp = new XMLHttpRequest();
xmlHttp.open( 'GET', fname, false );
xmlHttp.send( null );
return xmlHttp.responseText;
}
</script>
</body>
</html>