User:Polygnotus/Scripts/DiffCompare.js: Difference between revisions

Revision as of 21:53, 8 September 2024

Latest revision as of 10:37, 13 June 2025

(7 intermediate revisions by the same user not shown)

Line 1:

// https://github.com/google/diff-match-patch

$.ajax('https://cdn.jsdelivr.net/gh/google/diff-match-patch@master/javascript/diff_match_patch.js', {

dataType: 'script',

cache: true

}).then(function () {

console.log('diff_match_patch library loaded successfully');

const DEBUG = false;

function debug(...args) {

if (DEBUG) }{

debug('[DiffCompare]', ...args);

}

}

console.logdebug('diff_match_patch library loaded successfully');

if (typeof diff_match_patch === 'undefined') {

Line 11 ⟶ 23:

function showDiff(text1, text2) {

console.logdebug('showDiff called with:', { text1, text2 });

const dmp = new diff_match_patch();

console.logdebug('diff_match_patch instance created');

const diffs = dmp.diff_main(text1, text2);

console.logdebug('diffs created:', diffs);

dmp.diff_cleanupSemantic(diffs);

console.logdebug('diffs after cleanup:', diffs);

let html = '';

for (let i = 0; i < diffs.length; i++) {

console.logdebug(`Processing diff ${i}:`, diffs[i]);

ifconst (!Array.isArray(diffs[i])op ||= diffs[i].length !== 2) {[0];

const data console.error(`Invalid diff at index ${i}:`,= diffs[i])[1];

continue;

}

const [op, data] = diffs[i];

switch (op) {

case diff_match_patch.DIFF_INSERT-1: // DIFF_DELETE

html += '<ins style="background-color: #e6ffe6;">' + escapeHtml(data) + '</ins>';

break;

case diff_match_patch.DIFF_DELETE:

html += '<del style="background-color: #ffe6e6;">' + escapeHtml(data) + '</del>';

break;

case diff_match_patch.DIFF_EQUAL1: // DIFF_INSERT

html += '<ins style="background-color: #e6ffe6;">' + escapeHtml(data) + '</ins>';

continue break;

case 0: // break;DIFF_EQUAL

html += '<span>' + escapeHtml(data) + '</span>';

break;

Line 44 ⟶ 53:

}

}

console.logdebug('Final HTML:', html);

return html;

}

Line 61 ⟶ 70:

try {

console.logdebug('Attempting to generate diff');

const diffHtml = showDiff(oldText, newText);

console.logdebug('Diff generation successful');

console.logdebug('Diff result:', diffHtml);

// $('#diff-output').html(diffHtml);

const diffContainer = $('<div>')

// $ .attr('#id', 'diff-output').html(diffHtml);

.css({

'border': '1px solid #a2a9b1',

'padding': '10px',

'margin-bottom': '20px',

'background-color': '#f8f9fa'

})

.html('<strong>Diff Result:</strong><br>' + diffHtml);

$('#bodyContent').prepend(diffContainer);

} catch (error) {

console.error('Error generating diff:', error);