$(document).ready(function () {
	
	var curr = 0;
	var offset = 635;
	var total = 0;
	var timer = 8000;
	var t = setTimeout(function(){slide('forward')}, timer);
	var cc = "#"+(curr);
	
	$("#dotholder").find(cc).attr("src", "images/btn.dot-red.png");		
	
	$("#dotholder").find("img").each(function(){
		total++;
		$(this).click(function(){
			slide($(this).attr("id"));
		})
		
	});
	
	function slide(dir)
	{
		$("#dotholder").find(cc).attr("src", "images/btn.dot-grey.png");
		clearTimeout(t);
		
		if(dir == 'forward')
		{
			if(curr < total-1)
			{	
				curr++;
				$("#slidercontainer").animate({left:(-(curr*offset))}, 1000);
				
			}
			else
			{
				$("#slidercontainer").animate({left:0}, 1000);
				curr = 0;
			}
		}
		
		else
		{
			curr = (dir);
			
			if(curr == 0)
			{
				$("#slidercontainer").animate({left:0}, 1000);
			}
			else
			{
				$("#slidercontainer").animate({left:(-(curr*offset))}, 1000);
			}
		}
		
		cc = "#"+(curr);			
		$("#dotholder").find(cc).attr("src", "images/btn.dot-red.png");
		t = setTimeout(function(){slide('forward')}, timer);
	}

});
