// execute your scripts when the DOM is ready.
$(document).ready(function() {




		
	// initialize scrollable
	api = $(".project-scroll").scrollable(
		{
			easing: 'swing',
			clickable: false,
			size: '1',
			items: '#project-wrapper',
			loop: 'true',
			prev: '#btn-prev-project',
			next: '#btn-next-project',
			keyboard: false,
			speed: 800
		
	}).navigator({api:true});
		



			
	// Starte Funktion vor dem Scrolling zum nächsten Projekt
	api.onBeforeSeek(	function() { 		
	
		// check if details are visible
		// when visible -> slideUp() 

			currentIndex = api.getPageIndex();
			
			$("#details_"+currentIndex).slideUp();
			$('#projekt-details').slideUp();	

	});




	// Setup handler on click auf Projekt
	$('.project').bind("click", show_details);





});



function show_details(which) {
	// first load current content out of a project-folder named  "currentIndex"_inc.php
	// second slideout the details-container


	currentIndex = api.getPageIndex();



  		$.get("inc/project_"+currentIndex+"/project_"+currentIndex+".php", function(data){   		   

		    $("#projekt-details").html(data);
  			$("#projekt-details").slideToggle('slow');
			// overlay images
			imagePreview();
			
			setTimeout("$.scrollTo('500','0');",300);			
    	});

}





/*
 * Image preview script 
 * powered by jQuery (http://www.jquery.com)
 * written by Alen Grakalic (http://cssglobe.com)
 *
 */
 
this.imagePreview = function(){	
	/* CONFIG */
		
		xOffset = -10;
		yOffset = -30;
		
		// these 2 variable determine popup's distance from the cursor
		// you might want to adjust to get the right result
		
	/* END CONFIG */
	$("a.prvw").hover(function(e){
		this.t = this.title;
		this.title = "";	
		var c = (this.t != "") ? "<br/>" + this.t : "";
		$("body").append("<p id='prvw'><img src='"+ this.href +"' alt='Image preview' />"+ c +"</p>");								 
		$("#prvw")
			.css("top",(e.pageY - xOffset) + "px")
			.css("left",(e.pageX + yOffset) + "px")
			.fadeIn("fast");						
    },
	function(){
		this.title = this.t;	
		$("#prvw").remove();
    });	
	$("a.prvw").mousemove(function(e){
		$("#prvw")
			.css("top",(e.pageY - xOffset) + "px")
			.css("left",(e.pageX + yOffset) + "px");
	});			
};