scripts/CodeMirror/mode/tiddlywiki/index.html (view raw)
1<!doctype html>
2
3<title>CodeMirror: TiddlyWiki mode</title>
4<meta charset="utf-8"/>
5<link rel=stylesheet href="../../doc/docs.css">
6
7<link rel="stylesheet" href="../../lib/codemirror.css">
8<link rel="stylesheet" href="tiddlywiki.css">
9<script src="../../lib/codemirror.js"></script>
10<script src="../../addon/edit/matchbrackets.js"></script>
11<script src="tiddlywiki.js"></script>
12<style>.CodeMirror {border-top: 1px solid black; border-bottom: 1px solid black;}</style>
13<div id=nav>
14 <a href="https://codemirror.net"><h1>CodeMirror</h1><img id=logo src="../../doc/logo.png" alt=""></a>
15
16 <ul>
17 <li><a href="../../index.html">Home</a>
18 <li><a href="../../doc/manual.html">Manual</a>
19 <li><a href="https://github.com/codemirror/codemirror">Code</a>
20 </ul>
21 <ul>
22 <li><a href="../index.html">Language modes</a>
23 <li><a class=active href="#">TiddlyWiki</a>
24 </ul>
25</div>
26
27<article>
28<h2>TiddlyWiki mode</h2>
29
30
31<div><textarea id="code" name="code">
32!TiddlyWiki Formatting
33* Rendered versions can be found at: http://www.tiddlywiki.com/#Reference
34
35|!Option | !Syntax |
36|bold font | ''bold'' |
37|italic type | //italic// |
38|underlined text | __underlined__ |
39|strikethrough text | --strikethrough-- |
40|superscript text | super^^script^^ |
41|subscript text | sub~~script~~ |
42|highlighted text | @@highlighted@@ |
43|preformatted text | {{{preformatted}}} |
44
45!Block Elements
46<<<
47!Heading 1
48
49!!Heading 2
50
51!!!Heading 3
52
53!!!!Heading 4
54
55!!!!!Heading 5
56<<<
57
58!!Lists
59<<<
60* unordered list, level 1
61** unordered list, level 2
62*** unordered list, level 3
63
64# ordered list, level 1
65## ordered list, level 2
66### unordered list, level 3
67
68; definition list, term
69: definition list, description
70<<<
71
72!!Blockquotes
73<<<
74> blockquote, level 1
75>> blockquote, level 2
76>>> blockquote, level 3
77
78> blockquote
79<<<
80
81!!Preformatted Text
82<<<
83{{{
84preformatted (e.g. code)
85}}}
86<<<
87
88!!Code Sections
89<<<
90{{{
91Text style code
92}}}
93
94//{{{
95JS styled code. TiddlyWiki mixed mode should support highlighter switching in the future.
96//}}}
97
98<!--{{{-->
99XML styled code. TiddlyWiki mixed mode should support highlighter switching in the future.
100<!--}}}-->
101<<<
102
103!!Tables
104<<<
105|CssClass|k
106|!heading column 1|!heading column 2|
107|row 1, column 1|row 1, column 2|
108|row 2, column 1|row 2, column 2|
109|>|COLSPAN|
110|ROWSPAN| ... |
111|~| ... |
112|CssProperty:value;...| ... |
113|caption|c
114
115''Annotation:''
116* The {{{>}}} marker creates a "colspan", causing the current cell to merge with the one to the right.
117* The {{{~}}} marker creates a "rowspan", causing the current cell to merge with the one above.
118<<<
119!!Images /% TODO %/
120cf. [[TiddlyWiki.com|http://www.tiddlywiki.com/#EmbeddedImages]]
121
122!Hyperlinks
123* [[WikiWords|WikiWord]] are automatically transformed to hyperlinks to the respective tiddler
124** the automatic transformation can be suppressed by preceding the respective WikiWord with a tilde ({{{~}}}): {{{~WikiWord}}}
125* [[PrettyLinks]] are enclosed in square brackets and contain the desired tiddler name: {{{[[tiddler name]]}}}
126** optionally, a custom title or description can be added, separated by a pipe character ({{{|}}}): {{{[[title|target]]}}}<br>'''N.B.:''' In this case, the target can also be any website (i.e. URL).
127
128!Custom Styling
129* {{{@@CssProperty:value;CssProperty:value;...@@}}}<br>''N.B.:'' CSS color definitions should use lowercase letters to prevent the inadvertent creation of WikiWords.
130* <html><code>{{customCssClass{...}}}</code></html>
131* raw HTML can be inserted by enclosing the respective code in HTML tags: {{{<html> ... </html>}}}
132
133!Special Markers
134* {{{<br>}}} forces a manual line break
135* {{{----}}} creates a horizontal ruler
136* [[HTML entities|http://www.tiddlywiki.com/#HtmlEntities]]
137* [[HTML entities local|HtmlEntities]]
138* {{{<<macroName>>}}} calls the respective [[macro|Macros]]
139* To hide text within a tiddler so that it is not displayed, it can be wrapped in {{{/%}}} and {{{%/}}}.<br/>This can be a useful trick for hiding drafts or annotating complex markup.
140* To prevent wiki markup from taking effect for a particular section, that section can be enclosed in three double quotes: e.g. {{{"""WikiWord"""}}}.
141</textarea></div>
142
143 <script>
144 var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
145 mode: 'tiddlywiki',
146 lineNumbers: true,
147 matchBrackets: true
148 });
149 </script>
150
151 <p>TiddlyWiki mode supports a single configuration.</p>
152
153 <p><strong>MIME types defined:</strong> <code>text/x-tiddlywiki</code>.</p>
154 </article>