Skip to content

Commit

Permalink
fixing console formatted output. some restyling on demo page.
Browse files Browse the repository at this point in the history
  • Loading branch information
beneidel committed Feb 7, 2013
1 parent c7f0a00 commit 76eb5ec
Show file tree
Hide file tree
Showing 6 changed files with 116 additions and 74 deletions.
4 changes: 4 additions & 0 deletions bin/jsondiffpatch.js
Expand Up @@ -7,6 +7,9 @@ var requireFromDir = function(filename) {


var jsondiffpatch = requireFromDir('../src/jsondiffpatch'); var jsondiffpatch = requireFromDir('../src/jsondiffpatch');
jsondiffpatch.config.diff_match_patch = requireFromDir('../lib/diff_match_patch_uncompressed.js'); jsondiffpatch.config.diff_match_patch = requireFromDir('../lib/diff_match_patch_uncompressed.js');
jsondiffpatch.config.objectHash = function(obj) {
return obj._id || obj.id || obj.name || JSON.stringify(obj);
};
jsondiffpatch.console = requireFromDir('../src/jsondiffpatch.console'); jsondiffpatch.console = requireFromDir('../src/jsondiffpatch.console');


var util = require('util'), fs = require('fs'); var util = require('util'), fs = require('fs');
Expand All @@ -24,4 +27,5 @@ var dataOrig = JSON.parse(fs.readFileSync(file1));
var dataNew = JSON.parse(fs.readFileSync(file2)); var dataNew = JSON.parse(fs.readFileSync(file2));


var delta = jsondiffpatch.diff(dataOrig, dataNew); var delta = jsondiffpatch.diff(dataOrig, dataNew);

console.log(jsondiffpatch.console.diffToText(dataOrig, dataNew, delta, hideUnchanged)); console.log(jsondiffpatch.console.diffToText(dataOrig, dataNew, delta, hideUnchanged));
79 changes: 37 additions & 42 deletions demo/index.htm

Large diffs are not rendered by default.

37 changes: 34 additions & 3 deletions demo/style.css
Expand Up @@ -52,19 +52,33 @@ h2 {
} }


.header-options { .header-options {
font-weight: normal;
margin-left: 30px; margin-left: 30px;
display: inline-block; display: inline-block;
} }


table {
padding: 20px;
}

td, th {
vertical-align: top;
text-align: left;
}

#jsondiff { #jsondiff {
width: 95%; overflow: scroll;
height: 200px; max-width: 800px;
}

.jsondiff {
width: 800px;
} }


footer { footer {
font-size: small; font-size: small;
text-align: center; text-align: center;
margin: 40px; margin: 40px;
} }


.credits { .credits {
Expand All @@ -79,3 +93,20 @@ footer {
.credits a:hover { .credits a:hover {
text-decoration: underline; text-decoration: underline;
} }

.results {
margin-top: 20px;
}

.results table {
width: 100%;
}

.results {
width: 100%;
}
.results > div {
vertical-align: top;
display: inline-block;
}

57 changes: 34 additions & 23 deletions src/jsondiffpatch.console.js
@@ -1,4 +1,5 @@
var jsondiffpatch = require('./jsondiffpatch') var jsondiffpatch = require('./jsondiffpatch')
var jdp = jsondiffpatch;


var clc = require('cli-color'); var clc = require('cli-color');


Expand All @@ -9,12 +10,15 @@ green = identity, red = identity, gray = identity, strike = identity;


green = clc.green; green = clc.green;
red = clc.red; red = clc.red;
yellow = clc.yellow;
orange = clc.orange;
strike = clc.strike; strike = clc.strike;


var tremoved = function(text){ var tremoved = function(text){
return strike(red(text)); return strike(red(text));
}, },
tadded = green, tunchanged = gray, tnormal = identity, tdiffheader = gray, tadded = green, tunchanged = gray, tnormal = identity, tdiffheader = gray,
tmovedto = yellow, tmovedfrom = red,
indent = function(level){ indent = function(level){
return new Array(level || 0).join(' '); return new Array(level || 0).join(' ');
}; };
Expand All @@ -31,7 +35,7 @@ objectToText = function(desc, o, hideUnchanged, level) {
), ': '); ), ': ');
} }


if (typeof o == 'object' && !jsondiffpatch.isDate(o)) { if (o && typeof o == 'object' && !jsondiffpatch.isDate(o)) {
// a node (object or array) // a node (object or array)
buffer.push(o._t === 'a' ? '[\n' : '{\n'); buffer.push(o._t === 'a' ? '[\n' : '{\n');
for (var prop in o) { for (var prop in o) {
Expand Down Expand Up @@ -64,7 +68,7 @@ var diffNodeToText = function(desc, o, n, d, hideUnchanged, level, metadata){
var positionForLabel = buffer.length; var positionForLabel = buffer.length;
var label = [desc]; var label = [desc];
if (n instanceof Array ) { if (n instanceof Array ) {
label.push(' (array', n._key ? ', key=' + n._key : '', ')'); label.push(' (array)');
} }
if (desc) { if (desc) {
label.push(': '); label.push(': ');
Expand Down Expand Up @@ -122,19 +126,14 @@ var diffNodeToText = function(desc, o, n, d, hideUnchanged, level, metadata){
} else { } else {
if (d[2] === 3) { if (d[2] === 3) {
// item moved // item moved
buffer.push(tadded('<= _' + metadata));
buffer.push(tadded(objectToText(null, n, hideUnchanged, level)));
labelFunc = tremoved;

var melem = document.createElement('div');
if (desc == d[1]) { if (desc == d[1]) {
buffer.push(tadded('<= _' + metadata)); buffer.push(tmovedto('<= _' + metadata));
buffer.push(tadded(objectToText(null, n, hideUnchanged, level))); buffer.push(tmovedto(objectToText(null, n, hideUnchanged, level)));
labelFunc = tadded; labelFunc = tmovedto;
} else { } else {
buffer.push(tremoved('=> ' + d[1])); buffer.push(tmovedfrom('=> ' + d[1]));
labelFunc = tmovedfrom;
} }
elem.appendChild(melem);
} }
} }
} }
Expand All @@ -146,7 +145,7 @@ var diffNodeToText = function(desc, o, n, d, hideUnchanged, level, metadata){
// a node (object or array) // a node (object or array)


if (typeof metadata != 'undefined') { if (typeof metadata != 'undefined') {
buffer.push('<= _' + metadata); buffer.push(tmovedto('<= _' + metadata + ' '));
} }


// only members in diff (skip unchanged members) // only members in diff (skip unchanged members)
Expand All @@ -166,12 +165,17 @@ var diffNodeToText = function(desc, o, n, d, hideUnchanged, level, metadata){
toInsert[d[prop][1]] = { prop: prop, from: index }; toInsert[d[prop][1]] = { prop: prop, from: index };
} }
removedIndices[index] = true; removedIndices[index] = true;
var li = diffNodeToText(prop, jdp.getByKey(o, index), null, hideUnchanged, level, d[prop]); items.push({
removed: true,
text: diffNodeToText(prop, jdp.getByKey(o, index), null, d[prop], hideUnchanged, level + 1)
});
} else { } else {
// unchanged // unchanged
var prop = index.toString(); var prop = index.toString();
var li = objectToText(index, o[index], hideUnchanged, level); items.push({
items.push(li); unchanged: true,
text: objectToText(index, o[index], hideUnchanged, level + 1)
});
} }
} }
for (var prop in d) { for (var prop in d) {
Expand Down Expand Up @@ -201,19 +205,27 @@ var diffNodeToText = function(desc, o, n, d, hideUnchanged, level, metadata){
} }
} }
oldIndex = parseInt(oldIndex, 10); oldIndex = parseInt(oldIndex, 10);
var li = diffNodeToText(index, jdp.getByKey(o, oldIndex), jdp.getByKey(n, index), d[prop], hideUnchanged, level, insertion.from)); var item = {
items.splice(index + indexOffset, d[prop].length == 1 || d[prop][2] === 3 ? 0 : 1, li); inserted: true,
from: insertion.from,
text: diffNodeToText(index, jdp.getByKey(o, oldIndex), jdp.getByKey(n, index),
d[prop], hideUnchanged, level + 1, insertion.from)
};
items.splice(index + indexOffset, d[prop].length == 1 || d[prop][2] === 3 ? 0 : 1, item);
} }
} }
for (index = 0; index < items.length; index++) { for (index = 0; index < items.length; index++) {
buffer.push(items[index]); var item = items[index];
if (!item.unchanged || !hideUnchanged) {
buffer.push(items[index].text);
}
} }


} else { } else {
for (var prop in d) { for (var prop in d) {
if (d.hasOwnProperty(prop) && prop !== '_t') { if (d.hasOwnProperty(prop) && prop !== '_t') {
buffer.push(diffNodeToText(prop, jsondiffpatch.getByKey(o, prop), jsondiffpatch.getByKey(n, prop), d[prop] buffer.push(diffNodeToText(prop, jsondiffpatch.getByKey(o, prop), jsondiffpatch.getByKey(n, prop),
, hideUnchanged, level+1)); d[prop], hideUnchanged, level + 1));
} }
} }


Expand All @@ -227,15 +239,14 @@ var diffNodeToText = function(desc, o, n, d, hideUnchanged, level, metadata){
k = o[prop][o._key]; k = o[prop][o._key];
} }
if (!d || !d.hasOwnProperty(k)) { if (!d || !d.hasOwnProperty(k)) {
buffer.push(objectToText(k, o[prop], hideUnchanged, level+1)); buffer.push(objectToText(k, o[prop], hideUnchanged, level + 1));
} }
} }
} }
} }
} }
} }



buffer.push(indentation, d._t === 'a' ? ']\n' : '}\n'); buffer.push(indentation, d._t === 'a' ? ']\n' : '}\n');
} }


Expand Down
2 changes: 1 addition & 1 deletion src/jsondiffpatch.js
Expand Up @@ -420,7 +420,7 @@
}; };


var arrayDiff = function(o, n){ var arrayDiff = function(o, n){
return sequenceDiffer.diff(o, n, jdp.config.objectHash, jsondiffpatch.diff); return sequenceDiffer.diff(o, n, jdp.config.objectHash, jdp.diff);
}; };


var objectDiff = function(o, n){ var objectDiff = function(o, n){
Expand Down
11 changes: 6 additions & 5 deletions test/testdata2.json
Expand Up @@ -52,11 +52,6 @@
"independence": "1818-02-12T03:00:00.000Z", "independence": "1818-02-12T03:00:00.000Z",
"unasur": true "unasur": true
}, },
{
"name": "Colombia",
"capital": "Bogotá",
"independence": "1810-07-20T03:00:00.000Z"
},
{ {
"name": "Ecuador", "name": "Ecuador",
"capital": "Quito", "capital": "Quito",
Expand All @@ -75,6 +70,12 @@
"independence": "1821-07-28T03:00:00.000Z", "independence": "1821-07-28T03:00:00.000Z",
"unasur": true "unasur": true
}, },
{
"name": "Colombia",
"capital": "Bogotá",
"independence": "1810-07-20T03:00:00.000Z",
"population": 42888594
},
{ {
"name": "Suriname", "name": "Suriname",
"capital": "Paramaribo", "capital": "Paramaribo",
Expand Down

0 comments on commit 76eb5ec

Please sign in to comment.