jQuery(document).ready(function() {
	function closeByKeyPress(e) {
		if (e.which == 0 || e.which == 27) {
			closeLightbox();
			jQuery(document).unbind('keypress');
		}
	}

	function openLightbox(thumb) {
		var desc = thumb.attr('title');
		var scrollTop	= jQuery(window).scrollTop();
		var bodyHeight	= jQuery("#page").height();
		var fHeight = parseInt(bodyHeight);
		if (jQuery('#lightboxBg').length == 0) {
			jQuery(document.body).append('<div style="height: ' + fHeight + 'px; " id="lightboxBg">&nbsp;</div>');
			jQuery('#lightboxBg').css('opacity', 0.8);
		} else {
			jQuery('#lightboxBg').css('display', 'block');
		}
		
		jQuery('#lightboxCt').remove();
		jQuery('#lightboxImg').remove();
		
		var galleryItems = jQuery('img[rel=' + thumb.attr('rel') + ']');
		
		//First, we take care of the image
		var imgSrc = '<img id="lightboxImg" src="slideshows/' + thumb.attr('directory') + '/' + thumb.attr('imgname') + '_1.' + thumb.attr('suffix') + '" />';
		jQuery(document.body).append(imgSrc);
		var img = jQuery('#lightboxImg');
		
		img.load(function() {
			var ctWidth		= img.width();
			var ctHeight	= img.height();
			
			//Then we create the lightbx
			var ct = '<div id="lightboxCt">';
			ct += '<div id="lightboxClose">X Fenster schließen</div>';
			ct += '<div id="lightboxCtImg"><img id="lightboxNavLeft" src="slideshows/layout/navLeft.gif" /><img id="lightboxNavRight" src="slideshows/layout/navRight.gif" /></div>';
			ct += '<div id="lightboxCtDesc"></div>';
			ct += '</div>';
			jQuery(document.body).append(ct);
			var ctI = jQuery('#lightboxCtImg');
			var ctD = jQuery('#lightboxCtDesc');
			var cl = jQuery('#lightboxClose');
			ct	= jQuery('#lightboxCt');
			
			var navLeft = jQuery('#lightboxNavLeft');
			var navRight = jQuery('#lightboxNavRight');
			
			ctI.css('background-image', '');
			ct.css('padding-top', cl.height()+parseInt(cl.css('padding-top'))+parseInt(cl.css('padding-bottom')));
			ct.css('padding-bottom', ctD.height()+parseInt(ctD.css('padding-top'))+parseInt(ctD.css('padding-bottom')));
			
			ct.css('width', ctWidth);
			ct.css('height', ctHeight);
			ct.css({
				top: '45%',
				left: '50%',
				marginLeft: (-1*(ctWidth/2)),
				marginTop: (-1*(ctHeight/2)+jQuery(window).scrollTop())
			})
			cl.css('right', '0px');
			
			
			//Now we combine the container and the image
			var index = parseInt(thumb.attr('galleryIndex'));
			img.css('display', 'none');
			img.css('visibility', 'visible');
			img.css('position', 'relative');
			ctI.append(img);
			ctI.css('background-image', '');
			ctD.html(desc);
			img.fadeIn(200, function() {
				if (thumb.attr('galleryIndex') > 0) {
					navLeft.css('visibility', 'visible');
					navLeft.click(function() {
						//Check wether images available
						jQuery(document).unbind('keypress');
						changeImage($(galleryItems[index-1]));
					}); //navLeft.click
				} //check for left nav
				if (thumb.attr('galleryIndex') < galleryItems.length-1) {
					navRight.css('visibility', 'visible');
					navRight.click(function() {
						//Check wether images available
						jQuery(document).unbind('keypress');
						changeImage($(galleryItems[index+1]));
					}); //navRight.click
				} //check for right nav
			});
			
			cl.click(function() {
				closeLightbox();
			});
			jQuery(document).keypress(closeByKeyPress);
			
			

			
			jQuery(window).scroll(function() {
				if (ct.length > 0) {
					ct.css('margin-top', -1*ct.height()/2+jQuery(window).scrollTop());
				}
			});
		}); //img.load
	}
	
	function changeImage(thumb) {
		var desc = thumb.attr('title');
		var galleryItems = jQuery('img[rel=' + thumb.attr('rel') + ']');
		var navLeft = jQuery('#lightboxNavLeft');
		var navRight = jQuery('#lightboxNavRight');
		navLeft.unbind('click');
		navRight.unbind('click');
		navLeft.css('visibility', 'hidden');
		navRight.css('visibility', 'hidden');
		if (jQuery('#lightboxImg').length > 0) {
			//fade out the old image
			jQuery('#lightboxImg').fadeOut(
				200,
				function() {
					jQuery('#lightboxImg').remove();
					changeImage(thumb);
				}
			);
			return;
		}
		
		//append the new image to body to get the size
		var imgSrc = '<img id="lightboxImg" src="slideshows/' + thumb.attr('directory') + '/' + thumb.attr('imgname') + '_1.' + thumb.attr('suffix') + '" />';
		jQuery(document.body).append(imgSrc);
		var img = jQuery('#lightboxImg');
		var index = parseInt(thumb.attr('galleryIndex'));
		
		img.load(function() {
			var ctD = jQuery('#lightboxCtDesc');
			ctD.html(desc);
			var ctWidth		= img.width();
			var ctHeight	= img.height();
			var ct	= jQuery('#lightboxCt');
			var ctI = jQuery('#lightboxCtImg');
			ct.animate({
				height: ctHeight,
				width: ctWidth,
				marginLeft: (-1*(ctWidth/2)),
				marginTop: (-1*((ctHeight)/2)+jQuery(window).scrollTop())
			},
			500,
			'swing',
			function() {
				ctI.append(img);
				img.css('display', 'none');
				img.css('visibility', 'visible');
				img.fadeIn(200, function() {
					if (thumb.attr('galleryIndex') > 0) {
						navLeft.css('visibility', 'visible');
						navLeft.click(function() {
							//Check wether images available
							jQuery(document).unbind('keypress');
							changeImage($(galleryItems[index-1]));
						}); //navLeft.click
					} //check for left nav
					if (thumb.attr('galleryIndex') < galleryItems.length-1) {
						navRight.css('visibility', 'visible');
						navRight.click(function() {
							//Check wether images available
							jQuery(document).unbind('keypress');
							changeImage($(galleryItems[index+1]));
						}); //navRight.click
					} //check for right nav
					jQuery(document).keypress(closeByKeyPress);
				});
			})
		});
	}
	
	function closeLightbox() {
		jQuery('#lightboxBg').css('display', 'none');
		jQuery('#lightboxCt').css('display', 'none');
		jQuery(document).unbind('keypress');
	}
	
	jQuery('.slideshow').each(function(i) {
		var item = jQuery(this);
		var table = jQuery(item.find('table'));
		var ctWidth		= item.width();
		var tableWidth	= table.width();
		var animateDuration   = tableWidth*2.5;
		var left = jQuery(item.find('.left'));
		var right = jQuery(item.find('.right'));
		
		
		//lightbox lite
		table.find('td > div > img').click(function() {
			//openLightbox(jQuery(this));
		});
		
		
		if (tableWidth+right.width()+left.width() < item.width()) {
			return;
		}
		//slider start
		right.mouseover(function() {
			table.stop();
			table.animate({
					'left': ctWidth-tableWidth-left.width()-4
				}, {
					duration: animateDuration,
					easeMethod: 'linear'
				}
			);
		});
		right.mouseout(function() {
			table.stop();
		});
		
		left.mouseover(function() {
			table.stop();
			table.animate({
					'left': left.width()+4
				}, {
					duration: animateDuration,
					easeMethod: 'linear'
				}
			);
		});
		left.mouseout(function() {
			table.stop();
		});
		//slider end
	});
});