﻿/*
QuiteView 1.23 - lightweight jquery plugin for image viewing
 by Zolo Kallay, ZoA
 http://www.zollo.sk/quiteview/
*/


$(document).ready(function() { quiteview(); });


qvTextLoading = "Lade Bild...";
qvTextKey = "Taste";
qvTextPrev = "Zurück";
qvTextNext = "Weiter";
qvTextClose = "Schließen";

 qvContent = "<div id='Quiteview'>";
qvContent += "<div id='qvArea'>";
qvContent += "<div id='qvBackground' style='display:none; position:fixed; left:0; top:0; width:100%; height:100%; background:#000; opacity:0.75; filter:alpha(opacity=75); z-index:1000'></div>";
	//qvTable
qvContent += "<table id='qvTable' cellspacing='0' cellpadding='0' style='position:fixed; left:0; top:0; width:100%; height:100%; z-index:1000000'>";
qvContent += " <tr><td style='width:50%'><td>";
qvContent += "  <div id='qvImageWrapper' style='display:none; line-height:0; box-shadow: 0 0 50px rgba(0,0,0,0.3)'>";
qvContent += "   <img id='qvImage' style='opacity:0'>";
qvContent += "  </div>";
qvContent += " <td style='width:50%'>";
qvContent += "</table>";
	//qvLoadingContainer
qvContent += "<table id='qvLoadingContainer' cellspacing='0' cellpadding='0' style='position:fixed; left:0; top:0; width:100%; height:100%; z-index:1000000'>";
qvContent += " <tr><td style='width:50%'><td>";
qvContent += "  <div id='qvLoading' style='display:none; padding: 5px 7px; font: 12px arial; color:#fff; background:rgba(0,0,0,0.5); white-space:nowrap; border-radius:3px; box-shadow: 0 0 10px rgba(0,0,0,0.5)'>"+ qvTextLoading +"</div>";
qvContent += " <td style='width:50%'>";
qvContent += "</table>";
	//qvImageTopContainer
qvContent += "<table id='qvImageTopContainer' style='position:fixed; left:0; top:0; width:100%; height:100%; font: 12px arial; color:#fff; z-index:1000000'>";
qvContent += " <tr><td style='width:50%; text-align:right'>";
qvContent += "  <div id='qvGalleryPrev' style='display:none; position:relative; left:4px; padding: 0 2px 1px 3px; font-size:20px; cursor:pointer; display:none' title='"+ qvTextPrev +" (&lt;- "+ qvTextKey +")'>◄</div>";
qvContent += " <td>";
qvContent += "  <div id='qvGalleryCount' style='float:left; position:relative; top:12px'></div>";
qvContent += "  <div id='qvClose' style='display:none; float:right; position:relative; left:5px; height:19px; padding:5px; font: bold 20px arial; cursor:pointer' title='"+ qvTextClose +" (Esc "+ qvTextKey +")'>x</div>";
qvContent += "  <div id='qvImageTopWrapper' style='line-height:0'>";
qvContent += "   <img id='qvImageTop' style='clear:both; opacity:0'>";
qvContent += "  </div>";
qvContent += "  <div id='qvTitle' style='display:none; position:relative; top:2px; height:29px'></div>";
qvContent += " <td style='width:50%; text-align:left'>";
qvContent += "  <div id='qvGalleryNext' style='display:none; position:relative; left:-4px; padding: 0 2px 1px 3px; font-size:20px; cursor:pointer' title='"+ qvTextNext +" (-&gt; "+ qvTextKey +")'>►</div>";
qvContent += "</table>";
qvContent += "</div>";
qvContent += "</div>";



function quiteview() {

$('a.quiteview').click( function() {


if ( $('#Quiteview').width() != null ) { return; };

qvImage = new Image();
qvTitleContent = '';
if ( $(this).find('img').attr('title') != undefined ) { qvTitleContent = $(this).find('img').attr('title'); };
if ( $(this).attr('title') != undefined ) { qvTitleContent = $(this).attr('title'); };
qvGalleryIndex = 0;

$('body').append(qvContent);
$('#qvBackground').fadeIn(200);

qvImage.onload = function() {

 qvImageFit();
 
 if ( $('#qvClose').css('display') == 'none') {
  $('#qvImageTop').css({'width': qvImageWidth +'px', 'height': qvImageHeight +'px'});
  $('#qvImage').css({'width': qvImageWidth +'px', 'height': qvImageHeight +'px'});
  $('#qvImageWrapper').fadeIn(200);
  qvGalleryCountContent = (qvGalleryIndex+1) +" / "+ qvGallery.length;
 };
 
 $('#qvImageTop').css('opacity', 0);
 $('#qvImageTop').attr('src', qvImage.src);
 $('#qvImageTop').animate({'width': qvImageWidth, 'height': qvImageHeight, 'opacity': 1}, 200);
 
 $('#qvImage').animate({'width': qvImageWidth, 'height': qvImageHeight, 'opacity': 0}, 200, function() { 
  $('#qvLoading').hide();
  $('#qvImage').attr('src', qvImage.src);
  $('#qvImage').css('opacity', 1);
  if (qvGallery.length > 1) {
   $('#qvGalleryCount').text(qvGalleryCountContent);
   $('#qvGalleryPrev, #qvGalleryNext').css('display', 'inline');
  };
  $('#qvGalleryCount, #qvClose, #qvTitle').show();
  $('#qvTitle').text(qvTitleContent);  
 });
 
};

qvImage.src = $(this).attr('href');	//for ie, chrome: must be called after qvImage.onload
if (!qvImage.complete) { $('#qvLoading').fadeIn(200); };

function qvImageFit() {

 qvAreaWidth = $('#qvTable').width() -70;
 qvAreaHeight = $('#qvTable').height() -70;
 qvImageHeight = qvImage.height;
 qvImageWidth = qvImage.width;
 qvImageRatio = qvImageWidth / qvImageHeight;
 
 if (qvImageWidth > qvAreaWidth) {
  qvImageWidth = qvAreaWidth; qvImageHeight = Math.round(qvImageWidth / qvImageRatio);
 };
 if (qvImageHeight > qvAreaHeight) {
  qvImageHeight = qvAreaHeight; qvImageWidth = Math.round(qvImageHeight * qvImageRatio);
 };

};

$(window).resize(function() {
 qvImageFit();
 $('#qvImageTop').css({'width': qvImageWidth +'px', 'height': qvImageHeight +'px', 'opacity': 0});
 $('#qvImage').css({'width': qvImageWidth +'px', 'height': qvImageHeight +'px'});
});

$('#Quiteview div').click(function(e) {
 if ($(this).attr('id') == 'qvGalleryPrev' || $(this).attr('id') == 'qvGalleryNext') {
  e.stopPropagation();	//prevents the call of qvQuit() when clicking on overlayed divs (the click event would otherwise fire for each underlying div)
 } else {
  qvQuit();
 };
});
 
$('#qvClose, #qvGalleryPrev, #qvGalleryNext').hover(
 function() { $(this).css('color', '#bbb'); }, function() { $(this).css('color', '#fff');}
);
 
$(document).keyup(function (key) {
 switch (key.keyCode) {  
  case 37: if (qvGallery.length > 1) { $('#qvGalleryPrev').click(); }; break;	//left arrow
  case 39: if (qvGallery.length > 1) { $('#qvGalleryNext').click(); }; break;	//right arrow
  case 27: qvQuit(); break;	//Esc
 };
});

function qvQuit() {
 $('#qvImage').css('cursor', 'default');	//for opera: the cursor would otherwise stay cursor:pointer
 $('#qvClose span').css('cursor', 'default');
 $(document).unbind('keyup');
 $('#qvBackground').fadeOut(200);
 $('#qvTable').fadeOut(200, function() { $('#Quiteview').remove(); });
};


/* gallery */

var qvGallery = new Array();
qvThisHref = $(this).attr('href');
i = 0;
$("a.quiteview[rel='"+ $(this).attr('rel') +"']:not(:[rel=''])").each(function() {
 qvGallery[i] = $(this).attr('href');
 if (qvThisHref == $(this).attr('href')) { qvGalleryIndex = i; };
 i++;
});

$('#qvGalleryPrev').click(function() {
 $(this).css('color', '#fff');
 if (qvGalleryIndex != 0) { qvGalleryIndex--; } else { qvGalleryIndex = qvGallery.length-1 };
 qvGalleryShow();
});

$('#qvGalleryNext').click(function() {
 $(this).css('color', '#fff');
 if (qvGalleryIndex != qvGallery.length-1) { qvGalleryIndex++; } else { qvGalleryIndex = 0; };
 qvGalleryShow();
});
 
 function qvGalleryShow() {
  qvImage.src = qvGallery[qvGalleryIndex];	//for ie: must be called after $('#qvImage').hide()
  //if (!qvImage.complete) { $('#qvImageTop').css('opacity', 0); $('#qvLoading').fadeIn(200); };
  $('#qvImageTop').css('opacity', 0); $('#qvLoading').fadeIn(200);
  qvGalleryCountContent = (qvGalleryIndex+1) +" / "+ qvGallery.length;
  qvThisLink = $("a.quiteview[href='"+ qvGallery[qvGalleryIndex] +"']");
  qvTitleContent = '';
  if ( qvThisLink.find('img').attr('title') != undefined ) { qvTitleContent = qvThisLink.find('img').attr('title'); };
  if ( qvThisLink.attr('title') != undefined ) { qvTitleContent = qvThisLink.attr('title'); };
  
 };
 
 /* /gallery */

 
return false;


});

};


