// beta 0.1

/********************************************************************/
/*	Slidert door Frank van den Berg © 2009							*/
/*	september 2009													*/
/*	slider functie properties zetten								*/
/********************************************************************/

	    var panewidth = 555;
		var sliderpos = panewidth;
		var ct = $('#slider').children().size();
		var slider = ct * panewidth;
		
		var browser = $('#slidemaster').width();			
		$('#clicker').css('width: '+browser+'px');

		function loadmyvars(){
			var browser = $('#slidemaster').width();			
			$('#clicker').css('width: '+browser+'px');
		}
	
/********************************************************************/
/*	slider functie													*/
/********************************************************************/

		// Als document vol ledig is geladen. fire!
		$(document).ready(function(){
		$("#slidemaster").fadeTo("slow", 1.0);
	
		// scrollbalken killen
		$('#slidemaster').css({overflow: 'hidden'});

		// wordt de totale breedte voor de slider gezet.
		$('#slider').css('width: '+slider+'px');
		
		
		var left = 0;
		var rest = slider - browser;
		var negative = 0 - (slider - browser);
		
		$("#clicker").click(function(event){
			$("#clicker").animate({"opacity":"0"}, 200);
		
		if($('#slider').css('left') == negative+'px'){
			$("#slider").animate({ left: '0px'}, 2000);
			rest = slider - browser;
			left = 0;
		} else {
		
		
		
			if (slider > browser){ // als de slider groot genoeg is om te schuiven
			
				if (rest > panewidth){  // steeds de panewidt opschuiven
					left += panewidth;
					rest -= panewidth;
				} else {
					left = slider - browser; // het laatste stukje opschuiven
				}
			
			// de hele meuk animeren
			$("#slider").animate({ left: '-'+left+'px'}, 800);
			}
			
			//document.getElementById('guide').value= 'Rest is '+ rest +'  browser '+ browser;
	
			event.preventDefault(); // voorkomt herladen van de browser
		}
		
		event.preventDefault();
		});
		  
// einde als doc is geladen  
});			

$("a#clicker").mouseover(function(){
	$("#clicker").fadeTo("fast", 0.5);
	loadmyvars();
}).mouseout(function(){
	$("#clicker").fadeTo("fast", 0.0);
	loadmyvars();
});



 $(window).bind('resize', function(){
	loadmyvars();
});