$(document).ready(function(){


	switchTo('app');	
	
	$("#scroller-app-window").scrollable({
		easing: 'swing',
		size: '1',
		items: '#scroller-app-wrap',
		loop: 'true',
		next: '#button-next-project-app' ,
		navi: '#project-dots-app',
		naviItem: 'a',
		keyboard: true,
		speed: '800'
	});	

	$("#scroller-ben-window").scrollable({
		easing: 'swing',
		size: '1',
		items: '#scroller-ben-wrap',
		loop: 'true',
		next: '#button-next-project-ben' ,
		navi: '#project-dots-ben',
		naviItem: 'a',
		keyboard: true,			
		speed: '800'
	});				
	
	$("#scroller-man-window").scrollable({
		easing: 'swing',
		size: '1',
		items: '#scroller-man-wrap',
		loop: 'true',
		next: '#button-next-project-man' ,
		navi: '#project-dots-man',
		naviItem: 'a',
		keyboard: true,			
		speed: '800'
	});	
	
	$("#scroller-trac-window").scrollable({
		easing: 'swing',
		size: '1',
		items: '#scroller-trac-wrap',
		loop: 'true',
		next: '#button-next-project-trac' ,
		navi: '#project-dots-trac',
		naviItem: 'a',
		keyboard: true,			
		speed: '800'
	});		
			
 	//set up events to handle browsing project categories
    $("#projects .app a ").bind("click", function(){ switchTo("app");});
    $("#projects .ben a ").bind("click", function(){ switchTo("ben");});
    $("#projects .man a ").bind("click", function(){ switchTo("man");}); 
    $("#projects .trac a ").bind("click", function(){ switchTo("trac");}); 	
    		
  });
 		
var curSect = "";

function switchTo(which){
	jQuery.easing.def = "easeInOutSine";
	
	h = $(".project").height();  //so we don't have to hardcode the row height;
	if (which == curSect) { return; }  //don't switch if we are on the selected tab
	
	if (which == "app"){
		$(".button-next-project").hide();
		$("#button-next-project-app").show();		
		$(".project-dots").hide();
		$("#project-dots-app").show(300);		
		$("#project-type-nav span").animate({opacity: '.65'}, { "duration": 300 } );	
		$("#project-type-nav a").css("cursor", "pointer");		
		$("#project-type-nav .app a").css("cursor", "default");			
		$("#project-type-nav .current").animate({top: "-1px"  }, { "duration": 300 } );
		$("#project-type-nav .app span").animate({opacity: '1.0'}, { "duration": 300 } );
		$("#scroller-vertical").animate({top: '0'}, { "duration": 300 } );
	}
		
	if (which == "ben"){
		$(".button-next-project").hide();
		$("#button-next-project-ben").show();		
		$(".project-dots").hide();	
		$("#project-type-nav span").animate({opacity: '.65'}, { "duration": 300 } );
		$("#project-type-nav a").css("cursor", "pointer");		
		$("#project-type-nav .ben a").css("cursor", "default");					
		$("#project-type-nav .current").animate({ 	top: "35px"   }, { "duration": 300 } );
		$("#project-type-nav .ben span").animate({opacity: '1.0'}, { "duration": 300 } );
		$("#scroller-vertical").animate({top: "-"+(h)+"px"}, { "duration": 300 } );
		$("#project-dots-ben").show(300);
	}
	
	if (which == "man"){
	
		$(".button-next-man").hide();
		$("#button-next-project-man").show();		
		$(".project-dots").hide();
		$("#project-type-nav span").animate({opacity: '.65'}, { "duration": 300 } );	
		$("#project-type-nav a").css("cursor", "pointer");		
		$("#project-type-nav .man a").css("cursor", "default");				
		$("#project-type-nav .current").animate({ 		top: "71px"	    }, { "duration": 300} );
		$("#project-type-nav .man span").animate({opacity: '1.0'}, { "duration": 300 } );
		$("#scroller-vertical").animate({top: "-"+(h*2)+"px"}, { "duration": 300 } );
		$("#project-dots-man").show(300);	
	}		
	
	if (which == "trac"){
		$(".button-next-project").hide();
		$("#button-next-project-trac").show();		
		$(".project-dots").hide();
		$("#project-dots-trac").show(300);		
		$("#project-type-nav span").animate({opacity: '.65'}, { "duration": 300 } );	
		$("#project-type-nav a").css("cursor", "pointer");		
		$("#project-type-nav .trac a").css("cursor", "default");			
		$("#project-type-nav .current").animate({top: "104px"  }, { "duration": 300 } );
		$("#project-type-nav .trac span").animate({opacity: '1.0'}, { "duration": 300 } );
		$("#scroller-vertical").animate({top: "-"+(h*3)+"px"}, { "duration": 300 } );
	}
	
		
	curSect = which;

}