major refactor with classes
This commit is contained in:
Rodrigo Fernandes
parent
39730ad271
commit
2015436448
9 changed files with 497 additions and 466 deletions
470
diff2html.js
470
diff2html.js
|
|
@ -7,12 +7,8 @@
|
||||||
* git diff
|
* git diff
|
||||||
*/
|
*/
|
||||||
|
|
||||||
var LINE_TYPE = {
|
var diffParser = new DiffParser();
|
||||||
INSERTS: "d2h-ins",
|
var htmlPrinter = new HtmlPrinter();
|
||||||
DELETES: "d2h-del",
|
|
||||||
CONTEXT: "d2h-cntx",
|
|
||||||
INFO: "d2h-info"
|
|
||||||
};
|
|
||||||
|
|
||||||
function Diff2Html() {
|
function Diff2Html() {
|
||||||
}
|
}
|
||||||
|
|
@ -21,483 +17,35 @@ function Diff2Html() {
|
||||||
* Generates pretty html from string diff input
|
* Generates pretty html from string diff input
|
||||||
*/
|
*/
|
||||||
Diff2Html.prototype.getPrettyHtmlFromDiff = function (diffInput) {
|
Diff2Html.prototype.getPrettyHtmlFromDiff = function (diffInput) {
|
||||||
var diffJson = generateDiffJson(diffInput);
|
var diffJson = diffParser.generateDiffJson(diffInput);
|
||||||
return generateJsonHtml(diffJson);
|
return htmlPrinter.generateJsonHtml(diffJson);
|
||||||
};
|
};
|
||||||
|
|
||||||
/*
|
/*
|
||||||
* Generates json object from string diff input
|
* Generates json object from string diff input
|
||||||
*/
|
*/
|
||||||
Diff2Html.prototype.getJsonFromDiff = function (diffInput) {
|
Diff2Html.prototype.getJsonFromDiff = function (diffInput) {
|
||||||
return generateDiffJson(diffInput);
|
return diffParser.generateDiffJson(diffInput);
|
||||||
};
|
};
|
||||||
|
|
||||||
/*
|
/*
|
||||||
* Generates pretty html from a json object
|
* Generates pretty html from a json object
|
||||||
*/
|
*/
|
||||||
Diff2Html.prototype.getPrettyHtmlFromJson = function (diffJson) {
|
Diff2Html.prototype.getPrettyHtmlFromJson = function (diffJson) {
|
||||||
return generateJsonHtml(diffJson);
|
return htmlPrinter.generateJsonHtml(diffJson);
|
||||||
};
|
};
|
||||||
|
|
||||||
/*
|
/*
|
||||||
* Generates pretty side by side html from string diff input
|
* Generates pretty side by side html from string diff input
|
||||||
*/
|
*/
|
||||||
Diff2Html.prototype.getPrettySideBySideHtmlFromDiff = function (diffInput) {
|
Diff2Html.prototype.getPrettySideBySideHtmlFromDiff = function (diffInput) {
|
||||||
var diffJson = generateDiffJson(diffInput);
|
var diffJson = diffParser.generateDiffJson(diffInput);
|
||||||
return generateSideBySideJsonHtml(diffJson);
|
return htmlPrinter.generateSideBySideJsonHtml(diffJson);
|
||||||
};
|
};
|
||||||
|
|
||||||
/*
|
/*
|
||||||
* Generates pretty side by side html from a json object
|
* Generates pretty side by side html from a json object
|
||||||
*/
|
*/
|
||||||
Diff2Html.prototype.getPrettySideBySideHtmlFromJson = function (diffJson) {
|
Diff2Html.prototype.getPrettySideBySideHtmlFromJson = function (diffJson) {
|
||||||
return generateSideBySideJsonHtml(diffJson);
|
return htmlPrinter.generateSideBySideJsonHtml(diffJson);
|
||||||
};
|
};
|
||||||
|
|
||||||
var generateDiffJson = function (diffInput) {
|
|
||||||
var files = [],
|
|
||||||
currentFile = null,
|
|
||||||
currentBlock = null,
|
|
||||||
oldLine = null,
|
|
||||||
newLine = null;
|
|
||||||
|
|
||||||
var saveBlock = function () {
|
|
||||||
/* add previous block(if exists) before start a new file */
|
|
||||||
if (currentBlock) {
|
|
||||||
currentFile.blocks.push(currentBlock);
|
|
||||||
currentBlock = null;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
var saveFile = function () {
|
|
||||||
/*
|
|
||||||
* add previous file(if exists) before start a new one
|
|
||||||
* if it has name (to avoid binary files errors)
|
|
||||||
*/
|
|
||||||
if (currentFile && currentFile.newName) {
|
|
||||||
files.push(currentFile);
|
|
||||||
currentFile = null;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
var startFile = function () {
|
|
||||||
saveBlock();
|
|
||||||
saveFile();
|
|
||||||
|
|
||||||
/* create file structure */
|
|
||||||
currentFile = {};
|
|
||||||
currentFile.blocks = [];
|
|
||||||
currentFile.deletedLines = 0;
|
|
||||||
currentFile.addedLines = 0;
|
|
||||||
};
|
|
||||||
|
|
||||||
var startBlock = function (line) {
|
|
||||||
saveBlock();
|
|
||||||
|
|
||||||
var values;
|
|
||||||
|
|
||||||
if (values = /^@@ -(\d+),\d+ \+(\d+),\d+ @@.*/.exec(line)) {
|
|
||||||
currentFile.isTripleDiff = false;
|
|
||||||
} else if (values = /^@@@ -(\d+),\d+ -\d+,\d+ \+(\d+),\d+ @@@.*/.exec(line)) {
|
|
||||||
currentFile.isTripleDiff = true;
|
|
||||||
} else {
|
|
||||||
values = [0, 0];
|
|
||||||
currentFile.isTripleDiff = false;
|
|
||||||
}
|
|
||||||
|
|
||||||
oldLine = values[1];
|
|
||||||
newLine = values[2];
|
|
||||||
|
|
||||||
/* create block metadata */
|
|
||||||
currentBlock = {};
|
|
||||||
currentBlock.lines = [];
|
|
||||||
currentBlock.oldStartLine = oldLine;
|
|
||||||
currentBlock.newStartLine = newLine;
|
|
||||||
currentBlock.header = line;
|
|
||||||
};
|
|
||||||
|
|
||||||
var createLine = function (line) {
|
|
||||||
var currentLine = {};
|
|
||||||
currentLine.content = line;
|
|
||||||
|
|
||||||
/* fill the line data */
|
|
||||||
if (startsWith(line, "+") || startsWith(line, " +")) {
|
|
||||||
currentFile.addedLines++;
|
|
||||||
|
|
||||||
currentLine.type = LINE_TYPE.INSERTS;
|
|
||||||
currentLine.oldNumber = null;
|
|
||||||
currentLine.newNumber = newLine++;
|
|
||||||
|
|
||||||
currentBlock.lines.push(currentLine);
|
|
||||||
|
|
||||||
} else if (startsWith(line, "-") || startsWith(line, " -")) {
|
|
||||||
currentFile.deletedLines++;
|
|
||||||
|
|
||||||
currentLine.type = LINE_TYPE.DELETES;
|
|
||||||
currentLine.oldNumber = oldLine++;
|
|
||||||
currentLine.newNumber = null;
|
|
||||||
|
|
||||||
currentBlock.lines.push(currentLine);
|
|
||||||
|
|
||||||
} else {
|
|
||||||
currentLine.type = LINE_TYPE.CONTEXT;
|
|
||||||
currentLine.oldNumber = oldLine++;
|
|
||||||
currentLine.newNumber = newLine++;
|
|
||||||
|
|
||||||
currentBlock.lines.push(currentLine);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
var diffLines = diffInput.split("\n");
|
|
||||||
diffLines.forEach(function (line) {
|
|
||||||
// Unmerged paths, and possibly other non-diffable files
|
|
||||||
// https://github.com/scottgonzalez/pretty-diff/issues/11
|
|
||||||
// Also, remove some useless lines
|
|
||||||
if (!line || startsWith(line, "*") ||
|
|
||||||
startsWith(line, "new") || startsWith(line, "index")) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
var values = [];
|
|
||||||
if (startsWith(line, "diff")) {
|
|
||||||
startFile();
|
|
||||||
} else if (currentFile && !currentFile.oldName && (values = /^--- a\/(\S+).*$/.exec(line))) {
|
|
||||||
currentFile.oldName = values[1];
|
|
||||||
} else if (currentFile && !currentFile.newName && (values = /^\+\+\+ [b]?\/(\S+).*$/.exec(line))) {
|
|
||||||
currentFile.newName = values[1];
|
|
||||||
|
|
||||||
var fileSplit = currentFile.newName.split(".");
|
|
||||||
currentFile.language = fileSplit[fileSplit.length - 1];
|
|
||||||
} else if (currentFile && startsWith(line, "@@")) {
|
|
||||||
startBlock(line);
|
|
||||||
} else if (currentBlock) {
|
|
||||||
createLine(line);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
saveBlock();
|
|
||||||
saveFile();
|
|
||||||
|
|
||||||
return files;
|
|
||||||
};
|
|
||||||
|
|
||||||
/*
|
|
||||||
* Line By Line HTML
|
|
||||||
*/
|
|
||||||
|
|
||||||
var generateJsonHtml = function (diffFiles) {
|
|
||||||
return "<div class=\"d2h-wrapper\">\n" +
|
|
||||||
diffFiles.map(function (file) {
|
|
||||||
return "<div class=\"d2h-file-wrapper\" data-lang=\"" + file.language + "\">\n" +
|
|
||||||
" <div class=\"d2h-file-header\">\n" +
|
|
||||||
" <div class=\"d2h-file-stats\">\n" +
|
|
||||||
" <span class=\"d2h-lines-added\">+" + file.addedLines + "</span>\n" +
|
|
||||||
" <span class=\"d2h-lines-deleted\">-" + file.deletedLines + "</span>\n" +
|
|
||||||
" </div>\n" +
|
|
||||||
" <div class=\"d2h-file-name\">" + getDiffName(file.oldName, file.newName) + "</div>\n" +
|
|
||||||
" </div>\n" +
|
|
||||||
" <div class=\"d2h-file-diff\">\n" +
|
|
||||||
" <div class=\"d2h-code-wrapper\">\n" +
|
|
||||||
" <table class=\"d2h-diff-table\">\n" +
|
|
||||||
" <tbody class=\"d2h-diff-tbody\">\n" +
|
|
||||||
" " + generateFileHtml(file) +
|
|
||||||
" </tbody>\n" +
|
|
||||||
" </table>\n" +
|
|
||||||
" </div>\n" +
|
|
||||||
" </div>\n" +
|
|
||||||
" </div>\n";
|
|
||||||
}).join("\n") +
|
|
||||||
"</div>\n";
|
|
||||||
};
|
|
||||||
|
|
||||||
var generateFileHtml = function (file) {
|
|
||||||
return file.blocks.map(function (block) {
|
|
||||||
|
|
||||||
var lines = "<tr>\n" +
|
|
||||||
" <td class=\"d2h-code-linenumber " + LINE_TYPE.INFO + "\"></td>\n" +
|
|
||||||
" <td class=\"" + LINE_TYPE.INFO + "\">" +
|
|
||||||
" <div class=\"d2h-code-line " + LINE_TYPE.INFO + "\">" + escape(block.header) + "</div>" +
|
|
||||||
" </td>\n" +
|
|
||||||
"</tr>\n";
|
|
||||||
|
|
||||||
var oldLines = [], newLines = [];
|
|
||||||
var processedOldLines = [], processedNewLines = [];
|
|
||||||
|
|
||||||
for (var i = 0; i < block.lines.length; i++) {
|
|
||||||
var line = block.lines[i];
|
|
||||||
var escapedLine = escape(line.content);
|
|
||||||
|
|
||||||
if (line.type == LINE_TYPE.CONTEXT && !oldLines.length && !newLines.length) {
|
|
||||||
lines += generateLineHtml(line.type, line.oldNumber, line.newNumber, escapedLine);
|
|
||||||
} else if (line.type == LINE_TYPE.INSERTS && !oldLines.length && !newLines.length) {
|
|
||||||
lines += generateLineHtml(line.type, line.oldNumber, line.newNumber, escapedLine);
|
|
||||||
} else if (line.type == LINE_TYPE.DELETES && !newLines.length) {
|
|
||||||
oldLines.push(line);
|
|
||||||
} else if (line.type == LINE_TYPE.INSERTS && oldLines.length > newLines.length) {
|
|
||||||
newLines.push(line);
|
|
||||||
} else {
|
|
||||||
var j = 0;
|
|
||||||
var oldLine, newLine;
|
|
||||||
var oldEscapedLine, newEscapedLine;
|
|
||||||
|
|
||||||
if (oldLines.length === newLines.length) {
|
|
||||||
for (j = 0; j < oldLines.length; j++) {
|
|
||||||
oldLine = oldLines[j];
|
|
||||||
newLine = newLines[j];
|
|
||||||
oldEscapedLine = escape(oldLine.content);
|
|
||||||
newEscapedLine = escape(newLine.content);
|
|
||||||
|
|
||||||
var diff = diffHighlight(oldEscapedLine, newEscapedLine, file.isTripleDiff);
|
|
||||||
|
|
||||||
processedOldLines += generateLineHtml(oldLine.type, oldLine.oldNumber, oldLine.newNumber, diff.o);
|
|
||||||
processedNewLines += generateLineHtml(newLine.type, newLine.oldNumber, newLine.newNumber, diff.n);
|
|
||||||
}
|
|
||||||
|
|
||||||
lines += processedOldLines + processedNewLines;
|
|
||||||
} else {
|
|
||||||
for (j = 0; j < oldLines.length; j++) {
|
|
||||||
oldLine = oldLines[j];
|
|
||||||
oldEscapedLine = escape(oldLine.content);
|
|
||||||
lines += generateLineHtml(oldLine.type, oldLine.oldNumber, oldLine.newNumber, oldEscapedLine);
|
|
||||||
}
|
|
||||||
|
|
||||||
for (j = 0; j < newLines.length; j++) {
|
|
||||||
newLine = newLines[j];
|
|
||||||
newEscapedLine = escape(newLine.content);
|
|
||||||
lines += generateLineHtml(newLine.type, newLine.oldNumber, newLine.newNumber, newEscapedLine);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
oldLines = [];
|
|
||||||
newLines = [];
|
|
||||||
processedOldLines = [];
|
|
||||||
processedNewLines = [];
|
|
||||||
i--;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return lines;
|
|
||||||
}).join("\n");
|
|
||||||
};
|
|
||||||
|
|
||||||
var generateLineHtml = function (type, oldNumber, newNumber, content) {
|
|
||||||
return "<tr>\n" +
|
|
||||||
" <td class=\"d2h-code-linenumber " + type + "\">" +
|
|
||||||
" <div class=\"line-num1\">" + valueOrEmpty(oldNumber) + "</div>" +
|
|
||||||
" <div class=\"line-num2\">" + valueOrEmpty(newNumber) + "</div>" +
|
|
||||||
" </td>\n" +
|
|
||||||
" <td class=\"" + type + "\">" +
|
|
||||||
" <div class=\"d2h-code-line " + type + "\">" + content + "</div>" +
|
|
||||||
" </td>\n" +
|
|
||||||
"</tr>\n";
|
|
||||||
};
|
|
||||||
|
|
||||||
/*
|
|
||||||
* Side By Side HTML (work in progress)
|
|
||||||
*/
|
|
||||||
|
|
||||||
var generateSideBySideJsonHtml = function (diffFiles) {
|
|
||||||
return "<div class=\"d2h-wrapper\">\n" +
|
|
||||||
diffFiles.map(function (file) {
|
|
||||||
var diffs = generateSideBySideFileHtml(file);
|
|
||||||
|
|
||||||
return "<div class=\"d2h-file-wrapper\" data-lang=\"" + file.language + "\">\n" +
|
|
||||||
" <div class=\"d2h-file-header\">\n" +
|
|
||||||
" <div class=\"d2h-file-stats\">\n" +
|
|
||||||
" <span class=\"d2h-lines-added\">+" + file.addedLines + "</span>\n" +
|
|
||||||
" <span class=\"d2h-lines-deleted\">-" + file.deletedLines + "</span>\n" +
|
|
||||||
" </div>\n" +
|
|
||||||
" <div class=\"d2h-file-name\">" + getDiffName(file.oldName, file.newName) + "</div>\n" +
|
|
||||||
" </div>\n" +
|
|
||||||
" <div class=\"d2h-files-diff\">\n" +
|
|
||||||
" <div class=\"d2h-file-side-diff\">\n" +
|
|
||||||
" <div class=\"d2h-code-wrapper\">\n" +
|
|
||||||
" <table class=\"d2h-diff-table\">\n" +
|
|
||||||
" <tbody class=\"d2h-diff-tbody\">\n" +
|
|
||||||
" " + diffs.left +
|
|
||||||
" </tbody>\n" +
|
|
||||||
" </table>\n" +
|
|
||||||
" </div>\n" +
|
|
||||||
" </div>\n" +
|
|
||||||
" <div class=\"d2h-file-side-diff\">\n" +
|
|
||||||
" <div class=\"d2h-code-wrapper\">\n" +
|
|
||||||
" <table class=\"d2h-diff-table\">\n" +
|
|
||||||
" <tbody class=\"d2h-diff-tbody\">\n" +
|
|
||||||
" " + diffs.right +
|
|
||||||
" </tbody>\n" +
|
|
||||||
" </table>\n" +
|
|
||||||
" </div>\n" +
|
|
||||||
" </div>\n" +
|
|
||||||
" </div>\n" +
|
|
||||||
" </div>\n";
|
|
||||||
}).join("\n") +
|
|
||||||
"</div>\n";
|
|
||||||
};
|
|
||||||
|
|
||||||
var generateSideBySideFileHtml = function (file) {
|
|
||||||
var fileHtml = {};
|
|
||||||
fileHtml.left = "";
|
|
||||||
fileHtml.right = "";
|
|
||||||
|
|
||||||
file.blocks.forEach(function (block) {
|
|
||||||
|
|
||||||
fileHtml.left += "<tr>\n" +
|
|
||||||
" <td class=\"d2h-code-side-linenumber " + LINE_TYPE.INFO + "\"></td>\n" +
|
|
||||||
" <td class=\"" + LINE_TYPE.INFO + "\">" +
|
|
||||||
" <div class=\"d2h-code-side-line " + LINE_TYPE.INFO + "\">" + escape(block.header) + "</div>" +
|
|
||||||
" </td>\n" +
|
|
||||||
"</tr>\n";
|
|
||||||
|
|
||||||
fileHtml.right += "<tr>\n" +
|
|
||||||
" <td class=\"d2h-code-side-linenumber " + LINE_TYPE.INFO + "\"></td>\n" +
|
|
||||||
" <td class=\"" + LINE_TYPE.INFO + "\">" +
|
|
||||||
" <div class=\"d2h-code-side-line " + LINE_TYPE.INFO + "\"></div>" +
|
|
||||||
" </td>\n" +
|
|
||||||
"</tr>\n";
|
|
||||||
|
|
||||||
var oldLines = [], newLines = [];
|
|
||||||
|
|
||||||
for (var i = 0; i < block.lines.length; i++) {
|
|
||||||
var line = block.lines[i];
|
|
||||||
var escapedLine = escape(line.content);
|
|
||||||
|
|
||||||
if (line.type == LINE_TYPE.CONTEXT && !oldLines.length && !newLines.length) {
|
|
||||||
fileHtml.left += generateSingleLineHtml(line.type, line.oldNumber, escapedLine);
|
|
||||||
fileHtml.right += generateSingleLineHtml(line.type, line.newNumber, escapedLine);
|
|
||||||
} else if (line.type == LINE_TYPE.INSERTS && !oldLines.length && !newLines.length) {
|
|
||||||
fileHtml.left += generateSingleLineHtml(LINE_TYPE.CONTEXT, "", "", "");
|
|
||||||
fileHtml.right += generateSingleLineHtml(line.type, line.newNumber, escapedLine);
|
|
||||||
} else if (line.type == LINE_TYPE.DELETES && !newLines.length) {
|
|
||||||
oldLines.push(line);
|
|
||||||
} else if (line.type == LINE_TYPE.INSERTS && oldLines.length > newLines.length) {
|
|
||||||
newLines.push(line);
|
|
||||||
} else {
|
|
||||||
var j = 0;
|
|
||||||
var oldLine, newLine;
|
|
||||||
var oldEscapedLine, newEscapedLine;
|
|
||||||
|
|
||||||
if (oldLines.length === newLines.length) {
|
|
||||||
for (j = 0; j < oldLines.length; j++) {
|
|
||||||
oldLine = oldLines[j];
|
|
||||||
newLine = newLines[j];
|
|
||||||
oldEscapedLine = escape(oldLine.content);
|
|
||||||
newEscapedLine = escape(newLine.content);
|
|
||||||
|
|
||||||
var diff = diffHighlight(oldEscapedLine, newEscapedLine, file.isTripleDiff);
|
|
||||||
|
|
||||||
fileHtml.left += generateSingleLineHtml(oldLine.type, oldLine.oldNumber, diff.o);
|
|
||||||
fileHtml.right += generateSingleLineHtml(newLine.type, newLine.newNumber, diff.n);
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
var maxLinesNumber = Math.max(oldLines.length, newLines.length);
|
|
||||||
for (j = 0; j < maxLinesNumber; j++) {
|
|
||||||
oldLine = oldLines[j];
|
|
||||||
newLine = newLines[j];
|
|
||||||
|
|
||||||
if (oldLine && newLine) {
|
|
||||||
fileHtml.left += generateSingleLineHtml(oldLine.type, oldLine.oldNumber, escape(oldLine.content));
|
|
||||||
fileHtml.right += generateSingleLineHtml(newLine.type, newLine.newNumber, escape(newLine.content));
|
|
||||||
} else if (oldLine) {
|
|
||||||
fileHtml.left += generateSingleLineHtml(oldLine.type, oldLine.oldNumber, escape(oldLine.content));
|
|
||||||
fileHtml.right += generateSingleLineHtml(LINE_TYPE.CONTEXT, "", "", "");
|
|
||||||
} else if (newLine) {
|
|
||||||
fileHtml.left += generateSingleLineHtml(LINE_TYPE.CONTEXT, "", "", "");
|
|
||||||
fileHtml.right += generateSingleLineHtml(newLine.type, newLine.newNumber, escape(newLine.content));
|
|
||||||
} else {
|
|
||||||
console.error("How did it get here?");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
oldLines = [];
|
|
||||||
newLines = [];
|
|
||||||
i--;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
return fileHtml;
|
|
||||||
};
|
|
||||||
|
|
||||||
var generateSingleLineHtml = function (type, number, content) {
|
|
||||||
return "<tr>\n" +
|
|
||||||
" <td class=\"d2h-code-side-linenumber " + type + "\">" + number + "</td>\n" +
|
|
||||||
" <td class=\"" + type + "\">" +
|
|
||||||
" <div class=\"d2h-code-side-line " + type + "\">" + content + "</div>" +
|
|
||||||
" </td>\n" +
|
|
||||||
" </tr>\n";
|
|
||||||
};
|
|
||||||
|
|
||||||
/*
|
|
||||||
* HTML Helpers
|
|
||||||
*/
|
|
||||||
|
|
||||||
var getDiffName = function (oldFilename, newFilename) {
|
|
||||||
if (oldFilename && newFilename && oldFilename !== newFilename) {
|
|
||||||
return oldFilename + " -> " + newFilename;
|
|
||||||
} else if (newFilename) {
|
|
||||||
return newFilename;
|
|
||||||
} else if (oldFilename) {
|
|
||||||
return oldFilename;
|
|
||||||
} else {
|
|
||||||
return "Unknown filename";
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
var removeIns = function (line) {
|
|
||||||
return line.replace(/(<ins>((.|\n)*?)<\/ins>)/g, "");
|
|
||||||
};
|
|
||||||
|
|
||||||
var removeDel = function (line) {
|
|
||||||
return line.replace(/(<del>((.|\n)*?)<\/del>)/g, "");
|
|
||||||
};
|
|
||||||
|
|
||||||
/*
|
|
||||||
* Utils
|
|
||||||
*/
|
|
||||||
|
|
||||||
function escape(str) {
|
|
||||||
return str.slice(0)
|
|
||||||
.replace(/&/g, "&")
|
|
||||||
.replace(/</g, "<")
|
|
||||||
.replace(/>/g, ">")
|
|
||||||
.replace(/\t/g, " ");
|
|
||||||
}
|
|
||||||
|
|
||||||
function startsWith(str, start) {
|
|
||||||
return str.indexOf(start) === 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
function valueOrEmpty(value) {
|
|
||||||
return value ? value : "";
|
|
||||||
}
|
|
||||||
|
|
||||||
function diffHighlight(diffLine1, diffLine2, isTripleDiff) {
|
|
||||||
var lineStart1, lineStart2;
|
|
||||||
|
|
||||||
var prefixSize = 1;
|
|
||||||
|
|
||||||
if (isTripleDiff) prefixSize = 2;
|
|
||||||
|
|
||||||
lineStart1 = diffLine1.substr(0, prefixSize);
|
|
||||||
lineStart2 = diffLine2.substr(0, prefixSize);
|
|
||||||
|
|
||||||
diffLine1 = diffLine1.substr(prefixSize);
|
|
||||||
diffLine2 = diffLine2.substr(prefixSize);
|
|
||||||
|
|
||||||
var diff = JsDiff.diffChars(diffLine1, diffLine2);
|
|
||||||
|
|
||||||
var highlightedLine = "";
|
|
||||||
|
|
||||||
diff.forEach(function (part) {
|
|
||||||
var elemType = part.added ? 'ins' : part.removed ? 'del' : null;
|
|
||||||
|
|
||||||
if (elemType !== null) highlightedLine += "<" + elemType + ">" + part.value + "</" + elemType + ">";
|
|
||||||
else highlightedLine += part.value;
|
|
||||||
});
|
|
||||||
|
|
||||||
return {
|
|
||||||
o: lineStart1 + removeIns(highlightedLine),
|
|
||||||
n: lineStart2 + removeDel(highlightedLine)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
|
||||||
1
diff2html.min.css
vendored
1
diff2html.min.css
vendored
|
|
@ -1 +0,0 @@
|
||||||
.d2h-wrapper{display:block;margin:0 auto;text-align:left;width:100%}.d2h-file-wrapper{border:1px solid #ddd;border-radius:3px;margin-bottom:1em}.d2h-file-header{padding:5px 10px;border-bottom:1px solid #d8d8d8;background-color:#f7f7f7;font:13px Helvetica,arial,freesans,clean,sans-serif,"Segoe UI Emoji","Segoe UI Symbol"}.d2h-file-stats{display:inline;font-size:12px;text-align:center;max-width:15%}.d2h-lines-added{background-color:#ceffce;border:1px solid #b4e2b4;color:#399839;border-radius:5px 0 0 5px;padding:2px;width:25px}.d2h-lines-deleted{background-color:#f7c8c8;border:1px solid #e9aeae;color:#c33;border-radius:0 5px 5px 0;padding:2px;width:25px}.d2h-file-name{display:inline;height:33px;line-height:33px;max-width:80%;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.d2h-diff-table{border-collapse:collapse;font-family:Consolas,"Liberation Mono",Menlo,Courier,monospace;font-size:12px;height:18px;line-height:18px;width:100%}.d2h-files-diff{width:100%}.d2h-file-diff{overflow-x:scroll}.d2h-file-side-diff{display:inline-block;overflow-x:scroll;width:50%;margin-right:-4px}.d2h-code-line{display:block;white-space:pre;padding:0 10px;height:18px;line-height:18px;margin-left:80px;color:inherit;overflow-x:inherit;background:0 0}.d2h-code-side-line.hljs{display:block;white-space:pre;padding:0 10px;height:18px;line-height:18px;margin-left:50px;color:inherit;overflow-x:inherit;background:0 0}.d2h-code-line del,.d2h-code-side-line del{display:inline-block;margin-top:-1px;text-decoration:none;background-color:#ffb6ba;border-radius:.2em}.d2h-code-line ins,.d2h-code-side-line ins{display:inline-block;margin-top:-1px;text-decoration:none;background-color:#97f295;border-radius:.2em}.line-num1{display:inline-block;float:left;width:30px;overflow:hidden;text-overflow:ellipsis}.line-num2{display:inline-block;float:right;width:30px;overflow:hidden;text-overflow:ellipsis}.d2h-code-linenumber{position:absolute;width:2%;min-width:65px;padding-left:10px;padding-right:10px;height:18px;line-height:18px;background-color:#fff;color:rgba(0,0,0,.3);text-align:right;border:solid #eee;border-width:0 1px;cursor:pointer}.d2h-code-side-linenumber{position:absolute;width:35px;padding-left:10px;padding-right:10px;height:18px;line-height:18px;background-color:#fff;color:rgba(0,0,0,.3);text-align:right;border:solid #eee;border-width:0 1px;cursor:pointer;overflow:hidden;text-overflow:ellipsis}.d2h-del{background-color:#fee8e9;border-color:#e9aeae}.d2h-ins{background-color:#dfd;border-color:#b4e2b4}.d2h-info{background-color:#f8fafd;color:rgba(0,0,0,.3);border-color:#d5e4f2}
|
|
||||||
1
diff2html.min.js
vendored
1
diff2html.min.js
vendored
File diff suppressed because one or more lines are too long
|
|
@ -14,11 +14,14 @@
|
||||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/styles/default.min.css">
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/styles/default.min.css">
|
||||||
<link rel="stylesheet" type="text/css" href="diff2html.css">
|
<link rel="stylesheet" type="text/css" href="diff2html.css">
|
||||||
|
|
||||||
|
|
||||||
<script src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
|
<script src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
|
||||||
|
|
||||||
<!--<script type="text/javascript" src="jsdiff.js"></script>-->
|
<!--<script type="text/javascript" src="lib/jsdiff.js"></script>-->
|
||||||
<script type="text/javascript" src="diff.js"></script>
|
<script type="text/javascript" src="lib/diff.js"></script>
|
||||||
|
|
||||||
|
<script type="text/javascript" src="src/utils.js"></script>
|
||||||
|
<script type="text/javascript" src="src/diff-parser.js"></script>
|
||||||
|
<script type="text/javascript" src="src/html-printer.js"></script>
|
||||||
<script type="text/javascript" src="diff2html.js"></script>
|
<script type="text/javascript" src="diff2html.js"></script>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/highlight.min.js"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/highlight.min.js"></script>
|
||||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/languages/scala.min.js"></script>
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.4/languages/scala.min.js"></script>
|
||||||
|
|
|
||||||
147
src/diff-parser.js
Normal file
147
src/diff-parser.js
Normal file
|
|
@ -0,0 +1,147 @@
|
||||||
|
/*
|
||||||
|
*
|
||||||
|
* Diff Parser (diff-parser.js)
|
||||||
|
* Author: rtfpessoa
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
|
||||||
|
var utils = new Utils();
|
||||||
|
|
||||||
|
var LINE_TYPE = {
|
||||||
|
INSERTS: "d2h-ins",
|
||||||
|
DELETES: "d2h-del",
|
||||||
|
CONTEXT: "d2h-cntx",
|
||||||
|
INFO: "d2h-info"
|
||||||
|
};
|
||||||
|
|
||||||
|
function DiffParser() {
|
||||||
|
}
|
||||||
|
|
||||||
|
DiffParser.prototype.LINE_TYPE = LINE_TYPE;
|
||||||
|
|
||||||
|
DiffParser.prototype.generateDiffJson = function (diffInput) {
|
||||||
|
var files = [],
|
||||||
|
currentFile = null,
|
||||||
|
currentBlock = null,
|
||||||
|
oldLine = null,
|
||||||
|
newLine = null;
|
||||||
|
|
||||||
|
var saveBlock = function () {
|
||||||
|
/* add previous block(if exists) before start a new file */
|
||||||
|
if (currentBlock) {
|
||||||
|
currentFile.blocks.push(currentBlock);
|
||||||
|
currentBlock = null;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
var saveFile = function () {
|
||||||
|
/*
|
||||||
|
* add previous file(if exists) before start a new one
|
||||||
|
* if it has name (to avoid binary files errors)
|
||||||
|
*/
|
||||||
|
if (currentFile && currentFile.newName) {
|
||||||
|
files.push(currentFile);
|
||||||
|
currentFile = null;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
var startFile = function () {
|
||||||
|
saveBlock();
|
||||||
|
saveFile();
|
||||||
|
|
||||||
|
/* create file structure */
|
||||||
|
currentFile = {};
|
||||||
|
currentFile.blocks = [];
|
||||||
|
currentFile.deletedLines = 0;
|
||||||
|
currentFile.addedLines = 0;
|
||||||
|
};
|
||||||
|
|
||||||
|
var startBlock = function (line) {
|
||||||
|
saveBlock();
|
||||||
|
|
||||||
|
var values;
|
||||||
|
|
||||||
|
if (values = /^@@ -(\d+),\d+ \+(\d+),\d+ @@.*/.exec(line)) {
|
||||||
|
currentFile.isTripleDiff = false;
|
||||||
|
} else if (values = /^@@@ -(\d+),\d+ -\d+,\d+ \+(\d+),\d+ @@@.*/.exec(line)) {
|
||||||
|
currentFile.isTripleDiff = true;
|
||||||
|
} else {
|
||||||
|
values = [0, 0];
|
||||||
|
currentFile.isTripleDiff = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
oldLine = values[1];
|
||||||
|
newLine = values[2];
|
||||||
|
|
||||||
|
/* create block metadata */
|
||||||
|
currentBlock = {};
|
||||||
|
currentBlock.lines = [];
|
||||||
|
currentBlock.oldStartLine = oldLine;
|
||||||
|
currentBlock.newStartLine = newLine;
|
||||||
|
currentBlock.header = line;
|
||||||
|
};
|
||||||
|
|
||||||
|
var createLine = function (line) {
|
||||||
|
var currentLine = {};
|
||||||
|
currentLine.content = line;
|
||||||
|
|
||||||
|
/* fill the line data */
|
||||||
|
if (utils.startsWith(line, "+") || utils.startsWith(line, " +")) {
|
||||||
|
currentFile.addedLines++;
|
||||||
|
|
||||||
|
currentLine.type = LINE_TYPE.INSERTS;
|
||||||
|
currentLine.oldNumber = null;
|
||||||
|
currentLine.newNumber = newLine++;
|
||||||
|
|
||||||
|
currentBlock.lines.push(currentLine);
|
||||||
|
|
||||||
|
} else if (utils.startsWith(line, "-") || utils.startsWith(line, " -")) {
|
||||||
|
currentFile.deletedLines++;
|
||||||
|
|
||||||
|
currentLine.type = LINE_TYPE.DELETES;
|
||||||
|
currentLine.oldNumber = oldLine++;
|
||||||
|
currentLine.newNumber = null;
|
||||||
|
|
||||||
|
currentBlock.lines.push(currentLine);
|
||||||
|
|
||||||
|
} else {
|
||||||
|
currentLine.type = LINE_TYPE.CONTEXT;
|
||||||
|
currentLine.oldNumber = oldLine++;
|
||||||
|
currentLine.newNumber = newLine++;
|
||||||
|
|
||||||
|
currentBlock.lines.push(currentLine);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
var diffLines = diffInput.split("\n");
|
||||||
|
diffLines.forEach(function (line) {
|
||||||
|
// Unmerged paths, and possibly other non-diffable files
|
||||||
|
// https://github.com/scottgonzalez/pretty-diff/issues/11
|
||||||
|
// Also, remove some useless lines
|
||||||
|
if (!line || utils.startsWith(line, "*") ||
|
||||||
|
utils.startsWith(line, "new") || utils.startsWith(line, "index")) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
var values = [];
|
||||||
|
if (utils.startsWith(line, "diff")) {
|
||||||
|
startFile();
|
||||||
|
} else if (currentFile && !currentFile.oldName && (values = /^--- a\/(\S+).*$/.exec(line))) {
|
||||||
|
currentFile.oldName = values[1];
|
||||||
|
} else if (currentFile && !currentFile.newName && (values = /^\+\+\+ [b]?\/(\S+).*$/.exec(line))) {
|
||||||
|
currentFile.newName = values[1];
|
||||||
|
|
||||||
|
var fileSplit = currentFile.newName.split(".");
|
||||||
|
currentFile.language = fileSplit[fileSplit.length - 1];
|
||||||
|
} else if (currentFile && utils.startsWith(line, "@@")) {
|
||||||
|
startBlock(line);
|
||||||
|
} else if (currentBlock) {
|
||||||
|
createLine(line);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
saveBlock();
|
||||||
|
saveFile();
|
||||||
|
|
||||||
|
return files;
|
||||||
|
};
|
||||||
310
src/html-printer.js
Normal file
310
src/html-printer.js
Normal file
|
|
@ -0,0 +1,310 @@
|
||||||
|
/*
|
||||||
|
*
|
||||||
|
* HtmlPrinter (html-printer.js)
|
||||||
|
* Author: rtfpessoa
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
|
||||||
|
var diffParser = new DiffParser();
|
||||||
|
var utils = new Utils();
|
||||||
|
var jsDiff = JsDiff;
|
||||||
|
|
||||||
|
function HtmlPrinter() {
|
||||||
|
}
|
||||||
|
|
||||||
|
HtmlPrinter.prototype.generateJsonHtml = function (diffFiles) {
|
||||||
|
return "<div class=\"d2h-wrapper\">\n" +
|
||||||
|
diffFiles.map(function (file) {
|
||||||
|
return "<div class=\"d2h-file-wrapper\" data-lang=\"" + file.language + "\">\n" +
|
||||||
|
" <div class=\"d2h-file-header\">\n" +
|
||||||
|
" <div class=\"d2h-file-stats\">\n" +
|
||||||
|
" <span class=\"d2h-lines-added\">+" + file.addedLines + "</span>\n" +
|
||||||
|
" <span class=\"d2h-lines-deleted\">-" + file.deletedLines + "</span>\n" +
|
||||||
|
" </div>\n" +
|
||||||
|
" <div class=\"d2h-file-name\">" + getDiffName(file.oldName, file.newName) + "</div>\n" +
|
||||||
|
" </div>\n" +
|
||||||
|
" <div class=\"d2h-file-diff\">\n" +
|
||||||
|
" <div class=\"d2h-code-wrapper\">\n" +
|
||||||
|
" <table class=\"d2h-diff-table\">\n" +
|
||||||
|
" <tbody class=\"d2h-diff-tbody\">\n" +
|
||||||
|
" " + generateFileHtml(file) +
|
||||||
|
" </tbody>\n" +
|
||||||
|
" </table>\n" +
|
||||||
|
" </div>\n" +
|
||||||
|
" </div>\n" +
|
||||||
|
" </div>\n";
|
||||||
|
}).join("\n") +
|
||||||
|
"</div>\n";
|
||||||
|
};
|
||||||
|
|
||||||
|
var generateFileHtml = function (file) {
|
||||||
|
return file.blocks.map(function (block) {
|
||||||
|
|
||||||
|
var lines = "<tr>\n" +
|
||||||
|
" <td class=\"d2h-code-linenumber " + diffParser.LINE_TYPE.INFO + "\"></td>\n" +
|
||||||
|
" <td class=\"" + diffParser.LINE_TYPE.INFO + "\">" +
|
||||||
|
" <div class=\"d2h-code-line " + diffParser.LINE_TYPE.INFO + "\">" + utils.escape(block.header) + "</div>" +
|
||||||
|
" </td>\n" +
|
||||||
|
"</tr>\n";
|
||||||
|
|
||||||
|
var oldLines = [], newLines = [];
|
||||||
|
var processedOldLines = [], processedNewLines = [];
|
||||||
|
|
||||||
|
for (var i = 0; i < block.lines.length; i++) {
|
||||||
|
var line = block.lines[i];
|
||||||
|
var escapedLine = utils.escape(line.content);
|
||||||
|
|
||||||
|
if (line.type == diffParser.LINE_TYPE.CONTEXT && !oldLines.length && !newLines.length) {
|
||||||
|
lines += generateLineHtml(line.type, line.oldNumber, line.newNumber, escapedLine);
|
||||||
|
} else if (line.type == diffParser.LINE_TYPE.INSERTS && !oldLines.length && !newLines.length) {
|
||||||
|
lines += generateLineHtml(line.type, line.oldNumber, line.newNumber, escapedLine);
|
||||||
|
} else if (line.type == diffParser.LINE_TYPE.DELETES && !newLines.length) {
|
||||||
|
oldLines.push(line);
|
||||||
|
} else if (line.type == diffParser.LINE_TYPE.INSERTS && oldLines.length > newLines.length) {
|
||||||
|
newLines.push(line);
|
||||||
|
} else {
|
||||||
|
var j = 0;
|
||||||
|
var oldLine, newLine;
|
||||||
|
var oldEscapedLine, newEscapedLine;
|
||||||
|
|
||||||
|
if (oldLines.length === newLines.length) {
|
||||||
|
for (j = 0; j < oldLines.length; j++) {
|
||||||
|
oldLine = oldLines[j];
|
||||||
|
newLine = newLines[j];
|
||||||
|
oldEscapedLine = utils.escape(oldLine.content);
|
||||||
|
newEscapedLine = utils.escape(newLine.content);
|
||||||
|
|
||||||
|
var diff = diffHighlight(oldEscapedLine, newEscapedLine, file.isTripleDiff);
|
||||||
|
|
||||||
|
processedOldLines += generateLineHtml(oldLine.type, oldLine.oldNumber, oldLine.newNumber, diff.o);
|
||||||
|
processedNewLines += generateLineHtml(newLine.type, newLine.oldNumber, newLine.newNumber, diff.n);
|
||||||
|
}
|
||||||
|
|
||||||
|
lines += processedOldLines + processedNewLines;
|
||||||
|
} else {
|
||||||
|
for (j = 0; j < oldLines.length; j++) {
|
||||||
|
oldLine = oldLines[j];
|
||||||
|
oldEscapedLine = utils.escape(oldLine.content);
|
||||||
|
lines += generateLineHtml(oldLine.type, oldLine.oldNumber, oldLine.newNumber, oldEscapedLine);
|
||||||
|
}
|
||||||
|
|
||||||
|
for (j = 0; j < newLines.length; j++) {
|
||||||
|
newLine = newLines[j];
|
||||||
|
newEscapedLine = utils.escape(newLine.content);
|
||||||
|
lines += generateLineHtml(newLine.type, newLine.oldNumber, newLine.newNumber, newEscapedLine);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
oldLines = [];
|
||||||
|
newLines = [];
|
||||||
|
processedOldLines = [];
|
||||||
|
processedNewLines = [];
|
||||||
|
i--;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return lines;
|
||||||
|
}).join("\n");
|
||||||
|
};
|
||||||
|
|
||||||
|
var generateLineHtml = function (type, oldNumber, newNumber, content) {
|
||||||
|
return "<tr>\n" +
|
||||||
|
" <td class=\"d2h-code-linenumber " + type + "\">" +
|
||||||
|
" <div class=\"line-num1\">" + utils.valueOrEmpty(oldNumber) + "</div>" +
|
||||||
|
" <div class=\"line-num2\">" + utils.valueOrEmpty(newNumber) + "</div>" +
|
||||||
|
" </td>\n" +
|
||||||
|
" <td class=\"" + type + "\">" +
|
||||||
|
" <div class=\"d2h-code-line " + type + "\">" + content + "</div>" +
|
||||||
|
" </td>\n" +
|
||||||
|
"</tr>\n";
|
||||||
|
};
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Side By Side HTML
|
||||||
|
*/
|
||||||
|
|
||||||
|
HtmlPrinter.prototype.generateSideBySideJsonHtml = function (diffFiles) {
|
||||||
|
return "<div class=\"d2h-wrapper\">\n" +
|
||||||
|
diffFiles.map(function (file) {
|
||||||
|
var diffs = generateSideBySideFileHtml(file);
|
||||||
|
|
||||||
|
return "<div class=\"d2h-file-wrapper\" data-lang=\"" + file.language + "\">\n" +
|
||||||
|
" <div class=\"d2h-file-header\">\n" +
|
||||||
|
" <div class=\"d2h-file-stats\">\n" +
|
||||||
|
" <span class=\"d2h-lines-added\">+" + file.addedLines + "</span>\n" +
|
||||||
|
" <span class=\"d2h-lines-deleted\">-" + file.deletedLines + "</span>\n" +
|
||||||
|
" </div>\n" +
|
||||||
|
" <div class=\"d2h-file-name\">" + getDiffName(file.oldName, file.newName) + "</div>\n" +
|
||||||
|
" </div>\n" +
|
||||||
|
" <div class=\"d2h-files-diff\">\n" +
|
||||||
|
" <div class=\"d2h-file-side-diff\">\n" +
|
||||||
|
" <div class=\"d2h-code-wrapper\">\n" +
|
||||||
|
" <table class=\"d2h-diff-table\">\n" +
|
||||||
|
" <tbody class=\"d2h-diff-tbody\">\n" +
|
||||||
|
" " + diffs.left +
|
||||||
|
" </tbody>\n" +
|
||||||
|
" </table>\n" +
|
||||||
|
" </div>\n" +
|
||||||
|
" </div>\n" +
|
||||||
|
" <div class=\"d2h-file-side-diff\">\n" +
|
||||||
|
" <div class=\"d2h-code-wrapper\">\n" +
|
||||||
|
" <table class=\"d2h-diff-table\">\n" +
|
||||||
|
" <tbody class=\"d2h-diff-tbody\">\n" +
|
||||||
|
" " + diffs.right +
|
||||||
|
" </tbody>\n" +
|
||||||
|
" </table>\n" +
|
||||||
|
" </div>\n" +
|
||||||
|
" </div>\n" +
|
||||||
|
" </div>\n" +
|
||||||
|
" </div>\n";
|
||||||
|
}).join("\n") +
|
||||||
|
"</div>\n";
|
||||||
|
};
|
||||||
|
|
||||||
|
var generateSideBySideFileHtml = function (file) {
|
||||||
|
var fileHtml = {};
|
||||||
|
fileHtml.left = "";
|
||||||
|
fileHtml.right = "";
|
||||||
|
|
||||||
|
file.blocks.forEach(function (block) {
|
||||||
|
|
||||||
|
fileHtml.left += "<tr>\n" +
|
||||||
|
" <td class=\"d2h-code-side-linenumber " + diffParser.LINE_TYPE.INFO + "\"></td>\n" +
|
||||||
|
" <td class=\"" + diffParser.LINE_TYPE.INFO + "\">" +
|
||||||
|
" <div class=\"d2h-code-side-line " + diffParser.LINE_TYPE.INFO + "\">" + utils.escape(block.header) + "</div>" +
|
||||||
|
" </td>\n" +
|
||||||
|
"</tr>\n";
|
||||||
|
|
||||||
|
fileHtml.right += "<tr>\n" +
|
||||||
|
" <td class=\"d2h-code-side-linenumber " + diffParser.LINE_TYPE.INFO + "\"></td>\n" +
|
||||||
|
" <td class=\"" + diffParser.LINE_TYPE.INFO + "\">" +
|
||||||
|
" <div class=\"d2h-code-side-line " + diffParser.LINE_TYPE.INFO + "\"></div>" +
|
||||||
|
" </td>\n" +
|
||||||
|
"</tr>\n";
|
||||||
|
|
||||||
|
var oldLines = [], newLines = [];
|
||||||
|
|
||||||
|
for (var i = 0; i < block.lines.length; i++) {
|
||||||
|
var line = block.lines[i];
|
||||||
|
var escapedLine = utils.escape(line.content);
|
||||||
|
|
||||||
|
if (line.type == diffParser.LINE_TYPE.CONTEXT && !oldLines.length && !newLines.length) {
|
||||||
|
fileHtml.left += generateSingleLineHtml(line.type, line.oldNumber, escapedLine);
|
||||||
|
fileHtml.right += generateSingleLineHtml(line.type, line.newNumber, escapedLine);
|
||||||
|
} else if (line.type == diffParser.LINE_TYPE.INSERTS && !oldLines.length && !newLines.length) {
|
||||||
|
fileHtml.left += generateSingleLineHtml(diffParser.LINE_TYPE.CONTEXT, "", "", "");
|
||||||
|
fileHtml.right += generateSingleLineHtml(line.type, line.newNumber, escapedLine);
|
||||||
|
} else if (line.type == diffParser.LINE_TYPE.DELETES && !newLines.length) {
|
||||||
|
oldLines.push(line);
|
||||||
|
} else if (line.type == diffParser.LINE_TYPE.INSERTS && oldLines.length > newLines.length) {
|
||||||
|
newLines.push(line);
|
||||||
|
} else {
|
||||||
|
var j = 0;
|
||||||
|
var oldLine, newLine;
|
||||||
|
var oldEscapedLine, newEscapedLine;
|
||||||
|
|
||||||
|
if (oldLines.length === newLines.length) {
|
||||||
|
for (j = 0; j < oldLines.length; j++) {
|
||||||
|
oldLine = oldLines[j];
|
||||||
|
newLine = newLines[j];
|
||||||
|
oldEscapedLine = utils.escape(oldLine.content);
|
||||||
|
newEscapedLine = utils.escape(newLine.content);
|
||||||
|
|
||||||
|
var diff = diffHighlight(oldEscapedLine, newEscapedLine, file.isTripleDiff);
|
||||||
|
|
||||||
|
fileHtml.left += generateSingleLineHtml(oldLine.type, oldLine.oldNumber, diff.o);
|
||||||
|
fileHtml.right += generateSingleLineHtml(newLine.type, newLine.newNumber, diff.n);
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
var maxLinesNumber = Math.max(oldLines.length, newLines.length);
|
||||||
|
for (j = 0; j < maxLinesNumber; j++) {
|
||||||
|
oldLine = oldLines[j];
|
||||||
|
newLine = newLines[j];
|
||||||
|
|
||||||
|
if (oldLine && newLine) {
|
||||||
|
fileHtml.left += generateSingleLineHtml(oldLine.type, oldLine.oldNumber, utils.escape(oldLine.content));
|
||||||
|
fileHtml.right += generateSingleLineHtml(newLine.type, newLine.newNumber, utils.escape(newLine.content));
|
||||||
|
} else if (oldLine) {
|
||||||
|
fileHtml.left += generateSingleLineHtml(oldLine.type, oldLine.oldNumber, utils.escape(oldLine.content));
|
||||||
|
fileHtml.right += generateSingleLineHtml(diffParser.LINE_TYPE.CONTEXT, "", "", "");
|
||||||
|
} else if (newLine) {
|
||||||
|
fileHtml.left += generateSingleLineHtml(diffParser.LINE_TYPE.CONTEXT, "", "", "");
|
||||||
|
fileHtml.right += generateSingleLineHtml(newLine.type, newLine.newNumber, utils.escape(newLine.content));
|
||||||
|
} else {
|
||||||
|
console.error("How did it get here?");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
oldLines = [];
|
||||||
|
newLines = [];
|
||||||
|
i--;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
return fileHtml;
|
||||||
|
};
|
||||||
|
|
||||||
|
var generateSingleLineHtml = function (type, number, content) {
|
||||||
|
return "<tr>\n" +
|
||||||
|
" <td class=\"d2h-code-side-linenumber " + type + "\">" + number + "</td>\n" +
|
||||||
|
" <td class=\"" + type + "\">" +
|
||||||
|
" <div class=\"d2h-code-side-line " + type + "\">" + content + "</div>" +
|
||||||
|
" </td>\n" +
|
||||||
|
" </tr>\n";
|
||||||
|
};
|
||||||
|
|
||||||
|
/*
|
||||||
|
* HTML Helpers
|
||||||
|
*/
|
||||||
|
|
||||||
|
var getDiffName = function (oldFilename, newFilename) {
|
||||||
|
if (oldFilename && newFilename && oldFilename !== newFilename) {
|
||||||
|
return oldFilename + " -> " + newFilename;
|
||||||
|
} else if (newFilename) {
|
||||||
|
return newFilename;
|
||||||
|
} else if (oldFilename) {
|
||||||
|
return oldFilename;
|
||||||
|
} else {
|
||||||
|
return "Unknown filename";
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
var removeIns = function (line) {
|
||||||
|
return line.replace(/(<ins>((.|\n)*?)<\/ins>)/g, "");
|
||||||
|
};
|
||||||
|
|
||||||
|
var removeDel = function (line) {
|
||||||
|
return line.replace(/(<del>((.|\n)*?)<\/del>)/g, "");
|
||||||
|
};
|
||||||
|
|
||||||
|
function diffHighlight(diffLine1, diffLine2, isTripleDiff) {
|
||||||
|
var lineStart1, lineStart2;
|
||||||
|
|
||||||
|
var prefixSize = 1;
|
||||||
|
|
||||||
|
if (isTripleDiff) prefixSize = 2;
|
||||||
|
|
||||||
|
lineStart1 = diffLine1.substr(0, prefixSize);
|
||||||
|
lineStart2 = diffLine2.substr(0, prefixSize);
|
||||||
|
|
||||||
|
diffLine1 = diffLine1.substr(prefixSize);
|
||||||
|
diffLine2 = diffLine2.substr(prefixSize);
|
||||||
|
|
||||||
|
var diff = jsDiff.diffChars(diffLine1, diffLine2);
|
||||||
|
|
||||||
|
var highlightedLine = "";
|
||||||
|
|
||||||
|
diff.forEach(function (part) {
|
||||||
|
var elemType = part.added ? 'ins' : part.removed ? 'del' : null;
|
||||||
|
|
||||||
|
if (elemType !== null) highlightedLine += "<" + elemType + ">" + part.value + "</" + elemType + ">";
|
||||||
|
else highlightedLine += part.value;
|
||||||
|
});
|
||||||
|
|
||||||
|
return {
|
||||||
|
o: lineStart1 + removeIns(highlightedLine),
|
||||||
|
n: lineStart2 + removeDel(highlightedLine)
|
||||||
|
}
|
||||||
|
}
|
||||||
25
src/utils.js
Normal file
25
src/utils.js
Normal file
|
|
@ -0,0 +1,25 @@
|
||||||
|
/*
|
||||||
|
*
|
||||||
|
* Utils (utils.js)
|
||||||
|
* Author: rtfpessoa
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
|
||||||
|
function Utils() {
|
||||||
|
}
|
||||||
|
|
||||||
|
Utils.prototype.escape = function (str) {
|
||||||
|
return str.slice(0)
|
||||||
|
.replace(/&/g, "&")
|
||||||
|
.replace(/</g, "<")
|
||||||
|
.replace(/>/g, ">")
|
||||||
|
.replace(/\t/g, " ");
|
||||||
|
};
|
||||||
|
|
||||||
|
Utils.prototype.startsWith = function (str, start) {
|
||||||
|
return str.indexOf(start) === 0;
|
||||||
|
};
|
||||||
|
|
||||||
|
Utils.prototype.valueOrEmpty = function (value) {
|
||||||
|
return value ? value : "";
|
||||||
|
};
|
||||||
Loading…
Reference in a new issue