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


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


QvTextLoading = "Načítavam obrázok...";
QvTextImage = "Obrázok ";
QvTextOf = " z ";
QvTextKey = "klávesa";
QvTextPrev = "predošlý";
QvTextNext = "ďalší";
QvTextClose = "zavrieť";

MvZoom = false;

MvContent = "<div id='Quiteview'>";
MvContent += "<div id='QvArea'>";
MvContent += "<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>";
MvContent += "<table id='QvTable' cellspacing='0' cellpadding='0' style='position:fixed; left:0; top:0; width:100%; height:100%; z-index:1000'>";
MvContent += "<tr>";
MvContent += " <td style='width:50%'>";
MvContent += " <td style='vertical-align:middle; font: 12px arial; color:#fff'>";
MvContent += "  <div id='QvTitle'></div>";
MvContent += "  <div id='MvArea' style='overflow:auto; text-align:center; line-height:0; margin:0 auto; padding:0'><table cellspacing='0' cellpadding='0'><tr><td style='line-height:0; overflow:hidden'><img id='QvImage' style='vertical-align:bottom; margin: 3px 0; cursor:pointer; display:none; margin:0; padding:0'></table></div>";	//table je pre operu, overflow:hidden pre ie a chrome
MvContent += "  <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>";
MvContent += "  <div id='QvGallery' style='display:inline'>";
MvContent += "   <div id='QvGalleryCount' style='display:inline'></div>&nbsp;&nbsp;";
MvContent += "   <div id='QvGalleryPrev' style='display:none'>&lt;<span style='text-decoration:underline; cursor:pointer' title='&lt;- "+ QvTextKey +"'>"+ QvTextPrev +"</span></div>&nbsp;";
MvContent += "   <div id='QvGalleryNext' style='display:none'><span style='text-decoration:underline; cursor:pointer' title='-&gt; "+ QvTextKey +"'>"+ QvTextNext +"</span>&gt;</div>&nbsp;&nbsp;";
MvContent += "  </div>";
MvContent += "  <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>";
MvContent += " <td style='width:50%'>";
MvContent += "</table>";
MvContent += "</div>";
MvContent += "<div id='MvText' style='display:none; position:fixed; left:50%; top:50%; margin: -17px 0 0 -116px; padding:10px; background:#000; opacity:0.75; filter:alpha(opacity=75); font: bold 12px arial; color:#fff; z-index:1001'>Kliknutím na mapu sa priblíži / oddiali.</div></div>";


function mapaview() {

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

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

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


QvImage.onload = function() {
 QvImageFit(); 
 $('#QvImage').attr('src', QvImage.src);
 $('#QvLoading').hide();
 $('#QvImage').show(); 
 if (QvTitle != '') { $('#QvTitle').text(QvTitle); };
 $('#MvText').show(); 
 window.setTimeout("$('#MvText').fadeOut(500)", 3000);
};

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 = QvImageHeightOrig = QvImage.height;
 QvImageWidth = QvImageWidthOrig = 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);
 
 $('#MvArea').width(QvImageWidth);
 $('#MvArea').height(QvImageHeight);


};

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

$('#QvImage, #MvText').click(function() {
 if (MvZoom == false) {
  $('#QvImage').animate({ width: QvImageWidthOrig, height: QvImageHeightOrig }, 500 );	//pre ie: min. 500ms
  if ( $('body').width() < QvImageWidthOrig ) {
   $('#MvArea').animate({ width: QvAreaWidth }, 500 );
  } else {
   $('#MvArea').animate({ width: QvImageWidthOrig }, 500 );
  };
  MvZoom = true;
 } else {
  $('#QvImage').animate({ width: QvImageWidth, height: QvImageHeight }, 500 );	//pre ie: min. 500ms
  $('#MvArea').animate({ width: QvImageWidth }, 500 );
  MvZoom = false;
 };
});

$('#QvClose').click(function() { 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(); });
};

 
return false;


});

};