diff -r dabde7eb8d1f -r 46faba205083 integration/v2/js/slideshow.js
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/integration/v2/js/slideshow.js	Tue Jun 18 17:38:17 2013 +0200
@@ -0,0 +1,102 @@
+$(function() {
+    
+    var currentSlide = 0, jqwin = $(window), jqcanvas = $(".imagezone"), jqcaption = $(".caption"), margin = 50;
+    
+    function showSlide() {
+        var slide = slides[currentSlide];
+        
+        jqcaption.find("h2").text(slide.title);
+        jqcaption.find("h3").text(slide.author);
+        jqcaption.find("p").text(slide.description);
+        
+        if (slide.image && slide.image.width) {
+            var ww = jqwin.width(),
+                wh = jqwin.height(),
+                cw = jqcaption.outerWidth(),
+                ch = jqcaption.outerHeight(),
+                wi = slide.image.width,
+                hi = slide.image.height,    
+                w1 = ww - 2 * margin, w2 = w1 - cw
+                h1 = wh - 2 * margin, h2 = h1 - ch,
+                ra = Math.max(
+                    Math.min((h1 / hi), (w2 / wi)),
+                    Math.min((h2 / hi), (w1 / wi))
+                ),
+                wa = wi * ra, ha = hi * ra,
+                xa = ww - margin - wa,
+                rb = Math.max(ww / wi, wh / hi),
+                wb = wi * rb, hb = hi * rb,
+                xb = (ww - wb) / 2, yb = (wh - hb) / 2;
+            jqcanvas.attr({
+                width: ww,
+                height: wh
+            });
+                            
+            var ctx = jqcanvas[0].getContext('2d');
+            
+            ctx.drawImage(slide.image, xb, yb, wb, hb);
+            
+            ctx.fillStyle = 'rgba(255,255,255,.65)';
+            ctx.fillRect(0,0,ww,wh);
+            
+            ctx.fillStyle = 'rgba(0,0,0,.3)';
+            ctx.fillRect(margin + 4, wh - margin - ch + 4, cw, ch);
+            ctx.fillRect(xa + 4, margin + 4, wa, ha);
+            
+            ctx.drawImage(slide.image, xa, margin, wa, ha);
+            
+        }
+    }
+    
+    function nextSlide() {
+        currentSlide = (currentSlide + 1) % slides.length;
+        showSlide();
+        return false;
+    }
+    
+    function prevSlide() {
+        currentSlide = (currentSlide > 0 ? currentSlide - 1 : slides.length - 1);
+        showSlide();
+        return false;
+    }
+    
+    var hideTO, isInArrow = false, jqArrows = $(".arrow-wrap");
+    function resetTO() {
+        clearTimeout(hideTO);
+        if (!isInArrow) {
+            hideTO = setTimeout(function() {
+                jqArrows.hide();
+            }, 1000);
+        }
+    }
+    $("body").mousemove(function() {
+        jqArrows.show();
+        resetTO();
+        return false;
+    });
+    jqArrows.hover(function() {
+        isInArrow = true;
+        resetTO();
+    }, function() {
+        isInArrow = false;
+        resetTO();
+    });
+    
+    $(".left-arrow").click(prevSlide);
+    $(".right-arrow").click(nextSlide);
+    
+    slides.forEach(function(slide, k) {
+        slide.image = new Image();
+        slide.image.onload = function() {
+            if (k === currentSlide) {
+                showSlide();
+            }
+        };
+        slide.image.src = imgurlbase + slide.url;
+    });
+    
+    showSlide();
+    
+    jqwin.resize(showSlide);
+    
+});
\ No newline at end of file