2015-10-09 21:31:06 +03:00
|
|
|
<!doctype html>
|
|
|
|
|
<html>
|
|
|
|
|
<head>
|
|
|
|
|
<title>semantic-diff</title>
|
2015-11-12 21:41:50 +03:00
|
|
|
<link rel="stylesheet" href="style.css">
|
2015-10-27 18:09:48 +03:00
|
|
|
<script type="text/javascript" src="dictionary.js"></script>
|
2015-10-27 18:11:45 +03:00
|
|
|
<script type="text/javascript" src="diff.js"></script>
|
2015-10-27 18:09:16 +03:00
|
|
|
<script type="text/javascript" src="patch.js"></script>
|
2015-10-27 18:10:38 +03:00
|
|
|
<script type="text/javascript" src="syntax.js"></script>
|
|
|
|
|
<script type="text/javascript" src="term.js"></script>
|
2015-10-09 21:31:06 +03:00
|
|
|
<script type="text/javascript">
|
|
|
|
|
function loadJSON(path, callback) {
|
|
|
|
|
var request = new XMLHttpRequest();
|
|
|
|
|
request.overrideMimeType("application/json");
|
|
|
|
|
request.open('GET', '' + path, true);
|
|
|
|
|
request.onreadystatechange = function () {
|
|
|
|
|
if (request.readyState == 4 && (request.status == "200" || request.status == 0)) {
|
2015-10-09 21:36:18 +03:00
|
|
|
callback(JSON.parse(request.responseText));
|
2015-10-09 21:31:06 +03:00
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
request.send(null);
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
2015-11-08 23:20:32 +03:00
|
|
|
<div id="before">
|
|
|
|
|
<ul id="before-lines" class="line-numbers"></ul>
|
|
|
|
|
<div id="before-diff" class="diff"></div>
|
|
|
|
|
</div>
|
|
|
|
|
<div id="after">
|
|
|
|
|
<ul id="after-lines" class="line-numbers"></ul>
|
|
|
|
|
<div id="after-diff" class="diff"></div>
|
|
|
|
|
</div>
|
2015-10-29 22:11:18 +03:00
|
|
|
|
2015-11-09 22:13:47 +03:00
|
|
|
<script type="text/javascript">
|
|
|
|
|
var unique = function(array) {
|
|
|
|
|
return array.reduce(function(accum, current) {
|
|
|
|
|
if (accum.indexOf(current) < 0) {
|
|
|
|
|
accum.push(current);
|
|
|
|
|
}
|
|
|
|
|
return accum;
|
|
|
|
|
}, []);
|
|
|
|
|
}
|
2015-11-08 23:20:32 +03:00
|
|
|
|
2015-11-09 22:13:47 +03:00
|
|
|
loadJSON((window.location.search || '?diff.json').substr(1), function (json) {
|
|
|
|
|
var diff = diffFromJSON(json.diff);
|
2015-11-08 23:20:32 +03:00
|
|
|
|
|
|
|
|
var beforeLinesEl = document.getElementById("before-lines")
|
|
|
|
|
var afterLinesEl = document.getElementById("after-lines")
|
|
|
|
|
|
2015-11-09 20:06:45 +03:00
|
|
|
var dom = diffToDOM(diff,
|
|
|
|
|
{ "before": json["before"] , "after": json["after"] },
|
|
|
|
|
{ "before": beforeLinesEl, "after": afterLinesEl });
|
2015-11-08 23:20:32 +03:00
|
|
|
|
2015-11-09 22:13:47 +03:00
|
|
|
var beforeLines = dom.before.getAttribute("data-line-number").split(",")
|
|
|
|
|
unique(beforeLines).forEach(function(lineNumber) {
|
|
|
|
|
var node = wrap("li", document.createTextNode(lineNumber));
|
|
|
|
|
beforeLinesEl.appendChild(node);
|
|
|
|
|
});
|
|
|
|
|
var afterLines = dom.after.getAttribute("data-line-number").split(",")
|
|
|
|
|
unique(afterLines).forEach(function(lineNumber) {
|
|
|
|
|
var node = wrap("li", document.createTextNode(lineNumber));
|
|
|
|
|
afterLinesEl.appendChild(node);
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
document.getElementById("before-diff").appendChild(dom.before);
|
|
|
|
|
document.getElementById("after-diff").appendChild(dom.after);
|
|
|
|
|
});
|
|
|
|
|
</script>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
