/*******************************************************************/
// myLightbox - http://mylittlehomepage.net/de/sonstiges/mylightbox
/*******************************************************************/


// control images:
control_images = new Object();
control_images['throbber'] =      '/images/throbber.gif';
control_images['previous'] =      '/images/previous.png';
control_images['next'] =          '/images/next.png';
control_images['close'] =         '/images/close.png';

// Settings:
settings = new Object();
settings['position_top'] =        30;
settings['next_link'] =           '[&raquo;]';
settings['next_link_title'] =     'nächstes Bild';
settings['previous_link']       = '[&laquo;]';
settings['previous_link_title'] = 'voriges Bild';
settings['close_link'] =          '[x]';
settings['close_link_title'] =    'schließen';

// myLightbox HTML:
myLightbox_html = '<div id="mylightbox">\
<div id="photoboxheader">\
<div id="title"></div>\
<div id="nav"></div>\
<div id="close"><a href="#" id="mylightbox-close" onclick="return false"><img src="'+control_images['close']+'" alt="'+settings['close_link']+'" title="'+settings['close_link_title']+'" /></a></div>\
</div>\
<div id="photo"></div>\
<p class="description"></p>\
</div>';

// Background:
myLightbox_background = '<div id="mylightbox-background"></div>';

// preload images:
throbber_img = new Image();
throbber_img.src = control_images['throbber'];
previous_img = new Image();
previous_img.src = control_images['previous'];
next_img = new Image();
next_img.src = control_images['next'];

// 0 means disabled; 1 means enabled;
var popupStatus = 0;

// loading popup with jQuery magic!
function loadPopup()
 {
  //loads popup only if it is disabled
  if(popupStatus==0)
   {
    $("body").append(myLightbox_background);
    $("body").append(myLightbox_html);

    $("#mylightbox-background").css({
	   "opacity": "0.7"
    });

    $("#mylightbox-background").fadeIn("fast");
    $("#mylightbox").fadeIn("fast");

    // center popup on window resize:
    $(window).bind('resize', function() {
     centerPopup($("#mylightbox").width(),$("#mylightbox").height());
    });

    // close on click on close button:
    $("#mylightbox-close").click(function(){
     disablePopup();
    });

    // close on click on background:
    $("#mylightbox-background").click(function(){
     disablePopup();
    });

    // close on ESC key
    $(document).keypress(function(e){
     if(e.keyCode==27 && popupStatus==1){
      disablePopup();
     }
    });

    popupStatus = 1;
   }
 }

function disablePopup()
 {
  //if(popupStatus==1){
  $("#mylightbox").fadeOut("fast", remove);
  $("#mylightbox-background").fadeOut("fast", remove);
  popupStatus = 0;
  //}
}

// callback function to remove box and background:
function remove()
 {
  $(this).remove();
 }

function centerPopup(imgWidth,imgHeight)
 {
  //request data for centering
  var windowWidth = document.documentElement.clientWidth;
  var windowHeight = document.documentElement.clientHeight;
  if(typeof pageYOffset != 'undefined') // Mozilla
   {
    var top = pageYOffset + settings['position_top'];
   }
  else // IE
   {
    var top = document.documentElement.scrollTop + settings['position_top'];
   }
  //centering
  $("#mylightbox").css({
   "width":imgWidth,
   "position": "absolute",
   //"top": windowHeight/2-(imgHeight+100)/2,
   "top": top+"px",
   "left": windowWidth/2-(imgWidth+20)/2
  });
  //only need force for IE6
  $("#mylightbox-background").css({
   "height": windowHeight
  });
 }

function doit(e,t)
 {
  e.preventDefault();

  // get mylightbox links, image sources, titles (alt) and descriptions (title):
  var myLightboxLinks = new Array();
  var srcs = new Array();
  var titles = new Array();
  var descriptions = new Array();

  //$(".mylightbox").each(function(i) // get all links with class="mylightbox"
  $("a[rel='mylightbox']").each(function(i) // get all links with rel="mylightbox"
   {
    if($(this)[0] === $(t)[0]) mylightboxCurrent = i;
    myLightboxLinks.push($(this));
    srcs.push($(this).attr('href'));
    titles.push($(this).find('img').attr('alt'));
    descriptions.push($(this).find('img').attr('title'));
   });

  var numberOfImages = myLightboxLinks.length;
  var src = srcs[mylightboxCurrent];
  var title = titles[mylightboxCurrent];
  var description = descriptions[mylightboxCurrent];

  // determine previous and next image:
  if(numberOfImages>1)
   {
    if(typeof(myLightboxLinks[mylightboxCurrent+1])!='undefined')
     {
      var next = myLightboxLinks[mylightboxCurrent+1];
     }
    else
     {
      var next = myLightboxLinks[0];
     }
    if(typeof(myLightboxLinks[mylightboxCurrent-1])!='undefined')
     {
      var prev = myLightboxLinks[mylightboxCurrent-1];
     }
    else
     {
      var prev = myLightboxLinks[numberOfImages-1];
     }
   }

  loadPopup();

  centerPopup($("#mylightbox").width(),$("#mylightbox").height());

  // previous and next buttons:
  if(typeof(prev)!='undefined' && typeof(next)!='undefined')
   {
    $("#mylightbox #nav").html('<a class="prev" href="'+$(prev).attr('href')+'"><img src="'+control_images['previous']+'" alt="'+settings['previous_link']+'" title="'+settings['previous_link_title']+'" /></a> &nbsp; <a class="next" href="'+$(next).attr('href')+'"><img src="'+control_images['next']+'" alt="'+settings['next_link']+'" title="'+settings['next_link_title']+'" /></a>');
   }
  else
   {
    $("#mylightbox #nav").html('&nbsp;');
   }

  $("#mylightbox #title").html('');
  $("#photo").html('<div style="text-align:center;"><img src="'+control_images['throbber']+'" style="padding:100px;" /></div>');
  $("#mylightbox p.description").html('');

  var objImagePreloader = new Image();
  objImagePreloader.onload = function()
   {
    centerPopup(objImagePreloader.width,objImagePreloader.height);
    $("#mylightbox #title").html(title);
    $("#photo").hide();
    $("#photo").html('<img src="'+src+'" />');
    $("#photo").fadeIn("fast");
    $("#mylightbox p.description").html(description);
    objImagePreloader.onload=function(){};
   };
  objImagePreloader.src = src;

  $("#mylightbox #nav .next").click(function(e){
   doit(e,next);
  });

  $("#mylightbox #nav .prev").click(function(e){
   doit(e,prev);
  });
 }

$(function()
 {
  $("a[rel='mylightbox']").click(function(e){
  doit(e,this);
 });

});

