Skip to content

Refactor Parallel Diff feature and add scrollbars

Matthias Käppler requested to merge github/fork/Datacom/feature/parallel_diff_scrollbars_pr2 into master

Created by: GeorgeDewar

Currently, the Parallel Diff feature can't seem to handle lines that exceed the width of each of the two diff panes.

old_diff_example

Most parallel diff implementations I have seen (e.g. in IDEs) solve this problem by allowing synchronized horizontal scrolling (i.e. both sides scroll together).

I have implemented this by moving to a three-column div layout for the feature, with each side in its own horizontally-scrolling div (I don't think it was possible to do this with the original layout, with one full line in each table row).

So that the horizontal scroll bars are accessible, I've made the diff pane a fixed height, which scrolls vertically. The result seems to work fine in recent versions of Chrome, Firefox and IE.

new_diff_example

In doing this change, I felt that having so much logic in the view (_parallel_view.html.haml) was constraining the layout of the page, and so it seemed appropriate to pull it out as Ruby code (which is currently, perhaps inappropriately, in the helper) and expose a data structure to the view that it could display easily in any HTML structure, removing the burden of processing from the view.

I'm interested in hearing feedback on this.

Merge request reports