Image diffs

Ticket 88: https://dev.gitblit.com/tickets/gitblit.git/88

Based on Lea Verou's pure CSS slider:
http://lea.verou.me/2014/07/image-comparison-slider-with-pure-css/

* Add a callback interface, pass it through DiffUtils to the
  GitBlitDiffFormatter. Is needed because the rendering needs access
  to the repositoryName and other things that are known only at higher
  levels.
  
* New class ImageDiffHandler responsible for rendering an image diff.
  Called for all binary diffs, doesn't do anything if it's not an
  image. HTML is generated via JSoup: no worries about forgetting to
  close a tag, not about HTML escaping, nor about XSS.
  
* The 3 diff pages set up such an ImageDIffHandler and pass it along.

* CSS changes: from Lea Verou, with some minor improvements.

I think in the long run there'll be no way around rewriting the
HTML diff formatter from scratch, not using the standard JGit
DiffFormatter at all.
Support for adding bottom scripts

Needed if we want to have opacity changes in image diffs because
jQuery is bottom-loaded, so we must ensure that any scripts using
jQuery are run later.

I'm not a Wicket expert; maybe there's a cleverer or cleaner way to do
this. There is a JavascriptUtils class in Wicket, but that writes to
the response -- I don't quite see how that would give me control over
the precise placement of the scripts to ensure they come after that
bottom-loaded jQuery.
HTML bug fix on the blob page

That blob page sent *two* body tags. Now that we have bottom scripts,
we can fix that easily: don't try to set body.onload, but run the
prettyprinting through a bottom script on jQuery's document.ready.
Opacity adjustments for image diffs

* ImageDiffHandler adds the slider; styled in gitblit.css
* imgdiff.js is a little bottom-loaded Javascript that adjusts the
  opacity on sliders' scroll events.
* The three diff pages add this bottom script to the page if needed
* GitBlitDiffFormatter: center image diffs.
Typo in comment, and optional semicolon in JS
Fix that opacity slider

Using the browser's built-in slider doesn't work if the browser hides
scrollbars (like Firefox on Mac). So,construct our own slider with
three divs and some CSS. Event-handling Javascript changed to match
this new implementation.
Javascript-based sliders styled with CSS

This works better for small images. The previous CSS-resize based
attempt worked reasonably well, but had two problems on WebKit
(Safari):

1. For very small images the red resize handle would overlap the image
   itself. In that case, the image became un-draggable as soon as the
   opacity was reduced below 1.0.
   
2. Safari apparently doesn't send mousemove events during a CSS
   resize, so the opacity was changed only on mouseup.
   
Both observed on Safari 6.1.6 and 7.1. FF 33.1 had no problems.

Therefore I've switched to a Javascript slider. Since I didn't find
any that was simple, did not require HTML 5, appeared to be well
maintained, had a bug tracker and not too many outstanding bug reports,
didn't pull in umpteen other dependencies, didn't suffer from feature
bloat, was compatible with jQuery 1.7.1, and was freely licensed, I
ended up writing my own.

imgdiff.js contains a small Javascript slider (only horizontal) that is
styled completely in CSS. It reports ratios in the range [0..1] and
fires nice jQuery events 'slider:pos' on value changes. Base element
is a plain div that is positioned. It's not a general-purpose do-it-all
slider, but it's small, simple, and works for what we need it.

(imgdiff.js also sets up the ese sliders on the diff pages.)
Minor corrections in Javascript

1. Stop running animation before starting a new one.
2. Fix ratio in animation
3. Fix div width

None of these change have any visible effect in the current use of
this script. (1) is just being safe, in (2) , the wrongly calculated
value was never used,and in (3), the div was a little too wide before.
Make the sliders clickable.

Always having to drag is cumbersome. Now the slider's handle can also
be set by clicking on the slider.

Heh :-) I see the GitHub UI designers hadn't thought of that.
Merged #88 "Image diff could display before & after images"