$(document).ready(function() {
		(function ($) {
		// VERTICALLY ALIGN FUNCTION
		$.fn.vAlign = function() {
			return this.each(function(i){
			var ah = $(this).height();
			var ph = $(this).parent().height();
			var mh = (ph - ah) / 2;
			$(this).css('padding-top', mh);
			});
		};
		
		})(jQuery);
		
		$('#content').css('height',$(window).height());
	//	$('#slideshow li').css('width',$(window).width());
	//	$('#slideshow ul').css('width',$(window).width()*8);
	//	$('#slideshow').css('width',$(window).width());
		
		$('.centered').vAlign();
		
		$.easing.easeOutQuart = function (x, t, b, c, d) {
			return -c * ((t=t/d-1)*t*t*t - 1) + b;
		};
		
		var $prev = $('#previous'),//prev button
			$next = $('#next');//next button

		$('#previous').hide().end();
		
		var $currentSlide = 0;
		$('#slideshow').serialScroll({
				items:'li',
				prev:'#previous',
				next:'#next',
				onBefore:function( e, elem, $pane, $items, pos ){
						$currentSlide = pos;
							
							if( pos == 0 )
								$prev.fadeOut("medium");
							if( pos != 0)
								$prev.add($next).fadeIn("medium");
							else if( pos == $items.length-1 )
								$next.fadeOut("medium");
											
						},
				navigation:'#menu li a',
				//offset:-230, //when scrolling to photo, stop 230 before reaching it (from the left)
				start:0, //as we are centering it, start at the 2nd
				duration:300,
				force:true,
				lazy:true,
				stop:true,
				easing:'easeOutQuart',
				lock:false,
				cycle:false, //don't pull back once you reach the end
			});
		
		var $paneTarget = $('#slideshow');	
			$('.gotofoto').click(function(){
				$('#slideshow').trigger( 'goto', [1] );
			});
			$('.gotovideo').click(function(){
				$('#slideshow').trigger( 'goto', [2] );
			});
			$('.gototienda').click(function(){
				$('#slideshow').trigger( 'goto', [7] );
			});
			$('.gotofan').click(function(){
				$('#slideshow').trigger( 'goto', [6] );
			});
		
		$(window).bind('resize', function() {
		
			var resizeTimer = null;
			if (resizeTimer) clearTimeout(resizeTimer);
			resizeTimer = setTimeout(function() {
				$('#content').css('height',$(window).height());
			
				
				$('#slideshow').trigger( 'goto', [$currentSlide] );
				$('img.centered').vAlign();
				
				
			}, 10);
			
		
	
		});
	});