|
@@ -1,30 +0,0 @@
|
|
|
-<html>
|
|
|
|
|
- <body>
|
|
|
|
|
- <pre id="display"></pre>
|
|
|
|
|
-<script src="../../node_modules/diff/dist/diff.js"></script>
|
|
|
|
|
-<script>
|
|
|
|
|
-const one = 'beep boop',
|
|
|
|
|
- other = 'beep boob blah',
|
|
|
|
|
- color = '';
|
|
|
|
|
-
|
|
|
|
|
-let span = null;
|
|
|
|
|
-
|
|
|
|
|
-const diff = Diff.diffChars(one, other),
|
|
|
|
|
- display = document.getElementById('display'),
|
|
|
|
|
- fragment = document.createDocumentFragment();
|
|
|
|
|
-
|
|
|
|
|
-diff.forEach((part) => {
|
|
|
|
|
- // green for additions, red for deletions
|
|
|
|
|
- // grey for common parts
|
|
|
|
|
- const color = part.added ? 'green' : part.removed ? 'red' : 'grey';
|
|
|
|
|
- span = document.createElement('span');
|
|
|
|
|
- span.style.color = color;
|
|
|
|
|
- span.appendChild(document
|
|
|
|
|
- .createTextNode(part.value));
|
|
|
|
|
- fragment.appendChild(span);
|
|
|
|
|
-});
|
|
|
|
|
-
|
|
|
|
|
-display.appendChild(fragment);
|
|
|
|
|
-</script>
|
|
|
|
|
- </body>
|
|
|
|
|
-</html>
|
|
|