mirrors/TiddlyWiki5
1
0
Fork 0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-11-23 18:17:20 +00:00
Code Issues Releases Wiki Activity

Added syntax highlighting for JavaScript tiddlers

Browse Source
This commit is contained in:
Jeremy Ruston 2012-03-02 00:48:05 +00:00
parent 542561a0fa
commit 8adfcbdc69
2 changed files with 80 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
js/JavaScriptParser.js
View File

@ -44,11 +44,47 @@ var JavaScriptParser = function(options) {
this.store = options.store;
};
// Parse a string of JavaScript code and return the parse tree as a wikitext parse tree
// Parse a string of JavaScript code or JSON and return the parse tree as a wikitext parse tree
JavaScriptParser.prototype.parse = function(type,code) {
if(type === "application/json") {
code = "(" + code + ")";
if(type === "application/javascript") {
return this.parseJavaScript(code);
} else {
return this.parseJSON(code);
}
}
JavaScriptParser.prototype.parseJavaScript = function(code) {
// Get the parse tree
var parseTree = esprima.parse(code,{
tokens: true,
range: true
}),
result = [],
t,endLastToken = 0;
for(t=0; t<parseTree.tokens.length; t++) {
var token = parseTree.tokens[t];
if(token.range[0] > endLastToken) {
result.push(Renderer.TextNode(code.substring(endLastToken,token.range[0])));
}
result.push(Renderer.ElementNode("span",{
"class": "javascript-" + token.type.toLowerCase()
},[
Renderer.TextNode(token.value)
]));
endLastToken = token.range[1] + 1;
}
if(endLastToken < code.length) {
result.push(Renderer.TextNode(code.substring(endLastToken)));
}
return new WikiTextParseTree([
Renderer.ElementNode("pre",{"class": "javascript-source"},result)
],new Dependencies(),this.store);
};
JavaScriptParser.prototype.parseJSON = function(code) {
// Wrap it in parenthesis to make it a program
code = "(" + code + ")";
// Get the parse tree
return new WikiTextParseTree([
renderObject(esprima.parse(code))
],new Dependencies(),this.store);

42
tiddlywiki5/styles.css
View File

@ -18,7 +18,7 @@ code, pre {
font-size: 13px;
line-height: 18px;
padding: 0 3px 2px;
font-family: Monaco, Andale Mono, Courier New, monospace;
font-family: 'Bitstream Vera Sans Mono','Courier','Courier New', monospace;
font-size: 12px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
@ -254,3 +254,43 @@ a.tw-slider-label::after {
.tw-slider-label:focus {
outline: 1px dotted #666;
}
.javascript-source {
font-style: italic;
}
.javascript-source .javascript-boolean {
font-style: normal;
}
.javascript-source .javascript-identifier {
font-style: normal;
color: #b00;
}
.javascript-source .javascript-keyword {
font-style: normal;
color: #393;
font-weight: bold;
}
.javascript-source .javascript-null {
font-style: normal;
color: #833;
}
.javascript-source .javascript-numeric {
font-style: normal;
color: #33a;
}
.javascript-source .javascript-punctuator {
font-style: normal;
color: #444;
}
.javascript-source .javascript-string {
font-style: normal;
color: #388;
}