1
1
mirror of https://github.com/github/semantic.git synced 2024-12-25 16:02:43 +03:00

Merge pull request #211 from github/syntax-highlighting

Syntax highlighting
This commit is contained in:
Josh Vera 2015-11-03 17:11:46 -05:00
commit 574ef530c4
6 changed files with 92 additions and 45 deletions

View File

@ -64,7 +64,7 @@
<CommandLineArguments>
<CommandLineArgument
argument = "--unified"
isEnabled = "YES">
isEnabled = "NO">
</CommandLineArgument>
<CommandLineArgument
argument = "https://raw.githubusercontent.com/jquery/jquery/2.1.0/src/effects.js"

55
prototype/UI/diff.js vendored
View File

@ -67,10 +67,12 @@ function wrap(tagName, element) {
}
/// String -> Syntax a -> Range -> (a -> Range) -> (a -> DOM) -> DOM
function rangeAndSyntaxToDOM(source, syntax, range, getRange, recur) {
function termToDOM(source, syntax, extract, getRange, recur) {
recur = recur || function(term) {
return rangeAndSyntaxToDOM(source, term.unwrap, term.extract, getRange);
return termToDOM(source, term.unwrap, term.extract, getRange);
}
var categories = extract.categories;
var range = extract.range;
var element;
if (syntax.leaf != null) {
element = document.createElement("span");
@ -83,18 +85,9 @@ function rangeAndSyntaxToDOM(source, syntax, range, getRange, recur) {
var child = values[i];
if (child.pure == "") continue;
var childRange = getRange(child);
if (childRange.before != null) {
var beforeRange = childRange.before;
element.appendChild(document.createTextNode(source.substr(previous, beforeRange[0] - previous)));
element.appendChild(wrap("li", recur(child)));
previous = beforeRange[0] + beforeRange[1];
}
if (childRange.after != null) {
var afterRange = childRange.before;
element.appendChild(document.createTextNode(source.substr(previous, afterRange[0] - previous)));
element.appendChild(wrap("td", recur(child)));
previous = afterRange[0] + afterRange[1];
}
element.appendChild(document.createTextNode(source.substr(previous, childRange[0] - previous)));
element.appendChild(wrap("li", recur(child)));
previous = childRange[0] + childRange[1];
}
element.appendChild(document.createTextNode(source.substr(previous, range[0] + range[1] - previous)));
} else if (syntax.keyed != null) {
@ -127,6 +120,11 @@ function rangeAndSyntaxToDOM(source, syntax, range, getRange, recur) {
element.appendChild(document.createTextNode(source.substr(previous, range[0] + range[1] - previous)));
}
element["data-range"] = range;
for (index in categories) {
element.classList.add('category-'+categories[index]);
}
return element;
}
@ -137,11 +135,11 @@ function diffToDOM(diff, sources) {
if (diffOrTerm.pure != null) {
var beforeRange, afterRange;
if (diffOrTerm.pure.before != null) {
beforeRange = diffOrTerm.pure.before.extract
beforeRange = diffOrTerm.pure.before.extract.range
}
if (diffOrTerm.pure.after != null) {
afterRange = diffOrTerm.pure.after.extract
afterRange = diffOrTerm.pure.after.extract.range
}
if (beforeRange == null) {
@ -154,10 +152,10 @@ function diffToDOM(diff, sources) {
return { "before": beforeRange, "after": afterRange };
}
if (diffOrTerm.roll != null) {
return diffOrTerm.roll.extract;
return { before: diffOrTerm.roll.extract.before.range, after: diffOrTerm.roll.extract.after.range };
}
if (diffOrTerm.extract != null) {
return diffOrTerm.extract;
return diffOrTerm.extract.range;
}
}
@ -175,7 +173,7 @@ function diffToDOM(diff, sources) {
function pureToDOM(sources, patch, getRangeFun, diffToDOMFun) {
var elementA, elementB;
if (patch.before != null) {
elementA = rangeAndSyntaxToDOM(sources.before, patch.before.unwrap, patch.before.extract, getRangeFun);
elementA = termToDOM(sources.before, patch.before.unwrap, patch.before.extract, getRangeFun);
elementA.classList.add("delete");
if (patch.after != null) {
elementA.classList.add("replace");
@ -183,7 +181,7 @@ function pureToDOM(sources, patch, getRangeFun, diffToDOMFun) {
}
if (patch.after != null) {
elementB = rangeAndSyntaxToDOM(sources.after, patch.after.unwrap, patch.after.extract, getRangeFun);
elementB = termToDOM(sources.after, patch.after.unwrap, patch.after.extract, getRangeFun);
elementB.classList.add("insert");
if (patch.before != null) {
elementB.classList.add("replace");
@ -205,7 +203,14 @@ function pureToDOM(sources, patch, getRangeFun, diffToDOMFun) {
function rollToDOM(sources, rollOrTerm, getRangeFun, diffToDOMFun) {
var syntax = rollOrTerm.unwrap
var range = rollOrTerm.extract
var categories = {
before: rollOrTerm.extract.before.categories,
after: rollOrTerm.extract.after.categories
}
var range = {
before: rollOrTerm.extract.before.range,
after: rollOrTerm.extract.after.range
}
var elementA;
var elementB;
@ -429,6 +434,14 @@ function rollToDOM(sources, rollOrTerm, getRangeFun, diffToDOMFun) {
elementB.appendChild(document.createTextNode(textB));
}
for (index in categories.before) {
elementA.classList.add('category-'+categories.before[index]);
}
for (index in categories.after) {
elementB.classList.add('category-'+categories.after[index]);
}
return { "before": elementA, "after": elementB }
}

0
prototype/UI/dom.js vendored
View File

View File

@ -29,25 +29,69 @@
background-color: #ffffec;
outline: 1px solid #e9e9c0;
}
.invisible {
background-color: #fff;
visibility: hidden;
}
.invisible {
background-color: #fff;
visibility: hidden;
}
.diff div, .diff ul, .diff li, .diff dl, .diff dd, .diff span {
white-space: pre-wrap;
display: inline;
margin: 0;
padding: 0;
color: initial;
}
.diff dt {
display: none;
}
/* syntax highlighting */
.diff .category-regex,
.diff .category-string {
color: #183691;
}
.diff .category-false,
.diff .category-true,
.diff .category-null,
.diff .category-undefined,
.diff .category-number,
.diff .category-function_call>li>.category-identifier,
.diff .category-function_call>li>.category-member_access>.category-identifier,
.diff .category-member_access>:not(:first-child)>.category-identifier {
color: #0086b3;
}
.diff .category-comment {
color: #969896;
}
.diff [class^="category-"][class$="_op"],
.diff .category-ternary,
.diff .category-var_declaration,
.diff .category-new_expression,
.diff .category-if_statement,
.diff .category-do_statement,
.diff .category-for_statement,
.diff .category-for_in_statement,
.diff .category-return_statement,
.diff .category-function,
.diff .category-assignment,
.diff .category-var_assignment {
color: #a71d5d;
}
.diff .category-function>li:first-child>.category-identifier,
.diff .category-new_expression>li>.category-function_call>li:first-child>.category-identifier,
.diff .category-pair>li:first-child>.category-identifier,
.diff .category-assignment>li:first-child>.category-member_access>:not(:first-child)>.category-identifier {
color: #795da3;
}
</style>
<script type="text/javascript" src="dictionary.js"></script>
<script type="text/javascript" src="diff.js"></script>
<script type="text/javascript" src="dom.js"></script>
<script type="text/javascript" src="patch.js"></script>
<script type="text/javascript" src="syntax.js"></script>
<script type="text/javascript" src="term.js"></script>
@ -66,16 +110,15 @@
</script>
</head>
<body>
<div id="before" class="diff"></div>
<div id="after" class="diff"></div>
<div id="before" class="diff"></div>
<div id="after" class="diff"></div>
<script type="text/javascript">
loadJSON((window.location.search || '?diff.json').substr(1), function (json) {
var diff = diffFromJSON(json.diff);
var dom = diffToDOM(diff, { "before": json["before"] , "after": json["after"] })
document.getElementById("before").appendChild(dom.before);
document.getElementById("after").appendChild(dom.after);
var dom = diffToDOM(diff, { "before": json["before"] , "after": json["after"] })
document.getElementById("before").appendChild(dom.before);
document.getElementById("after").appendChild(dom.after);
});
</script>
</body>

View File

@ -12,12 +12,3 @@ function Term(object) {
this.unwrap = object.unwrap;
return this;
}
/// Term -> String -> DOM
function termToDOM(term, which, source) {
return rangeAndSyntaxToDOM(term.range, term.unwrap, source, function(term) {
return term.range;
}, function(term) {
return termToDOM(term, which, source);
});
}

View File

@ -160,10 +160,10 @@ case .Split:
let JSON: Doubt.JSON = [
"before": .String(aSource.contents),
"after": .String(bSource.contents),
"diff": diff.JSON(pure: { $0.JSON { $0.JSON(annotation: { $0.range.JSON }, leaf: Doubt.JSON.String) } }, leaf: Doubt.JSON.String, annotation: {
"diff": diff.JSON(pure: { $0.JSON { $0.JSON(annotation: { $0.JSON }, leaf: Doubt.JSON.String) } }, leaf: Doubt.JSON.String, annotation: {
[
"before": $0.range.JSON,
"after": $1.range.JSON,
"before": $0.JSON,
"after": $1.JSON,
]
}),
]