Difference bridge layout proposal

[Michael Allan]

conseo wrote:
> Do you think the new layout is better understandable by people
> hitting a link on one of the discussion media not yet knowing about
> difference patching?

Yes, that looks quite nice.  The horizontal symmetry is attractive and
intuitive.

> The major issue mcallan pointed out (2) is that we lose half the
> horizontal space which means that the text must be [flowed].

Yes.  When text is flowed, lines are broken only at paragraph ends.
This is how wikitext is normally composed, so this is a natural layout
for the difference view.  But frequent line breaks are required for
differencing, so we've been using a line transformer to inject those
breaks.  Currently we inject them at the phrase level:
http://zelea.com/project/votorola/_/javadoc/votorola/a/diff/LineTransformer1.html

Our difference view currently shows the text complete with these line
breaks, exactly as transformed.  We can no longer do that with a
side-by-side view, because we'll often lack the horizontal space to
accomodate even phrase-length lines.  So we may want to code a new
line transformer that breaks at shorter intervals, probably at word
level.  That would mesh nicely with a flow layout.  It would also have
the side benefit of enabling the user to cherry pick single word
differences that are separated by only 5-10 words of context
(depending on how tightly we run it), as opposed to the current 2-3
lines.  So we could cherry in texts of only 20 words length, or so;
which is nice because such small texts are likely to be common in the
mini-beta rollout.  (Alex was asking about this, in the OVN forum.)

So this looks good.  We get ease of understanding *and* cherry picking
in small texts.  So maybe we want to code this for the mini-beta [1]:

  e) Side-by-side layout for difference bridge, with word-level line
     breaks.

I think the biggest design problem would be the visualization of
differences and hunks.  I think we need to:

  1. Decide who's coding it, and on what platform: Wicket/servlet or
     GWT/JavaScript, or something else.

  2. Mockup the text part of the view accordingly.  Draw a single
     difference with multiple hunks, as follows:

         i) A hunk with a single word inserted on one side.

            Deletion will look the same, so no need to mock that
            separately.

        ii) A hunk with a whole paragraph inserted on one side, and a
            single word changed just above and below it.

            Alignment of the single word pairs between the two sides
            is problematic here.

       iii) Anything else that seems problematic.

     Your current mockup doesn't show these.


 [1] http://mail.zelea.com/list/votorola/2012-January/001278.html

 [2] A hunk is one or more differences held together by context, which
     must therefore be patched in a single operation.  There can be no
     cherry picking within a hunk.

-- 
Michael Allan

Toronto, +1 416-699-9528
http://zelea.com/


conseo wrote:
> Hi,
> 
> by discussing with our toolset lately I have found the difference layout to be 
> rudimentary compared to some diff-patching devel tools. I have mocked up a 
> side-by-side draft view highlighting difference in different colours. (1)
> The major issue mcallan pointed out (2) is that we lose half the horizontal 
> space which means that the text must be floated.
> Do you think the new layout is better understandable by people hitting a link 
> on one of the discussion media not yet knowing about difference patching? It 
> looks familiar to my dev-eyes and I got positive feedback from a friend, but 
> maybe you have better ideas. SVG included. (3)
> 
> I am doing this design specific discussion on the votorola mailing list to not 
> interfere with metagovernment discussions.
> 
> conseo
> 
> (1) http://whiletaker.homeip.net/mockups/diffbridge/2/DifferenceBridge2.xht
> (2) http://zelea.com/var/cache/irc/votorola/12-01/13
> (3) 
> http://whiletaker.homeip.net/mockups/diffbridge/2/svg/DifferenceBridge2.svg
> -------------- next part --------------
> An HTML attachment was scrubbed...
> URL: <http://mail.zelea.com/list/votorola/attachments/20120113/42e056c2/attachment.html>