1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<TITLE>Diff, Match and Patch: Demo of Patch</TITLE>
<SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript" SRC="../javascript/diff_match_patch.js"></SCRIPT>
</HEAD>
<BODY>
<H1>Diff, Match and Patch</H1>
<H2>Demo of Patch</H2>
<P>Two texts can be diffed against each other, generating a list of patches.
These patches can then be applied against a third text. If the third text has edits of its own, this version of patch
will apply its changes on a best-effort basis, reporting which patches succeeded and which failed.</P>
<P>In this scenario Shakespeare wrote Hamlet in Early Modern English, the source document. Then two derivative
works were created. One is Hamlet updated to Modern English. The other is a Star Trek parody in Early Modern English.
This demonstrantion creates a list of patches between the source and the Modern English version. Then it
applies those patches onto the Star Trek parody, thus creating a Star Trek parody in
Modern English.</P>
<SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript">
var dmp = new diff_match_patch();
var patch_text = '';
function diff_launch() {
var text1 = document.getElementById('text1a').value;
var text2 = document.getElementById('text2a').value;
var ms_start = (new Date).getTime();
var diff = dmp.diff_main(text1, text2, true);
var ms_end = (new Date).getTime();
if (diff.length > 2) {
dmp.diff_cleanupSemantic(diff);
}
var patch_list = dmp.patch_make(text1, text2, diff);
patch_text = dmp.patch_toText(patch_list);
document.getElementById('diffdatediv').innerHTML =
'Time: ' + (ms_end - ms_start) / 1000 + 's';
document.getElementById('diffoutputdiv').innerHTML =
'<FIELDSET><LEGEND>Patch:</' + 'LEGEND><PRE>' + patch_text +
'</' + 'PRE></' + 'FIELDSET>';
//document.getElementById('diffoutputdiv').innerHTML = dmp.diff_prettyHtml(diff);
document.getElementById('patchbutton').disabled = false;
}
function patch_launch() {
var text1 = document.getElementById('text1b').value;
var patches = dmp.patch_fromText(patch_text);
var ms_start = (new Date).getTime();
var results = dmp.patch_apply(patches, text1);
var ms_end = (new Date).getTime();
document.getElementById('patchdatediv').innerHTML =
'Time: ' + (ms_end - ms_start) / 1000 + 's';
document.getElementById('text2b').value = results[0];
results = results[1];
var html = '';
for (var x = 0; x < results.length; x++) {
if (results[x]) {
html += '<LI><FONT COLOR="#009900">Ok</' + 'FONT>';
} else {
html += '<LI><FONT COLOR="#990000">Fail</' + 'FONT>';
}
}
document.getElementById('passfaildiv').innerHTML = html;
}
</SCRIPT>
<FORM action="#" onsubmit="return false">
<H3>Shakespeare's copy:</H3>
<TABLE WIDTH="100%"><TR>
<TD WIDTH="50%">Old Version:<BR><TEXTAREA ID="text1a" STYLE="width: 100%" ROWS=10>Hamlet: Do you see yonder cloud that's almost in shape of a camel?
Polonius: By the mass, and 'tis like a camel, indeed.
Hamlet: Methinks it is like a weasel.
Polonius: It is backed like a weasel.
Hamlet: Or like a whale?
Polonius: Very like a whale.
-- Shakespeare</TEXTAREA></TD>
<TD WIDTH="50%">New Version:<BR><TEXTAREA ID="text2a" STYLE="width: 100%" ROWS=10>Hamlet: Do you see the cloud over there that's almost the shape of a camel?
Polonius: By golly, it is like a camel, indeed.
Hamlet: I think it looks like a weasel.
Polonius: It is shaped like a weasel.
Hamlet: Or like a whale?
Polonius: It's totally like a whale.
-- Shakespeare</TEXTAREA></TD>
</TR></TABLE>
<P><INPUT TYPE="button" onClick="diff_launch()" VALUE="Compute Patch"></P>
<BLOCKQUOTE><DIV ID="diffoutputdiv"></DIV></BLOCKQUOTE>
<DIV ID="diffdatediv"></DIV>
<H3>Trekkie's copy:</H3>
<TABLE WIDTH="100%"><TR>
<TD WIDTH="50%">Old Version:<BR><TEXTAREA ID="text1b" STYLE="width: 100%" ROWS=10>Kirk: Do you see yonder cloud that's almost in shape of a Klingon?
Spock: By the mass, and 'tis like a Klingon, indeed.
Kirk: Methinks it is like a Vulcan.
Spock: It is backed like a Vulcan.
Kirk: Or like a Romulan?
Spock: Very like a Romulan.
-- Trekkie</TEXTAREA></TD>
<TD WIDTH="50%">New Version:<BR><TEXTAREA READONLY ID="text2b" STYLE="width: 100%" ROWS=10></TEXTAREA></TD>
</TR></TABLE>
<INPUT TYPE="button" ID="patchbutton" onClick="patch_launch()" VALUE="Apply Patch" DISABLED>
</FORM>
<OL ID="passfaildiv"></OL>
<DIV ID="patchdatediv"></DIV>
<HR>
Back to <A HREF="http://code.google.com/p/google-diff-match-patch/">Diff, Match and Patch</A>
</BODY>
</HTML>
|
