$(function() {
	
	$("#videos").css("width", "100000px");
	$("#videos").css("display", "block");
	
	width = $(".case").outerWidth(true);
	countVideos = $(".case").length-2;
	
	sliderMax = width*countVideos;
		   
	$("#slider").slider({max: sliderMax, animate: true, slide: margin, stop: margin});
	
	function margin(){
		var value = $('#slider').slider('option', 'value');
		$("#videos").css("margin-left", "-"+value+"px");	
	}
	
	$(".videoNav").click(function(){
								  
		var length = parseFloat($("#videos").css('marginLeft').length-2);
		var current = parseFloat($("#videos").css('marginLeft').substr(0, length));
		
		var left = (current)+(width);
		var right = (current)-(width);
		
		if($(this).attr("alt") == "Right")
		{
			if(right > parseFloat("-"+sliderMax))
			{
				$("#videos").animate({marginLeft: right});						   
			}
			else
			{
				$("#videos").animate({marginLeft: parseFloat("-"+sliderMax)});						   
			}
		}
		
		if($(this).attr("alt") == "Left")
		{
			if(left < 0)
			{
				$("#videos").animate({marginLeft: left});						   
			}
			else
			{
				$("#videos").animate({marginLeft: 0});						   
			}
		}
		
		$("#slider").slider("value", left-(left*2)+width);
		
	});
	
	$("#displayBlock").click(function(){
		$("#videos").fadeTo("fast", 0, function(){
			$("#videos").css("width", "860px");
			$(".videoNav").css("display", "none");
			$("#slider").css("display", "none");
			$("#videos").fadeTo("slow", 1);
			$("#videos").css("marginLeft", "0");
		});
	});
	
	$("#scrollMarquee").click(function(){
		$("#videos").fadeTo("fast", 0, function(){
			$("#videos").css("width", "100000px");
			$(".videoNav").css("display", "");
			$("#slider").css("display", "");
			$("#videos").fadeTo("slow", 1);
			$("#videos").css("marginLeft", "0");
			$("#slider").slider("value", 0);

		});
	});
	
});