kopia lustrzana https://github.com/miklobit/TiddlyWiki5
Improved rendering of JavaScript comments
rodzic
865a0ad7cc
commit
d3ca939863
|
@ -21,12 +21,9 @@ var JavaScriptParser = function(options) {
|
|||
|
||||
// Parse a string of JavaScript code or JSON and return the parse tree as a wikitext parse tree
|
||||
JavaScriptParser.prototype.parse = function(type,code) {
|
||||
var parseTree,
|
||||
result = [],
|
||||
t,endLastToken = 0;
|
||||
// Try to parse the code
|
||||
try {
|
||||
parseTree = esprima.parse(code,{tokens: true,range: true});
|
||||
var parseTree = esprima.parse(code,{comment: true,tokens: true,range: true});
|
||||
} catch(ex) {
|
||||
// Return a helpful error if the parse failed
|
||||
return new WikiTextParseTree([
|
||||
|
@ -37,22 +34,61 @@ JavaScriptParser.prototype.parse = function(type,code) {
|
|||
])
|
||||
],new Dependencies(),this.store);
|
||||
}
|
||||
// Render the tokens with the appropriate class
|
||||
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])));
|
||||
// Helpers to render the comments and tokens with the appropriate classes
|
||||
var self = this,
|
||||
result = [],
|
||||
nextComment = 0,
|
||||
nextToken = 0,
|
||||
currPos = 0;
|
||||
var renderWhitespace = function(nextPos) {
|
||||
if(currPos < nextPos) {
|
||||
result.push(Renderer.TextNode(code.substring(currPos,nextPos)));
|
||||
}
|
||||
},
|
||||
renderComment = function(comment) {
|
||||
var text = comment.value,
|
||||
element,
|
||||
classes = [];
|
||||
renderWhitespace(comment.range[0]);
|
||||
if(comment.type === "Block") {
|
||||
element = "div";
|
||||
classes.push("javascript-block-comment");
|
||||
} else {
|
||||
element = "span";
|
||||
classes.push("javascript-line-comment");
|
||||
}
|
||||
result.push(Renderer.ElementNode(element,{"class": classes},
|
||||
self.store.parseText("text/x-tiddlywiki",text).tree));
|
||||
if(comment.type === "Line") {
|
||||
result.push(Renderer.TextNode("\n"));
|
||||
}
|
||||
currPos = comment.range[1] + 1;
|
||||
},
|
||||
renderToken = function(token) {
|
||||
renderWhitespace(token.range[0]);
|
||||
result.push(Renderer.ElementNode("span",{
|
||||
"class": "javascript-" + token.type.toLowerCase()
|
||||
},[
|
||||
Renderer.TextNode(token.value)
|
||||
]));
|
||||
currPos = token.range[1] + 1;
|
||||
};
|
||||
// Process the tokens interleaved with the comments
|
||||
while(nextComment < parseTree.comments.length || nextToken < parseTree.tokens.length) {
|
||||
if(nextComment < parseTree.comments.length && nextToken < parseTree.tokens.length) {
|
||||
if(parseTree.comments[nextComment].range[0] < parseTree.tokens[nextToken].range[0]) {
|
||||
renderComment(parseTree.comments[nextComment++]);
|
||||
} else {
|
||||
renderToken(parseTree.tokens[nextToken++]);
|
||||
}
|
||||
} else if(nextComment < parseTree.comments.length) {
|
||||
renderComment(parseTree.comments[nextComment++]);
|
||||
} else {
|
||||
renderToken(parseTree.tokens[nextToken++]);
|
||||
}
|
||||
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)));
|
||||
}
|
||||
renderWhitespace(code.length);
|
||||
// Wrap the whole lot in a `<PRE>`
|
||||
return new WikiTextParseTree([
|
||||
Renderer.ElementNode("pre",{"class": "javascript-source"},result)
|
||||
],new Dependencies(),this.store);
|
||||
|
|
|
@ -273,42 +273,43 @@ a.tw-slider-label::after {
|
|||
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;
|
||||
}
|
||||
|
||||
.javascript-source .javascript-block-comment {
|
||||
font-family: Helvetica, Arial, sans-serif;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.javascript-source .javascript-line-comment {
|
||||
font-family: Helvetica, Arial, sans-serif;
|
||||
background: #ff0;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
|
Ładowanie…
Reference in New Issue