-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
86 lines (78 loc) · 3.31 KB
/
index.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
<!doctype html>
<html lang='en'>
<head>
<title>CodeMirror Syntax Themes</title>
<link rel='stylesheet' type='text/css' media='all' href='https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.44.0/codemirror.min.css' />
<link rel='stylesheet' type='text/css' media='all' href='css/charcoal.css' />
<link rel='stylesheet' type='text/css' media='all' href='css/wombat.css' />
<link rel='stylesheet' type='text/css' media='all' href='css/django-smoothy.css' />
</head>
<body>
<textarea id="code" name="code"><!doctype html>
<html>
<head>
<title>Your Title Here</title>
<style>
html, body {
margin: 0;
}
a:hover {
text-decoration: underline;
}
</style>
</head>
<body bgcolor="ffffff">
<a href="http://somegreatsite.com">Link Name</a>
is a link to another nifty site
<h1>This is a Header</h1>
<h2>This is a Medium Header</h2>
Send me mail at <a href="mailto:support@yourcompany.com">support@yourcompany.com</a>.
<p> This is a new paragraph!</p>
<p> <b>This is a new paragraph!</b></p>
&amp;
<script type='text/javascript'>
var foo = 1, bar = true, baz = 'yeet', re = /./g;
if (foo == bar) {
alert('thanks for inventing javascript :^)');
}
</script>
</body>
</html></textarea>
<select onchange="selectTheme()" id=select>
<option selected>wombat</option>
<option>charcoal</option>
<option>django-smoothy</option>
</select>
<script type='application/javascript' charset='utf-8' src='https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.44.0/codemirror.min.js'></script>
<!-- CodeMirror Languages -->
<script type='application/javascript' charset='utf-8' src='https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.44.0/mode/xml/xml.min.js'></script>
<script type='application/javascript' charset='utf-8' src='https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.44.0/mode/javascript/javascript.min.js'></script>
<script type='application/javascript' charset='utf-8' src='https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.44.0/mode/css/css.min.js'></script>
<script type='application/javascript' charset='utf-8' src='https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.44.0/mode/htmlmixed/htmlmixed.min.js'></script>
<script type='application/javascript'>
var editor = CodeMirror.fromTextArea(document.getElementById('code'), {
mode: 'htmlmixed',
lineNumbers: true,
styleActiveLine: true,
matchBrackets: true
});
var input = document.getElementById('select');
function selectTheme() {
var theme = input.options[input.selectedIndex].textContent;
editor.setOption('theme', theme);
location.hash = '#' + theme;
}
var choice = (location.hash && location.hash.slice(1)) ||
(document.location.search &&
decodeURIComponent(document.location.search.slice(1)));
if (choice) {
input.value = choice;
editor.setOption('theme', choice);
}
CodeMirror.on(window, 'hashchange', function() {
var theme = location.hash.slice(1);
if (theme) { input.value = theme; selectTheme(); }
});
</script>
</body>
</html>