/**
 * @author raptus
 */


/*
 *  this lightbox have a optinal function.
 *  every picture can have a any links.
 *  id tag to place the links. set false for no switch off this function.
 *  
 *  Example:
 *            <li>
 *           <a class="thumb" href="/lightbox_images/greenpeace-memory-big-28.jpg" title="Title #1"><img src="/memory_images/greenpeace-memory-small-28.jpg" alt="Title #1" /></a>
 *           <div class="caption">
 *             <h1>Wallis, 25.08.09 </h1>
 *             <p>
 *               Lorem Ipsum ....
 *               </p>
 *           </div>
 *           <div class="caption-link">
 *             <ul>
 *               <li>
 *                 <a href="#">- test (PDF)</a>
 *               </li>
 *               <li>
 *                 <a href="#">- test2 (PDF)</a>
 *               </li>
 *               <li>
 *                 <a href="#">- test3 (PDF)</a>
 *               </li>
 *               <li>
 *                 <a href="#">- test4 (PDF)</a>
 *               </li>
 *             </ul>
 *           </div>
 *         </li>
 *  
 */

//links = "#preview_box_link";
links = false;

var captionLink = [];

	// We only want these styles applied when javascript is enabled
			$('div.navigation').css({'width' : '300px', 'float' : 'left'});
			$('div.content').css('display', 'block');

			// Initially set opacity on thumbs and add
			// additional styling for hover effect on thumbs
			var onMouseOutOpacity = 0.67;
			$('#thumbs ul.thumbs li').css('opacity', onMouseOutOpacity)
				.hover(
					function () {
						$(this).not('.selected').fadeTo('fast', 1.0);
					}, 
					function () {
						$(this).not('.selected').fadeTo('fast', onMouseOutOpacity);
					}
				);

$(document).ready(function()
{
  wrapCaptionLinks();
  // Initialize Advanced Galleriffic Gallery
  var galleryAdv = $('#gallery').galleriffic('#thumbs', 
  {
    delay: 2000,
    numThumbs: 28,
    preloadAhead: 10,
    enableTopPager: true,
    enableBottomPager: true,
    imageContainerSel: '#slideshow',
    controlsContainerSel: '#controls',
    captionContainerSel: '#caption',
    loadingContainerSel: '#loading',
    renderSSControls: true,
    renderNavControls: true,
    playLinkText: 'Play Slideshow',
    pauseLinkText: 'Pause Slideshow',
    prevLinkText: '&lsaquo; Previous Photo',
    nextLinkText: 'Next Photo &rsaquo;',
    nextPageLinkText: 'Next &rsaquo;',
    prevPageLinkText: '&lsaquo; Prev',
    enableHistory: true,
    autoStart: false,
    onChange: function(prevIndex, nextIndex)
    {
      setCaptionLinks(nextIndex);
      $('#thumbs ul.thumbs').children().eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end().eq(nextIndex).fadeTo('fast', 1.0);
    },
    onTransitionOut: function(callback)
    {
      $('#caption').fadeTo('fast', 0.0);
      $('#slideshow').fadeTo('fast', 0.0, callback);
    },
    onTransitionIn: function()
    {
      $('#slideshow').fadeTo('fast', 1.0);
      $('#caption').fadeTo('fast', 1.0);
      changeArrowAttribut();

    },
    onPageTransitionOut: function(callback)
    {
      $('#thumbs ul.thumbs').fadeTo('fast', 0.0, callback);
    },
    onPageTransitionIn: function()
    {
      $('#thumbs ul.thumbs').fadeTo('fast', 1.0);
    }
  });
});


function changeArrowAttribut()
{
  $('#preview_arrow_link_right').attr('href',$('#slideshow .advance-link').attr('href'));
  pic = $('#slideshow .advance-link').attr('href');
  pic = pic.replace(/#/gi,'');
  pic = pic -2;
  if (pic < 0)
    pic = 0;
  $('#preview_arrow_link_left').attr('href',"#"+pic);
}


function wrapCaptionLinks()
{
  if (!links)
    return;
  $('#thumbs .thumbs>li').each(function(index){
    captionLink[index] = $('.caption-link', this).html();
    $('.caption-link', this).remove()
  });
}

function setCaptionLinks(index)
{ 
  if (!links)
    return;
  $(links).fadeOut(20,function(){
    $(links).empty();
    $(links).append(captionLink[index]);
    $(links).fadeIn(1000);
  });
}