$(document).ready(function() {
	// Preview mouseover functionaliteit

	$("#prv_overlay").hover(function() {
		//mouseEnter
		$(".prv_backdrop").stop().animate({top: '-2px'}, 200, 
			function() {
				$(".prv_backdrop").animate({top: '0px'}, 100)
			}
		);

		$("img#prv_shadow").stop().animate({height: '-=5', width: '-=10', marginTop: '-=5', marginLeft: '+=5', filter: ''}, 100);

		$("img#demo").stop().animate({top: '-40px'},{duration: 500, easing: 'easeOutExpo'});
	}, function() {
		//mouseLeave
		$(".prv_backdrop").stop().animate({top: '4px'}, 200, 
			function() {
				$(".prv_backdrop").animate({top: '3px'}, 100)
			}
		);

		$("img#prv_shadow").stop().animate({height: '80px', width: '490px', marginTop: '350px', marginLeft: '24px', filter: ''}, 100);

		$("img#demo").stop().animate({top: '-400px'},{duration: 500, easing: 'easeInBack'});
	});


	// Preview browse functionaliteit

	var index = 0;
	var animating = false;
	
	$.fn.scrollPrv = function(dir) {
		var direction = "480px";
		var factor = 1;
		var total = $("#prv_scrContainer img").length;
		
		if(dir == "prv_arrow_l")
		{
			var direction = "-480px";
			var factor = -1;
		}
				
		if(index+factor > total-1 || index+factor < 0-total+1 )
		{
			index = 0;
		}
		else {
			index = index + factor;
		}

		var title = $("#prv_scrContainer a").eq(index).attr("title");
		var pic = $("#prv_scrContainer img").eq(index).attr("src"); // Het te laden plaatje
		var link = $("#prv_scrContainer a").eq(index).attr("href");
		
		animating = true;

		$(".prv_pic a[name='link']").attr("href", link);
		$("img#prv_overlay").attr("alt", title);
		
		$(".prv_pic").animate({backgroundPosition: '-=' + direction + ''},{duration: 600, easing: 'easeInOutQuart'});
		$(".prv_dummy")
				.animate({left: direction}, 0)
				.css("backgroundImage", "url('" + pic + "')")
				.animate({left: '0px'}, 600, "easeInOutQuart", function() {
					$(".prv_pic").css("backgroundImage", "url('" + pic + "')");
					animating = false;
				});
	}

	$(".prv_arrow_l, .prv_arrow_r").click(function() {
		if(animating == false)
		{
			var direction = $(this).attr("class");
			$(this).scrollPrv(direction);
		}
	});
});