/*
QuiteView 1.0 - lightweight jquery plugin for image viewing
 by Zolo Kallay, ZoA
 http://www.zollo.sk/quiteview/
*/


$(document).ready(function() { quiteview(); });


QvTextLoading = "Loading image...";
QvTextImage = "Image ";
QvTextOf = " of ";
QvTextKey = "key";
QvTextPrev = "prev";
QvTextNext = "next";
QvTextClose = "close";

QvContent = "<div id='Quiteview'>";
QvContent += "<div id='QvArea'>";
QvContent += "<div id='QvBackground' style='position:fixed; left:0; top:0; width:100%; height:100%; background:#000; opacity:0.75; filter:alpha(opacity=75); z-index:1000'></div>";
QvContent += "<table id='QvTable' cellspacing='0' cellpadding='0' style='position:fixed; left:0; top:0; width:100%; height:100%; z-index:1000'>";
QvContent += "<tr>";
QvContent += " <td style='width:50%'>";
QvContent += " <td style='vertical-align:middle; font: 12px arial; color:#fff'>";
QvContent += "  <div id='QvTitle'></div>";
QvContent += "  <img id='QvImage' style='vertical-align:bottom; margin: 3px 0; cursor:pointer; display:none' title='"+ QvTextClose +"'>";
QvContent += "  <div id='QvLoading' style='width:300px; margin: 3px 0; padding: 10px 0; text-align:center; background:#000; opacity:0.50; filter:alpha(opacity=50);  white-space:nowrap'>"+ QvTextLoading +"</div>";
QvContent += "  <div id='QvGallery' style='display:inline'>";
QvContent += "   <div id='QvGalleryCount' style='display:inline'></div>&nbsp;&nbsp;";
QvContent += "   <div id='QvGalleryPrev' style='display:none'>&lt;<span style='text-decoration:underline; cursor:pointer' title='&lt;- "+ QvTextKey +"'>"+ QvTextPrev +"</span></div>&nbsp;";
QvContent += "   <div id='QvGalleryNext' style='display:none'><span style='text-decoration:underline; cursor:pointer' title='-&gt; "+ QvTextKey +"'>"+ QvTextNext +"</span>&gt;</div>&nbsp;&nbsp;";
QvContent += "  </div>";
QvContent += "  <div id='QvClose' style='float:right; height:15px; text-align:right'><span style='text-decoration:underline; cursor:pointer' title='Esc "+ QvTextKey +"'>"+ QvTextClose +"</span> (Esc)</div>";
QvContent += " <td style='width:50%'>";
QvContent += "</table>";
QvContent += "</div>";
QvContent += "</div>";


function quiteview() {

$('a.quiteview').click( function() {


if (navigator.appName == 'Microsoft Internet Explorer' && navigator.appVersion.substring(22,23) == '6') {
 $('#QvBackground').css('position', 'absolute');
 $('#QvTable').css('position', 'absolute');
 window.scrollTo(0, 0);
};

QvImage = new Image();
QvTitle = $(this).attr('title');

$('body').append(QvContent);

QvImage.onload = function() {
 QvImageFit(); 
 $('#QvImage').attr('src', QvImage.src);
 $('#QvLoading').hide();
 $('#QvImage').show(); 
 if (QvTitle != '') { $('#QvTitle').text(QvTitle); };
};

QvImage.src = $(this).attr('href');	//for ie, chrome: must be called after QvImage.onload

function QvImageFit() {

 QvAreaWidth = $('#QvTable').width()-40;	//40px is the width of the margins (20+20)
 QvAreaHeight = $('#QvTable').height()-40-36;	//36px is the height of the divs+padding above and below the image (18+18)
 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);
 };
 
 $('#QvImage').width(QvImageWidth);
 $('#QvImage').height(QvImageHeight);

};

$(window).resize(function() { QvImageFit(); });

$('#Quiteview div').click(function(event) {
 if ($(this).attr('id') == 'QvGalleryPrev' || $(this).attr('id') == 'QvGalleryNext') {
  event.stopPropagation();	//prevents the call of QvQuit() when clicking on overlayed divs (the click event would otherwise fire for each underlying div)
 } else {
  QvQuit();
 };
 });
 
$(document).keyup(function (key) {
 switch (key.keyCode) {  
  case 37: if (QvGalleryIndex != 0) { QvGalleryIndex--; QvGalleryShow(); }; break;	//left arrow
  case 39: if (QvGalleryIndex != QvGallery.length-1) { QvGalleryIndex++; QvGalleryShow(); }; 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++;
});

if (QvGallery.length > 1) {
 $('#QvGalleryPrev').css('display', 'inline');
 $('#QvGalleryNext').css('display', 'inline');
 $('#QvGalleryCount').text( QvTextImage+ (QvGalleryIndex+1) +QvTextOf+ QvGallery.length );
};

$('#QvGalleryPrev').click(function() {
 if (QvGalleryIndex != 0) { QvGalleryIndex--; QvGalleryShow(); };
});

$('#QvGalleryNext').click(function() {
 if (QvGalleryIndex != QvGallery.length-1) { QvGalleryIndex++; QvGalleryShow(); };
});
 
 function QvGalleryShow() {
  $('#QvImage').hide();
  $('#QvLoading').show();
  QvImage.src = QvGallery[QvGalleryIndex];	//for ie: must be called after $('#QvImage').hide()
  $('#QvGalleryCount').text( QvTextImage+ (QvGalleryIndex+1) +QvTextOf+ QvGallery.length );
  $('#QvTitle').text('');
  QvTitle = $('a.quiteview[href='+ QvGallery[QvGalleryIndex] +']').attr('title');
 };
 
 /* /gallery */

 
return false;


});

};