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
131
132
|
--boundary
X-Thing: Pattern
text/markdown
--boundary
X-Thing: Head
<link rel="stylesheet" href="/static/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="/static/simplemde/dist/simplemde.min.css">
<script src="/static/simplemde/dist/simplemde.min.js"></script>
--boundary
X-Thing: Tail
<script>
(function() {
var textarea = document.getElementsByTagName('textarea')[0];
var form = textarea.form;
var container = document.createElement('div');
form.insertBefore(container, textarea);
container.appendChild(textarea);
var tip = document.createElement('aside');
tip.innerHTML =
'<p>Tip: To set the page title (what appears in the tab '+
'name/window bar), put this at the top of the page:</p>\n'+
'<pre>---\ntitle: "Your Title Here"\n---\n</pre>\n'+
'<p>(I apologize that it looks funny on this page and in the '+
'preview.)</p>\n'+
'<p>Otherwise, the first line will be used as the title. This means '+
'that if you want the title to also appear at the top of the document, '+
'you can instead use:<p>\n'+
'<pre>Your Title Here\n===============\n</pre>\n'+
'<p>which will also include it as a heading at the top of the page.</p>';
container.appendChild(tip);
// bug workaround from https://github.com/codemirror/CodeMirror/issues/2143#issuecomment-140100969
var updateSectionHeaderStyles = function(cm, change) {
var lines = cm.lineCount();
for (var i = Math.max(0, change.from.line-1); i <= Math.min(change.to.line+1, lines-1); i++) {
var line = cm.getLineHandle(i);
cm.removeLineClass(line, 'text', 'cm-header');
cm.removeLineClass(line, 'text', 'cm-header-1');
cm.removeLineClass(line, 'text', 'cm-header-2');
var lineTokens = cm.getLineTokens(i);
var tok = lineTokens[0];
if (!tok || !tok.type || tok.type.indexOf('header') === -1) {
// first token could be some spaces, try 2nd
tok = lineTokens[1];
}
if (tok && tok.type && tok.type.indexOf('header') !== -1
&& tok.string !== '#') { // not ATX header style, which starts with #
var classes = tok.type.
split(' ').
filter(function(cls) { return cls.indexOf('header') === 0; }).
map(function (cls) { return 'cm-' + cls; }).
join(' ');
var prev_line = cm.getLineHandle(i-1);
cm.addLineClass(prev_line, 'text', classes);
}
}
};
var simplemde = new SimpleMDE({
autoDownloadFontAwesome: false,
element: textarea,
promptURLs: true,
showIcons: ['code', 'table'],
});
var cm = simplemde.codemirror;
cm.on("change", function(cm, change) {
cm.save(); // this is SimpleMDE forceSync
updateSectionHeaderStyles(cm, change);
});
updateSectionHeaderStyles(cm, {from: {line: 0}, to: {line: cm.lineCount()}});
})();
</script>
--boundary
X-Thing: Pattern
text/*; */*+xml; application/x-ruby
--boundary
X-Thing: Head
<link rel="stylesheet" href="/static/codemirror/lib/codemirror.css">
<script src="/static/codemirror/lib/codemirror.js"></script>
<script src="/static/codemirror/mode/xml/xml.js"></script>
<script src="/static/codemirror/mode/javascript/javascript.js"></script>
<script src="/static/codemirror/mode/css/css.js"></script>
<script src="/static/codemirror/mode/sass/sass.js"></script>
<script src="/static/codemirror/mode/ruby/ruby.js"></script>
<script src="/static/codemirror/mode/htmlmixed/htmlmixed.js"></script>
<script src="/static/codemirror/addon/edit/matchbrackets.js"></script>
<script src="/static/codemirror/addon/edit/trailingspace.js"></script>
<script src="/static/codemirror/addon/display/rulers.js"></script>
<script src="/static/codemirror/addon/fold/foldcode.js"></script>
<script src="/static/codemirror/addon/fold/foldgutter.js"></script>
<link rel="stylesheet" href="/static/codemirror/addon/fold/foldgutter.css">
<script src="/static/codemirror/addon/fold/brace-fold.js"></script>
<script src="/static/codemirror/addon/fold/xml-fold.js"></script>
<script src="/static/codemirror/addon/fold/markdown-fold.js"></script>
<script src="/static/codemirror/addon/fold/comment-fold.js"></script>
--boundary
X-Thing: Tail
<script>
(function() {
var textarea = document.getElementsByTagName('textarea')[0];
var form = textarea.form;
var container = document.createElement('div');
form.insertBefore(container, textarea);
container.appendChild(textarea);
var cm = CodeMirror.fromTextArea(textarea, {
mode: ctype,
lineNumbers: true,
matchBrackets: true,
foldGutter: true,
rulers: [{column: 72, color: '#DDDDDD', lineStyle: "dashed"}, {column: 80, color: '#F4DDDD', lineStyle: "dashed"}],
showTrailingSpace: true,
gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"],
});
cm.on("change", function() {
cm.save();
});
})();
</script>
--boundary--
|
