Esiste una libreria diff JS contro htmlstring proprio come google-diff-match-patch su testo normale?

Question

Attualmente sto utilizzando google-diff-match-patch per implementare uno strumento di modifica in tempo reale, in grado di sincronizzare i testi tra più utenti. Tutto funziona alla grande quando le operazioni sono solo semplici testi, le operazioni di ogni utente (aggiungi/cancella testi) possono essere diffuse confrontando l'istantanea del vecchio testo con l'helper di google-diff. Ma quando sono coinvolti testi in formato ricco (come grassetto/corsivo), google-diff non funziona bene quando si confronta htmlstring. L'occorrenza del carattere di <e> incasinato i risultati diff, soprattutto quando il formato grassetto/corsivo sono incorporati l'uno nell'altro.

Qualcuno potrebbe suggerire una libreria simile come google-diff a diff htmlstrings? O qualche suggerimento può risolvere il mio problema con google-diff? Ho capito che google-diff è progettato per il testo semplice, ma in realtà non ha trovato una libreria migliore di quella finora, quindi funziona anche se un miglioramento fattibile per google-diff può essere d'aiuto.

Answer 1

Dai uno sguardo allo SynchroEdit, potrebbe essere utile.

Answer 2

Pretty Diff fa tutto il necessario, tranne che è necessario aggiornare la risposta DOM in modo che il diff firmi contro l'evento "onkeyup" invece sul pulsante clic.

http://prettydiff.com/

Answer 3

Il wiki ai google-diff-match-di patch azioni di progetto alcune idee. Da http://code.google.com/p/google-diff-match-patch/wiki/Plaintext:

One method is to strip the tags from the HTML using a simple regex or node-walker. Then diff the HTML content against the text content. Don't perform any diff cleanups. This diff enables one to map character positions from one version to the other (see the diff_xIndex function). After this, one can apply all the patches one wants against the plain text, then safely map the changes back to the HTML. The catch with this technique is that although text may be freely edited, HTML tags are immutable.

Another method is to walk the HTML and replace every opening and closing tag with a Unicode character. Check the Unicode spec for a range that is not in use. During the process, create a hash table of Unicode characters to the original tags. The result is a block of text which can be patched without fear of inserting text inside a tag or breaking the syntax of a tag. One just has to be careful when reconverting the content back to HTML that no closing tags are lost.

ho la sensazione che la seconda idea, mappa-tag HTML-to-Unicode-segnaposto, potrebbe funzionare meglio di quanto si possa immaginare altrimenti ... soprattutto se i tag HTML sono da alcuni set ridotti e se è possibile eseguire un piccolo touchup di apertura/chiusura durante la visualizzazione del markup diff. interleaved (barrato/sottolineato).

Un altro metodo che potrebbe funzionare con uno stile semplice sarebbe rimuovere i tag HTML, ma ricordare gli indici dei caratteri interessati. Ad esempio, "le posizioni 8-15 sono in grassetto". Quindi, eseguire un diff in chiaro. Infine, usando l'idea di mappatura della posizione diff_xIndex dal primo metodo del wiki, reinserire in modo intelligente i tag HTML per riapplicare gli stili agli intervalli sopravvissuti/aggiunti. (Cioè, se vecchie posizioni 8-13 sono sopravvissuti, ma si trasferì a 20-25, inserire i tag B lì intorno.)

Answer 4

jsdifflib - Un JavaScript visiva Diff Strumento & Biblioteca https://github.com/cemerick/jsdifflib

C'è una demo qui : http://cemerick.github.io/jsdifflib/demo.html