var timerID = null;
function sliders () {
	//finding active image
	var $vis = $("#slides a.active");
	var $visNext = $vis.next();
	var $visNextAttr = $vis.next().children("img").attr("src");
	if($visNextAttr == undefined)
	{$visNext = $('#slides a:first');}
	else
	{$visNext = $vis.next();}
	
	//finding active bullet
	var $activeBullet = $("#bullets li.active");
	var $activeBulletNext = $activeBullet.next();
	var $activeBulletNextIn = $activeBulletNext.index();
	if ($activeBulletNextIn <=0)//if there's no next bullet - start over
	{var $activeBulletNext = $("#bullets li:first");}
	else
	{$activeBulletNext = $activeBullet.next();}
	
	$visNext.show();
	$vis.animate(
			{left:'+=700'}, 
			1500, 
			function(){
				$vis.removeClass("active").hide().css("left","0");
				$visNext.addClass("active")
				});
	$activeBullet.removeClass("active");
	$activeBulletNext.addClass("active");
	}
	

$(window).load (function(){
		$(function () {
	        timerID = setInterval("sliders()", 3000);
	    });
		
		$("#bullets li").click(
			   function () {
				    window.clearInterval(timerID);
					var clickedBullet = $(this).index();//find out which bullet was clicked
					var $vis = $("#slides a.active");
					var $visNext = $("#slides a:eq("+clickedBullet+")");//make next active slide - corresponding photo
					
					var $activeBullet = $("#bullets li.active");
					var $activeBulletNext = $(this);//make next active bullet the one that was clicked
					
					$visNext.show();
					$vis.animate(
						{left:'+=700'}, 
						2000, 
						function(){
							$vis.removeClass("active").hide().css("left","0");
							$visNext.addClass("active")
							});
					$activeBullet.removeClass("active");
					$activeBulletNext.addClass("active");
					$("#pause").show();//show the pause button
			   });
		$("#pause").click(
				function () {
					timerID =  setInterval( "sliders()", 3000 );
					$("#pause").hide();
				});
});