diff-lcs 사람이 읽을 수 있도록 출력하십시오.

Question

diff-lcs gem을 사용하여 두 개의 html 내용 사이에 차이점을 출력하고 있습니다. 여기 샘플 콘텐츠가 있습니다.

버전 하나

<p>Paragraph one. Sentence one.</p> 

<p>Paragraph two. Another sentence.</p> 

<p>Paragraph three. I dare you to change me!</p> 

버전 두 :

<p>Paragraph one. Sentence two.</p> 

<p>Paragraph two. Another sentence.</p> 

<p>Paragraph three. I dare you to update me!</p> 

이 사용 :

seq1 = @versionOne.body 
seq2 = @versionTwo.body 

seq = Diff::LCS.diff(seq1, seq2) 

이 괴물을 얻을 :

seq => [[#<Diff::LCS::Change:0x0000000be539f8 @action="-", @position=27, @element="t">, #<Diff::LCS::Change:0x0000000be538b8 @action="-", @position=28, @element="w">], [#<Diff::LCS::Change:0x0000000be53520 @action="+", @position=28, @element="n">, #<Diff::LCS::Change:0x0000000be53408 @action="+", @position=29, @element="e">], [#<Diff::LCS::Change:0x0000000be3aa70 @action="-", @position=110, @element="u">, #<Diff::LCS::Change:0x0000000be3a840 @action="-", @position=111, @element="p">, #<Diff::LCS::Change:0x0000000be34ee0 @action="-", @position=112, @element="d">, #<Diff::LCS::Change:0x0000000be349e0 @action="+", @position=110, @element="c">, #<Diff::LCS::Change:0x0000000be348a0 @action="+", @position=111, @element="h">], [#<Diff::LCS::Change:0x0000000be34580 @action="-", @position=114, @element="t">, #<Diff::LCS::Change:0x0000000be34210 @action="+", @position=113, @element="n">, #<Diff::LCS::Change:0x0000000be33f40 @action="+", @position=114, @element="g">], [#<Diff::LCS::Change:0x0000000be331d0 @action="-", @position=124, @element="">]] 

the documentation에서 발견 sdiff과 다른 방법의 출력은 유사 끔찍한입니다. 나는 (배열의) 배열의 구조를 이해하지만 사람이 읽을 수 있고 스타일이 가능한 방식으로 차이를 보여줄 수있는 간단한 방법이 있어야한다.

PS - 누군가 diff-lcs 태그를 만들고 싶다면 그 점을 이해할 수 있습니다.

Answer 1

diff-lcs는 일반적인 문자열 (문자 배열)을 제공했습니다. 내가 원했던 것이 문자의 비교라면, 나는 원했던 것을 얻었지만, 더 쉽게 읽을 수있는 것을 원했습니다. 단어, 선 또는 문장을 비교했습니다. 나는 문장을 선택했다.

seq1 = @versionOne.body.split('.') 
seq2 = @versionTwo.body.split('.') 
compareDiff = Diff::LCS.sdiff(seq1, seq2) 

이렇게하면 훨씬 더 읽기 쉽고 구문 분석 가능한 콘텐츠가 생성됩니다. 현실적으로 나는 또한 !과 ?으로 나누고 싶습니다. 그러나 구조는 배열이나 해시의 일반적인 배열이 아닙니다. 브라우저의 출력물이 나를 버렸지 만 그것은 객체 배열이므로 다른 것과 마찬가지로 구문 분석 할 수 있습니다. 이것은 내가 레일 콘솔에서 얻은 YAML 포맷 출력 (는 브라우저에 표시하지 않은 이유없이 아이디어) :

--- 
- !ruby/object:Diff::LCS::ContextChange 
    action: "=" 
    new_element: <p>Paragraph one 
    new_position: 0 
    old_element: <p>Paragraph one 
    old_position: 0 
- !ruby/object:Diff::LCS::ContextChange 
    action: "!" 
    new_element: " Sentence two" 
    new_position: 1 
    old_element: " Sentence one" 
    old_position: 1 
- !ruby/object:Diff::LCS::ContextChange 
    action: "=" 
    new_element: |- 
    </p> 
    <p>Paragraph two 
    new_position: 2 
    old_element: |- 
    </p> 
    <p>Paragraph two 
    old_position: 2 
- !ruby/object:Diff::LCS::ContextChange 
    action: "=" 
    new_element: " Another sentence" 
    new_position: 3 
    old_element: " Another sentence" 
    old_position: 3 
- !ruby/object:Diff::LCS::ContextChange 
    action: "=" 
    new_element: |- 
    </p> 
    <p>Paragraph three 
    new_position: 4 
    old_element: |- 
    </p> 
    <p>Paragraph three 
    old_position: 4 
- !ruby/object:Diff::LCS::ContextChange 
    action: "!" 
    new_element: " I dare you to update me!</p>" 
    new_position: 5 
    old_element: " I dare you to change me!</p>" 
    old_position: 5 
=> nil 

슈퍼 도움이! 이 출력됩니다 위키와 같은 DIFF :

sdiff = Diff::LCS.sdiff(seq2, seq1) 

diffHTML = '' 

sdiff.each do |diff| 
    case diff.action 
    when '=' 
    diffHTML << diff.new_element + "." 
    when '!' 
    # strip_tags only needed on old_element. removes pre-mature end tags. 
    diffHTML << "<del>#{diff.old_element.strip_tags}</del> <add>#{diff.new_element}</add>. " 
    end 
end 

@compareBody = diffHTML.html 

...[format do block] 

그럼 그냥 스타일 <del> 당신이 원하는대로 <add>. 더 쉬운 것을 찾고 있다면, diffy일지도 모르지만, 이것은 매우 유연합니다.