Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Google-diff-match avoid showing new lines?

I am using diff-match http://neil.fraser.name/software/diff_match_patch/svn/trunk/demos/demo_diff.html

To show differences between 2 pieces of html. The problem is that the script shows new line as

Is there any way to set to don't show it?

Now I am just removing all istances of \n and \r, but this doesnt' sound good

like image 294
dynamic Avatar asked Dec 15 '12 17:12

dynamic


1 Answers

As you have seen in the documentation, the pretty html function is just a sample to develop some cool ui. However, of you replace the ¶ (& para;) with null in the function, the symbol will disappear.

  diff_match_patch.prototype.diff_prettyHtml = function(diffs) {
    var html = [];
    var pattern_amp = /&/g;
    var pattern_lt = /</g;
    var pattern_gt = />/g;
    var pattern_para = /\n/g;
    for (var x = 0; x < diffs.length; x++) {
      var op = diffs[x][0];    // Operation (insert, delete, equal)
      var data = diffs[x][1];  // Text of change.
      //var text = data.replace(pattern_amp, '&amp;').replace(pattern_lt, '&lt;')
      //    .replace(pattern_gt, '&gt;').replace(pattern_para, '&para;<br>');
      var text = data.replace(pattern_amp, '&amp;').replace(pattern_lt, '&lt;')
          .replace(pattern_gt, '&gt;').replace(pattern_para, '<br>');
      switch (op) {
        case DIFF_INSERT:
          html[x] = '<ins style="background:#e6ffe6;">' + text + '</ins>';
          break;
        case DIFF_DELETE:
          html[x] = '<del style="background:#ffe6e6;">' + text + '</del>';
          break;
        case DIFF_EQUAL:
          html[x] = '<span>' + text + '</span>';
          break;
      }
    }
    return html.join('');
  };

To test this, just go to the link you provided in Chrome and in console copy paste above function before hitting the compute diff button.

like image 61
closure Avatar answered Oct 31 '22 11:10

closure