cemerick / jsdifflib Goto Github PK
View Code? Open in Web Editor NEWA javascript library for diffing text and generating corresponding HTML views
A javascript library for diffing text and generating corresponding HTML views
This is a simple binding handlers for knockout js.
ko.bindingHandlers['jsDiffLib'] = {
update: function (element, valueAccessor) {
function getHtml(table){
var elems = [];
$(table).find("tbody>tr>td").each(function (item, elem) {
if(elem.className === "equal"){
elems.push("<span>" + elem.innerHTML + "</span>");
}
if(elem.className === "insert"){
elems.push("<ins>" + elem.innerHTML + "</ins>");
}
if(elem.className === "delete"){
elems.push("<del>" + elem.innerHTML + "</del>");
}
});
elems.splice(0, 1);
return elems.join("<br/>");
}
var options = valueAccessor();
var base = difflib.stringAsLines("\n" + options.old()),
newtxt = difflib.stringAsLines("\n" + options.new()),
sm = new difflib.SequenceMatcher(base, newtxt),
opcodes = sm.get_opcodes();
var currentTable = diffview.buildView({
baseTextLines: base,
newTextLines: newtxt,
opcodes: opcodes,
baseTextName: "Base Text",
newTextName: "New Text",
contextSize: null,
viewType: 1
});
var html = getHtml(currentTable);
$(element).html(html);
}
}
It's okey
That before source code is not valid
This one is okey and verify
Originally posted by @abbaskiko in #35 (comment)
Please make an option to ignore whitespaces and tabs
@cemerick :
Hi congratulations on the module,
in Python there is: difflib.SequenceMatcher (None, str1, str2) .ratio ()
in the module you created there is a similar thing, does the same thing?
Example if I have:
The value of ratio, which value should you give according to your module?
Exceeds in this example the value of: 0.90?
P.ล .
Would it be possible to use it on React-native?
I thank you in advance.
EpicheroNFT
Attaching the codesandbox code link, in which file used is of 2.5mb.
https://codesandbox.io/s/xf9xd9?file=/src/App.js
ReferenceError: Strict mode forbids implicit creation of global property 'diffview'
Can you please add a 'var' declaration on line 30 of diffview.js?
var diffview = {
Please merge PR #22
in README.asciidoc, the link
https://cemerick.github.com/jsdifflib/demo.html
that should redirect to a page where one can try the library, points to non existing page (404)
I have text that contains some very long rows of data.
At the moment, the diffview table is expanding to the whole width of the data. Ideally, I would like the long lines of data to wrap - is this possible? Any tips?
Btw - I had looked into the CSS, but didn't get very far. I was hoping for an insider tip-off ;)
Many thanks!
Some sugestion to do the SequenceMatcher ignore comments?
e.g.
var diffview = { ..... };
This can cause the code to fail when minified.
There seem to be 4 results: unchanged, added, removed, and updated.
For updated, it would be really cool if the library could highlight what exactly is different in an updated line like git's highlight-diff does.
You may want to update the link for the Demo from:
http://cemerick.github.com/jsdifflib/demo.html
to:
http://cemerick.github.io/jsdifflib/demo.html
The difference is .com no longer works, but .io does!
how about to support word level diff ?
this is an example.
WHAT IS WRONG? I KNOW THE PROGRAM IS FROM HERE, SO I MUST GET THE ANSWER FROM HERE. THIS KIND OF THING IS ALWAYS HAPPENED ON ME.
#include<stdio.h>
int main(){
int n;
scanf("%d",&n);
for(int i = 1;i <= n+1;i ++){
for(int j = 1;j <=2 * n+1;j ++){
if(j == n + i || j == n -i + 2){
printf("");
}
else{
printf(".");
}
}
printf("\n");
}
for(int i = n;i >= 1;i --){
for(int j = 2 * n+1;j >=1;j--){
if(j == n + i || j == n -i + 2){
printf("");
}
else{
printf(".");
}
}
printf("\n");
}
}
Hi!
help pleas, how to add filter to exclude unmodified rows, leaving rows where there are only changes ?
difflib works line by line. But, First I wanted to group set of lines and check diff in that group.
I have tried this way, But this was not helpful. Instead of getting get_opcodes.
var opcodes = sm.get_grouped_opcodes();
$$div.appendChild(diffview.buildView({
baseTextLines: base,
newTextLines: newtxt,
opcodes: opcodes,
// set the display titles for each resource
baseTextName: "Old version",
newTextName: "New version",
contextSize: 12,
viewType: 0
}));
baseTextLines and newTextLines has white spaces and well indented. But when it prints the value of base text and new text to the screen, they are not indented. What can be the problem?
The Python Interoperability section says:
So, you have the choice of doing everything in Javascript on the browser, or falling back to server-side diff...
and then goes on to say:
Most of the time, we do the latter, simply because while jsdifflib is pretty fast all by itself, and is totally usable for diffing "normal" files....
This doesn't make sense. "latter" in that second quote should be "former".
If you have something like
@@ -130,18 +130,22 @@ class PostModel:
It would be great in view you can get real line numbers. Otherwise this is working great.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.