update from nodejs cleanup
This commit is contained in:
parent
e2725db461
commit
10b2c89a25
6 changed files with 396 additions and 424 deletions
|
|
@ -2,8 +2,6 @@
|
|||
*
|
||||
* Diff to HTML (diff2html.css)
|
||||
* Author: rtfpessoa
|
||||
* Date: Friday 29 August 2014
|
||||
* Last Update: Friday 30 January 2015
|
||||
*
|
||||
*/
|
||||
|
||||
|
|
|
|||
801
diff2html.js
801
diff2html.js
|
|
@ -2,448 +2,421 @@
|
|||
*
|
||||
* Diff to HTML (diff2html.js)
|
||||
* Author: rtfpessoa
|
||||
* Date: Friday 29 August 2014
|
||||
* Last Update: Sunday 2 February 2015
|
||||
*
|
||||
* Diff command:
|
||||
* Diff commands:
|
||||
* git diff
|
||||
*/
|
||||
|
||||
(function (window) {
|
||||
var ClassVariable;
|
||||
var LINE_TYPE = {
|
||||
INSERTS: "d2h-ins",
|
||||
DELETES: "d2h-del",
|
||||
CONTEXT: "d2h-cntx",
|
||||
INFO: "d2h-info"
|
||||
};
|
||||
|
||||
ClassVariable = (function () {
|
||||
function Diff2Html() {
|
||||
}
|
||||
|
||||
var LINE_TYPE = {
|
||||
INSERTS: "d2h-ins",
|
||||
DELETES: "d2h-del",
|
||||
CONTEXT: "d2h-cntx",
|
||||
INFO: "d2h-info"
|
||||
};
|
||||
/*
|
||||
* Generates pretty html from string diff input
|
||||
*/
|
||||
Diff2Html.prototype.getPrettyHtmlFromDiff = function (diffInput) {
|
||||
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;
|
||||
}
|
||||
|
||||
/*
|
||||
* Generates pretty html from string diff input
|
||||
*/
|
||||
Diff2Html.prototype.getPrettyHtmlFromDiff = function (diffInput) {
|
||||
var diffJson = generateDiffJson(diffInput);
|
||||
return generateJsonHtml(diffJson);
|
||||
};
|
||||
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];
|
||||
|
||||
/*
|
||||
* Generates json object from string diff input
|
||||
*/
|
||||
Diff2Html.prototype.getJsonFromDiff = function (diffInput) {
|
||||
return generateDiffJson(diffInput);
|
||||
};
|
||||
var fileSplit = currentFile.newName.split(".");
|
||||
currentFile.language = fileSplit[fileSplit.length - 1];
|
||||
} else if (currentFile && startsWith(line, "@@")) {
|
||||
startBlock(line);
|
||||
} else if (currentBlock) {
|
||||
createLine(line);
|
||||
}
|
||||
});
|
||||
|
||||
/*
|
||||
* Generates pretty html from a json object
|
||||
*/
|
||||
Diff2Html.prototype.getPrettyHtmlFromJson = function (diffJson) {
|
||||
return generateJsonHtml(diffJson);
|
||||
};
|
||||
saveBlock();
|
||||
saveFile();
|
||||
|
||||
/*
|
||||
* Generates pretty side by side html from string diff input
|
||||
*/
|
||||
Diff2Html.prototype.getPrettySideBySideHtmlFromDiff = function (diffInput) {
|
||||
var diffJson = generateDiffJson(diffInput);
|
||||
return generateSideBySideJsonHtml(diffJson);
|
||||
};
|
||||
return files;
|
||||
};
|
||||
|
||||
/*
|
||||
* Generates pretty side by side html from a json object
|
||||
*/
|
||||
Diff2Html.prototype.getPrettySideBySideHtmlFromJson = function (diffJson) {
|
||||
return generateSideBySideJsonHtml(diffJson);
|
||||
};
|
||||
/*
|
||||
* Line By Line HTML
|
||||
*/
|
||||
|
||||
var generateDiffJson = function (diffInput) {
|
||||
var files = [],
|
||||
currentFile = null,
|
||||
currentBlock = null,
|
||||
oldLine = null,
|
||||
newLine = null;
|
||||
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 saveBlock = function () {
|
||||
/* add previous block(if exists) before start a new file */
|
||||
if (currentBlock) {
|
||||
currentFile.blocks.push(currentBlock);
|
||||
currentBlock = null;
|
||||
}
|
||||
};
|
||||
var generateFileHtml = function (file) {
|
||||
return file.blocks.map(function (block) {
|
||||
|
||||
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 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 startFile = function () {
|
||||
saveBlock();
|
||||
saveFile();
|
||||
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];
|
||||
|
||||
/* create file structure */
|
||||
currentFile = {};
|
||||
currentFile.blocks = [];
|
||||
currentFile.deletedLines = 0;
|
||||
currentFile.addedLines = 0;
|
||||
};
|
||||
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 startBlock = function (line) {
|
||||
saveBlock();
|
||||
var escapedLine = escape(line.content);
|
||||
|
||||
var values = /^@@ -(\d+),\d+ \+(\d+),\d+ @@.*/.exec(line) ||
|
||||
/^@@@ -(\d+),\d+ -\d+,\d+ \+(\d+),\d+ @@@.*/.exec(line) ||
|
||||
[0, 0, 0];
|
||||
if (isOppositeTypeTwoLineBlock) {
|
||||
var nextEscapedLine = escape(newLine.content);
|
||||
|
||||
oldLine = values[1];
|
||||
newLine = values[2];
|
||||
var diff = diffHighlight(escapedLine, nextEscapedLine);
|
||||
|
||||
/* create block metadata */
|
||||
currentBlock = {};
|
||||
currentBlock.lines = [];
|
||||
currentBlock.oldStartLine = oldLine;
|
||||
currentBlock.newStartLine = newLine;
|
||||
currentBlock.header = line;
|
||||
};
|
||||
lines += generateLineHtml(line.type, line.oldNumber, line.newNumber, diff.o) +
|
||||
generateLineHtml(newLine.type, newLine.oldNumber, newLine.newNumber, diff.n);
|
||||
|
||||
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";
|
||||
|
||||
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;
|
||||
i++;
|
||||
} 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) {
|
||||
/* 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)
|
||||
lines += generateLineHtml(line.type, line.oldNumber, line.newNumber, escapedLine);
|
||||
}
|
||||
}
|
||||
|
||||
/* singleton pattern */
|
||||
var instance;
|
||||
return {
|
||||
getInstance: function () {
|
||||
if (instance === undefined) {
|
||||
instance = new Diff2Html();
|
||||
/* Hide the constructor so the returned objected can't be new'd */
|
||||
instance.constructor = null;
|
||||
}
|
||||
return instance;
|
||||
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);
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
})();
|
||||
});
|
||||
|
||||
window.Diff2Html = ClassVariable.getInstance();
|
||||
return window.Diff2Html;
|
||||
return fileHtml;
|
||||
};
|
||||
|
||||
})(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, "&")
|
||||
.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) {
|
||||
/* 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.js
vendored
2
diff2html.min.js
vendored
File diff suppressed because one or more lines are too long
|
|
@ -181,7 +181,8 @@
|
|||
'-});\n';
|
||||
|
||||
$(document).ready(function () {
|
||||
var diffJson = Diff2Html.getJsonFromDiff(lineDiffExample);
|
||||
var diff2Html = new Diff2Html();
|
||||
var diffJson = diff2Html.getJsonFromDiff(lineDiffExample);
|
||||
|
||||
var languages = diffJson.map(function (line) {
|
||||
return line.language;
|
||||
|
|
@ -191,13 +192,13 @@
|
|||
});
|
||||
hljs.configure({languages: uniqueLanguages});
|
||||
|
||||
$("#line-by-line").html(Diff2Html.getPrettyHtmlFromJson(diffJson));
|
||||
$("#line-by-line").html(diff2Html.getPrettyHtmlFromJson(diffJson));
|
||||
var code = $(".d2h-code-line");
|
||||
code.map(function (i, line) {
|
||||
hljs.highlightBlock(line);
|
||||
});
|
||||
|
||||
$("#side-by-side").html(Diff2Html.getPrettySideBySideHtmlFromJson(diffJson));
|
||||
$("#side-by-side").html(diff2Html.getPrettySideBySideHtmlFromJson(diffJson));
|
||||
var codeSide = $(".d2h-code-side-line");
|
||||
codeSide.map(function (i, line) {
|
||||
hljs.highlightBlock(line);
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
* http://ejohn.org/projects/javascript-diff-algorithm/
|
||||
*/
|
||||
|
||||
function diffString(o, n) {
|
||||
function JsDiff(o, n) {
|
||||
o = o.replace(/\s+$/, '');
|
||||
n = n.replace(/\s+$/, '');
|
||||
|
||||
|
|
@ -83,7 +83,7 @@ function diff(o, n) {
|
|||
|
||||
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 &&
|
||||
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};
|
||||
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--) {
|
||||
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};
|
||||
o[n[i].row - 1] = {text: o[n[i].row - 1], row: i - 1};
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue