update from nodejs cleanup

This commit is contained in:
Rodrigo Fernandes 2015-04-11 21:48:55 +01:00
parent e2725db461
commit 10b2c89a25
6 changed files with 396 additions and 424 deletions

View file

@ -2,8 +2,6 @@
* *
* Diff to HTML (diff2html.css) * Diff to HTML (diff2html.css)
* Author: rtfpessoa * Author: rtfpessoa
* Date: Friday 29 August 2014
* Last Update: Friday 30 January 2015
* *
*/ */

View file

@ -2,448 +2,421 @@
* *
* Diff to HTML (diff2html.js) * Diff to HTML (diff2html.js)
* Author: rtfpessoa * Author: rtfpessoa
* Date: Friday 29 August 2014
* Last Update: Sunday 2 February 2015
* *
* Diff command: * Diff commands:
* git diff * git diff
*/ */
(function (window) { var LINE_TYPE = {
var ClassVariable; INSERTS: "d2h-ins",
DELETES: "d2h-del",
CONTEXT: "d2h-cntx",
INFO: "d2h-info"
};
ClassVariable = (function () { function Diff2Html() {
}
var LINE_TYPE = { /*
INSERTS: "d2h-ins", * Generates pretty html from string diff input
DELETES: "d2h-del", */
CONTEXT: "d2h-cntx", Diff2Html.prototype.getPrettyHtmlFromDiff = function (diffInput) {
INFO: "d2h-info" var diffJson = generateDiffJson(diffInput);
}; return generateJsonHtml(diffJson);
};
function Diff2Html() { /*
* Generates json object from string diff input
*/
Diff2Html.prototype.getJsonFromDiff = function (diffInput) {
return generateDiffJson(diffInput);
};
/*
* Generates pretty html from a json object
*/
Diff2Html.prototype.getPrettyHtmlFromJson = function (diffJson) {
return generateJsonHtml(diffJson);
};
/*
* Generates pretty side by side html from string diff input
*/
Diff2Html.prototype.getPrettySideBySideHtmlFromDiff = function (diffInput) {
var diffJson = generateDiffJson(diffInput);
return generateSideBySideJsonHtml(diffJson);
};
/*
* Generates pretty side by side html from a json object
*/
Diff2Html.prototype.getPrettySideBySideHtmlFromJson = function (diffJson) {
return 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 = /^@@ -(\d+),\d+ \+(\d+),\d+ @@.*/.exec(line) ||
/^@@@ -(\d+),\d+ -\d+,\d+ \+(\d+),\d+ @@@.*/.exec(line) ||
[0, 0, 0];
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 = [];
* Generates pretty html from string diff input if (startsWith(line, "diff")) {
*/ startFile();
Diff2Html.prototype.getPrettyHtmlFromDiff = function (diffInput) { } else if (currentFile && !currentFile.oldName && (values = /^--- a\/(\S+).*$/.exec(line))) {
var diffJson = generateDiffJson(diffInput); currentFile.oldName = values[1];
return generateJsonHtml(diffJson); } else if (currentFile && !currentFile.newName && (values = /^\+\+\+ [b]?\/(\S+).*$/.exec(line))) {
}; currentFile.newName = values[1];
/* var fileSplit = currentFile.newName.split(".");
* Generates json object from string diff input currentFile.language = fileSplit[fileSplit.length - 1];
*/ } else if (currentFile && startsWith(line, "@@")) {
Diff2Html.prototype.getJsonFromDiff = function (diffInput) { startBlock(line);
return generateDiffJson(diffInput); } else if (currentBlock) {
}; createLine(line);
}
});
/* saveBlock();
* Generates pretty html from a json object saveFile();
*/
Diff2Html.prototype.getPrettyHtmlFromJson = function (diffJson) {
return generateJsonHtml(diffJson);
};
/* return files;
* Generates pretty side by side html from string diff input };
*/
Diff2Html.prototype.getPrettySideBySideHtmlFromDiff = function (diffInput) {
var diffJson = generateDiffJson(diffInput);
return generateSideBySideJsonHtml(diffJson);
};
/* /*
* Generates pretty side by side html from a json object * Line By Line HTML
*/ */
Diff2Html.prototype.getPrettySideBySideHtmlFromJson = function (diffJson) {
return generateSideBySideJsonHtml(diffJson);
};
var generateDiffJson = function (diffInput) { var generateJsonHtml = function (diffFiles) {
var files = [], return "<div class=\"d2h-wrapper\">\n" +
currentFile = null, diffFiles.map(function (file) {
currentBlock = null, return "<div class=\"d2h-file-wrapper\" data-lang=\"" + file.language + "\">\n" +
oldLine = null, " <div class=\"d2h-file-header\">\n" +
newLine = null; " <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 saveBlock = function () { var generateFileHtml = function (file) {
/* add previous block(if exists) before start a new file */ return file.blocks.map(function (block) {
if (currentBlock) {
currentFile.blocks.push(currentBlock);
currentBlock = null;
}
};
var saveFile = function () { var lines = "<tr>\n" +
/* " <td class=\"d2h-code-linenumber " + LINE_TYPE.INFO + "\"></td>\n" +
* add previous file(if exists) before start a new one " <td class=\"" + LINE_TYPE.INFO + "\">" +
* if it has name (to avoid binary files errors) " <div class=\"d2h-code-line " + LINE_TYPE.INFO + "\">" + escape(block.header) + "</div>" +
*/ " </td>\n" +
if (currentFile && currentFile.newName) { "</tr>\n";
files.push(currentFile);
currentFile = null;
}
};
var startFile = function () { for (var i = 0; i < block.lines.length; i++) {
saveBlock(); var prevLine = block.lines[i - 1];
saveFile(); var line = block.lines[i];
var newLine = block.lines[i + 1];
var nextNewLine = block.lines[i + 2];
/* create file structure */ var isOppositeTypeTwoLineBlock =
currentFile = {}; line.type == LINE_TYPE.DELETES &&
currentFile.blocks = []; newLine && newLine.type == LINE_TYPE.INSERTS &&
currentFile.deletedLines = 0; (!nextNewLine || nextNewLine && nextNewLine.type != LINE_TYPE.INSERTS) &&
currentFile.addedLines = 0; (!prevLine || prevLine && prevLine.type != LINE_TYPE.DELETES);
};
var startBlock = function (line) { var escapedLine = escape(line.content);
saveBlock();
var values = /^@@ -(\d+),\d+ \+(\d+),\d+ @@.*/.exec(line) || if (isOppositeTypeTwoLineBlock) {
/^@@@ -(\d+),\d+ -\d+,\d+ \+(\d+),\d+ @@@.*/.exec(line) || var nextEscapedLine = escape(newLine.content);
[0, 0, 0];
oldLine = values[1]; var diff = diffHighlight(escapedLine, nextEscapedLine);
newLine = values[2];
/* create block metadata */ lines += generateLineHtml(line.type, line.oldNumber, line.newNumber, diff.o) +
currentBlock = {}; generateLineHtml(newLine.type, newLine.oldNumber, newLine.newNumber, diff.n);
currentBlock.lines = [];
currentBlock.oldStartLine = oldLine;
currentBlock.newStartLine = newLine;
currentBlock.header = line;
};
var createLine = function (line) { i++;
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";
for (var i = 0; i < block.lines.length; i++) {
var prevLine = block.lines[i - 1];
var line = block.lines[i];
var newLine = block.lines[i + 1];
var nextNewLine = block.lines[i + 2];
var isOppositeTypeTwoLineBlock =
line.type == LINE_TYPE.DELETES &&
newLine && newLine.type == LINE_TYPE.INSERTS &&
(!nextNewLine || nextNewLine && nextNewLine.type != LINE_TYPE.INSERTS) &&
(!prevLine || prevLine && prevLine.type != LINE_TYPE.DELETES);
var escapedLine = escape(line.content);
if (isOppositeTypeTwoLineBlock) {
var nextEscapedLine = escape(newLine.content);
var diff = diffHighlight(escapedLine, nextEscapedLine);
lines += generateLineHtml(line.type, line.oldNumber, line.newNumber, diff.o) +
generateLineHtml(newLine.type, newLine.oldNumber, newLine.newNumber, diff.n);
i++;
} else {
lines += generateLineHtml(line.type, line.oldNumber, line.newNumber, escapedLine);
}
}
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";
for (var i = 0; i < block.lines.length; i++) {
var prevLine = block.lines[i - 1];
var line = block.lines[i];
var newLine = block.lines[i + 1];
var nextNewLine = block.lines[i + 2];
var isOpositeTypeTwoLineBlock = line.type == LINE_TYPE.DELETES && newLine && newLine.type == LINE_TYPE.INSERTS &&
(!nextNewLine || nextNewLine && nextNewLine.type != LINE_TYPE.INSERTS) &&
(!prevLine || prevLine && prevLine.type != LINE_TYPE.DELETES);
var escapedLine = escape(line.content);
if (isOpositeTypeTwoLineBlock) {
var nextEscapedLine = escape(newLine.content);
var diff = diffHighlight(escapedLine, nextEscapedLine);
fileHtml.left += generateSingleLineHtml(line.type, line.oldNumber, diff.o);
fileHtml.right += generateSingleLineHtml(newLine.type, newLine.newNumber, diff.n);
i++;
} else if (line.type == LINE_TYPE.DELETES) {
fileHtml.left += generateSingleLineHtml(line.type, line.oldNumber, escapedLine);
fileHtml.right += generateSingleLineHtml(LINE_TYPE.CONTEXT, "", "", "");
} else if (line.type == LINE_TYPE.INSERTS) {
fileHtml.left += generateSingleLineHtml(LINE_TYPE.CONTEXT, "", "", "");
fileHtml.right += generateSingleLineHtml(line.type, line.newNumber, escapedLine);
} else {
fileHtml.left += generateSingleLineHtml(line.type, line.oldNumber, escapedLine);
fileHtml.right += generateSingleLineHtml(line.type, line.newNumber, escapedLine);
}
}
});
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 { } else {
return "Unknown filename"; lines += generateLineHtml(line.type, line.oldNumber, line.newNumber, escapedLine);
}
};
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, "&amp;")
.replace(/</g, "&lt;")
.replace(/>/g, "&gt;")
.replace(/\t/g, " ");
}
function startsWith(str, start) {
return str.indexOf(start) === 0;
}
function valueOrEmpty(value) {
return value ? value : "";
}
function diffHighlight(diffLine1, diffLine2) {
/* remove the initial -/+ to avoid always having diff in the first char */
var highlightedLine = diffString(diffLine1.substr(1), diffLine2.substr(1));
return {
o: diffLine1.charAt(0) + removeIns(highlightedLine),
n: diffLine2.charAt(0) + removeDel(highlightedLine)
} }
} }
/* singleton pattern */ return lines;
var instance; }).join("\n");
return { };
getInstance: function () {
if (instance === undefined) { var generateLineHtml = function (type, oldNumber, newNumber, content) {
instance = new Diff2Html(); return "<tr>\n" +
/* Hide the constructor so the returned objected can't be new'd */ " <td class=\"d2h-code-linenumber " + type + "\">" +
instance.constructor = null; " <div class=\"line-num1\">" + valueOrEmpty(oldNumber) + "</div>" +
} " <div class=\"line-num2\">" + valueOrEmpty(newNumber) + "</div>" +
return instance; " </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";
for (var i = 0; i < block.lines.length; i++) {
var prevLine = block.lines[i - 1];
var line = block.lines[i];
var newLine = block.lines[i + 1];
var nextNewLine = block.lines[i + 2];
var isOpositeTypeTwoLineBlock = line.type == LINE_TYPE.DELETES && newLine && newLine.type == LINE_TYPE.INSERTS &&
(!nextNewLine || nextNewLine && nextNewLine.type != LINE_TYPE.INSERTS) &&
(!prevLine || prevLine && prevLine.type != LINE_TYPE.DELETES);
var escapedLine = escape(line.content);
if (isOpositeTypeTwoLineBlock) {
var nextEscapedLine = escape(newLine.content);
var diff = diffHighlight(escapedLine, nextEscapedLine);
fileHtml.left += generateSingleLineHtml(line.type, line.oldNumber, diff.o);
fileHtml.right += generateSingleLineHtml(newLine.type, newLine.newNumber, diff.n);
i++;
} else if (line.type == LINE_TYPE.DELETES) {
fileHtml.left += generateSingleLineHtml(line.type, line.oldNumber, escapedLine);
fileHtml.right += generateSingleLineHtml(LINE_TYPE.CONTEXT, "", "", "");
} else if (line.type == LINE_TYPE.INSERTS) {
fileHtml.left += generateSingleLineHtml(LINE_TYPE.CONTEXT, "", "", "");
fileHtml.right += generateSingleLineHtml(line.type, line.newNumber, escapedLine);
} else {
fileHtml.left += generateSingleLineHtml(line.type, line.oldNumber, escapedLine);
fileHtml.right += generateSingleLineHtml(line.type, line.newNumber, escapedLine);
} }
}; }
})(); });
window.Diff2Html = ClassVariable.getInstance(); return fileHtml;
return window.Diff2Html; };
})(window); 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, "&amp;")
.replace(/</g, "&lt;")
.replace(/>/g, "&gt;")
.replace(/\t/g, " ");
}
function startsWith(str, start) {
return str.indexOf(start) === 0;
}
function valueOrEmpty(value) {
return value ? value : "";
}
function diffHighlight(diffLine1, diffLine2) {
/* remove the initial -/+ to avoid always having diff in the first char */
var highlightedLine = JsDiff(diffLine1.substr(1), diffLine2.substr(1));
return {
o: diffLine1.charAt(0) + removeIns(highlightedLine),
n: diffLine2.charAt(0) + removeDel(highlightedLine)
}
}

2
diff2html.min.css vendored
View file

@ -1 +1 @@
.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} .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}

2
diff2html.min.js vendored

File diff suppressed because one or more lines are too long

View file

@ -181,7 +181,8 @@
'-});\n'; '-});\n';
$(document).ready(function () { $(document).ready(function () {
var diffJson = Diff2Html.getJsonFromDiff(lineDiffExample); var diff2Html = new Diff2Html();
var diffJson = diff2Html.getJsonFromDiff(lineDiffExample);
var languages = diffJson.map(function (line) { var languages = diffJson.map(function (line) {
return line.language; return line.language;
@ -191,13 +192,13 @@
}); });
hljs.configure({languages: uniqueLanguages}); hljs.configure({languages: uniqueLanguages});
$("#line-by-line").html(Diff2Html.getPrettyHtmlFromJson(diffJson)); $("#line-by-line").html(diff2Html.getPrettyHtmlFromJson(diffJson));
var code = $(".d2h-code-line"); var code = $(".d2h-code-line");
code.map(function (i, line) { code.map(function (i, line) {
hljs.highlightBlock(line); hljs.highlightBlock(line);
}); });
$("#side-by-side").html(Diff2Html.getPrettySideBySideHtmlFromJson(diffJson)); $("#side-by-side").html(diff2Html.getPrettySideBySideHtmlFromJson(diffJson));
var codeSide = $(".d2h-code-side-line"); var codeSide = $(".d2h-code-side-line");
codeSide.map(function (i, line) { codeSide.map(function (i, line) {
hljs.highlightBlock(line); hljs.highlightBlock(line);

View file

@ -10,7 +10,7 @@
* http://ejohn.org/projects/javascript-diff-algorithm/ * http://ejohn.org/projects/javascript-diff-algorithm/
*/ */
function diffString(o, n) { function JsDiff(o, n) {
o = o.replace(/\s+$/, ''); o = o.replace(/\s+$/, '');
n = n.replace(/\s+$/, ''); n = n.replace(/\s+$/, '');
@ -83,7 +83,7 @@ function diff(o, n) {
for (var i = 0; i < n.length - 1; i++) { for (var i = 0; i < n.length - 1; i++) {
if (n[i].text != null && n[i + 1].text == null && n[i].row + 1 < o.length && o[n[i].row + 1].text == null && if (n[i].text != null && n[i + 1].text == null && n[i].row + 1 < o.length && o[n[i].row + 1].text == null &&
n[i + 1] == o[n[i].row + 1]) { n[i + 1] == o[n[i].row + 1]) {
n[i + 1] = {text: n[i + 1], row: n[i].row + 1}; n[i + 1] = {text: n[i + 1], row: n[i].row + 1};
o[n[i].row + 1] = {text: o[n[i].row + 1], row: i + 1}; o[n[i].row + 1] = {text: o[n[i].row + 1], row: i + 1};
} }
@ -91,7 +91,7 @@ function diff(o, n) {
for (var i = n.length - 1; i > 0; i--) { for (var i = n.length - 1; i > 0; i--) {
if (n[i].text != null && n[i - 1].text == null && n[i].row > 0 && o[n[i].row - 1].text == null && if (n[i].text != null && n[i - 1].text == null && n[i].row > 0 && o[n[i].row - 1].text == null &&
n[i - 1] == o[n[i].row - 1]) { n[i - 1] == o[n[i].row - 1]) {
n[i - 1] = {text: n[i - 1], row: n[i].row - 1}; n[i - 1] = {text: n[i - 1], row: n[i].row - 1};
o[n[i].row - 1] = {text: o[n[i].row - 1], row: i - 1}; o[n[i].row - 1] = {text: o[n[i].row - 1], row: i - 1};
} }