import * as Diff from 'diff';
import Prism from 'prismjs';
import './prism-futil.js';
import 'prismjs/plugins/keep-markup/prism-keep-markup';
import 'prismjs/plugins/line-numbers/prism-line-numbers';
function wordDiff(diff, next, srcDiv, destDiv) {
let wordDiff = Diff.diffWordsWithSpace(diff.value, next.value);
for (let change of wordDiff) {
if (change.added == null && change.removed == null) {
srcDiv.appendChild(document.createTextNode(change.value));
destDiv.appendChild(document.createTextNode(change.value));
} else if (change.added) {
let span = document.createElement('span');
span.innerHTML = change.value;
span.classList = 'token diff-addition';
destDiv.appendChild(span);
} else if (change.removed) {
let span = document.createElement('span');
span.innerHTML = change.value;
span.classList = 'token diff-deletion';
srcDiv.appendChild(span);
}
}
let count = diff.count - next.count;
if (count > 0) {
let span = document.createElement('span');
span.innerHTML = "\n".repeat(count);
span.classList = 'line diff-empty';
destDiv.appendChild(span);
} else if (count < 0) {
let span = document.createElement('span');
span.innerHTML = "\n".repeat(-count);
span.classList = 'line diff-empty';
srcDiv.appendChild(span);
}
}
function lineDiff(diff, srcDiv, destDiv) {
srcDiv.innerHTML = "";
destDiv.innerHTML = "";
for (let i = 0; i < diff.length; i++) {
let change = diff[i];
if (change.added == null && change.removed == null) {
srcDiv.appendChild(
document.createTextNode(change.value)
);
destDiv.appendChild(
document.createTextNode(change.value)
);
} else if (change.removed) {
if (i + 1 < diff.length && diff[i + 1].added) {
wordDiff(change, diff[i + 1], srcDiv, destDiv);
i++;
} else {
let span = document.createElement('span');
span.innerHTML = change.value;
span.classList = 'line diff-deletion';
srcDiv.appendChild(span);
if (change.count > 0) {
let span = document.createElement('span');
span.innerHTML = "\n".repeat(change.count);
span.classList = 'line diff-empty';
destDiv.appendChild(span);
} else {
}
}
} else if (change.added) {
let span = document.createElement('span');
span.innerHTML = change.value;
span.classList.add('line');
span.classList.add('diff-addition');
destDiv.appendChild(span);
if (change.count > 0) {
let span = document.createElement('span');
span.contentEditable = false;
span.innerHTML = "\n".repeat(change.count);
span.classList = 'line diff-empty';
srcDiv.appendChild(span);
} else {
}
}
}
}
export function updateDiffEditor(editor, sourceCode, compiledCode) {
let srcDiv = editor.querySelector("#input");
let destDiv = editor.querySelector("#output");
destDiv.innerHTML = compiledCode;
Prism.highlightElement(srcDiv);
Prism.highlightElement(destDiv);
}