jQuery Plugin To Find The Difference Between Two Texts - picadiff

picadiff is a jQuery text diff tool which makes uses of google-diff-match-patch library to compare and find the differences between two blocks of plain text.

How to use it:

1. Load jQuery library and other required resources in the document.

<script src="jquery.min.js"></script>
<script src="diff_match_patch.js"></script>
<!-- Helper Classes -->
<script src="diff_match_patch_extended.js"></script>

2. Load the jquery.picadiff.css in the head section, and the picadiff.js after jQuery library.

<link rel="stylesheet" href="css/jquery.picadiff.css">
<script src="src/picadiff.js"></script>

3. Insert two blocks of plain text you want to compare.

<div class="picadiff">
  <div class="picadiff-content">
    <div class="left">
      Text A
    </div>
    <div class="right">
      Text B
    </div>
  </div>
</div>

4. Call the plugin on the top element to compare and display the differences between left / right text.

$(".picadiff").picadiff();

5. Default plugin settings.

// CSS selectors
leftContainer     : '.left',
rightContainer    : '.right',
titleContainer    : '.picadiff-title',
contentContainer  : '.picadiff-content',

// maxmimum number of chars per line
lineLength        : 40,

// if true lines will always wrap on lineLength.
wrap              : false

---

This awesome jQuery plugin is developed by picapica-org. For more Advanced Usages, please check the demo page or visit the official website.