--- a/integration/v2/js/slideshow.js Fri Jun 21 15:06:51 2013 +0200
+++ b/integration/v2/js/slideshow.js Tue Jun 18 18:22:28 2013 +0200
@@ -1,13 +1,21 @@
$(function() {
- var currentSlide = 0, jqwin = $(window), jqcanvas = $(".imagezone"), jqcaption = $(".caption"), margin = 50;
+ var currentSlide = 0, jqwin = $(window), jqcaption = $(".caption"),
+ margin = 50, jqmainimg = $(".main-image"), jqbackdrop = $(".backdrop"),
+ lastSlide = null;
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 !== lastSlide) {
+ jqcaption.find("h2").text(slide.title);
+ jqcaption.find("h3").text(slide.author);
+ jqcaption.find("p").text(slide.description);
+ jqmainimg.attr("src", slide.image.src);
+ jqbackdrop.attr("src", slide.image.src);
+ }
+
+ lastSlide = slide;
if (slide.image && slide.image.width) {
var ww = jqwin.width(),
@@ -23,27 +31,19 @@
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
+ jqmainimg.css({
+ width: wa,
+ height: ha
});
-
- 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);
+ jqbackdrop.css({
+ width: wb,
+ height: hb,
+ left: xb,
+ top: yb
+ });
}
}