var sizeH = 0;
var sizeW = 0;
var activeProject = 0;
var images = new Array();
// Load hook
$(document).ready(function(){
	// Discovering of all images
	populateImages();
	
	// Switch to first project
	toggleProject(1,true);
	
	// Bind
	$('#project_navigation_previous').click(function(){
		toggleProject(-1,false);
	});
	
	$('#project_navigation_next').click(function(){
		toggleProject(1,false);
	});
	
	sizeH = $(window).height();
	sizeW = $(window).width();
	
	// Resize hook
	$(window).resize(function(){
		// Save new window size
		
		sizeH = $(window).height();
		sizeW = $(window).width();
	
		// Callback
		resizeImage('image_center',false);
	});
});
resizeImage = function(div,exclusive){
	if ($('#'+div)[0].complete)
	{
		// Take image size
		$('#'+div).css('height','');
		$('#'+div).css('width','');
		var itmpH = $('#'+div).height();
		var itmpW = $('#'+div).width();
		
		if ( itmpH > 1 )
			var imageH = itmpH;
		if ( itmpW > 1 )
			var imageW = itmpW;
		
		// Calculate ratios
		var wRatio = sizeW / sizeH;
		var iRatio = imageW / imageH;
		
		if ( wRatio >= iRatio )
		{
			var calW = sizeW;
			var calH = ( sizeW / imageW ) * imageH;
		}
		else
		{
			var calW = ( sizeH / imageH ) * imageW;
			var calH = sizeH;
		}
		
		// Change current image size
		if ( exclusive )
		{
			$('#'+div).css('width',calW+'px');
			$('#'+div).css('height',calH+'px');
		}
		else
		{
			$('.images').css('width',calW+'px');
			$('.images').css('height',calH+'px');
		}
		
		// Center image
		var totalH = calH / 2;
		var shownH = sizeH / 2;
		var top = ( totalH - shownH ) * -1;
		
		var totalW = calW / 2;
		var shownW = sizeW / 2;
		var left = ( totalW - shownW ) * -1;
		
		if ( exclusive )
		{
			$('#'+div).css('top',top+'px');
			$('#'+div).css('left',left+'px');
		}
		else
		{
			$('.images').css('top',top+'px');
			$('.images').css('left',left+'px');
		}
		$('#image_holder').css('width',sizeW+'px');
		$('#image_holder').css('height',sizeH+'px');
	}
	else
		setTimeout('resizeImage(\''+div+'\','+exclusive+')',200);
}
toggleProject = function(index,start){
	activeProject += index;
	activeProject = checkIndex(activeProject);
	currentProject = projects[activeProject];
	
	// Load images
	imagesPr = images[activeProject];
	
	// Load project datas
	$('#image_data').css('opacity','1');
	$('#image_data').animate({opacity: 0},200,'swing',function(){
		$('.image_data_title').html(currentProject[0]);
		$('.image_data_text').html(currentProject[1]);
		$('.image_data_link').html(currentProject[2]);
		$('.image_data_link').attr('href',currentProject[3]);
		$('#image_data').css('display','block');
		$('#image_data').animate({opacity: 1},200,'swing',function(){
		
			// Animator
			if ( ! start )
			{
				$('#image_animator').css('display','block');
				
				$('#projet_haut').css('display','block');
				$('#image_animator')[0].src = imagePath+imagesPr[0]+'.jpg';
				resizeImage('image_animator',true);
				$('#projet_haut').css('display','none');
				
				$('#image_animator').css('left',(index*sizeW)+'px');
				
				$('#image_center').animate({left: (-1*index*sizeW)+'px'},1000);
				$('#image_animator').animate({left: '0px'},1000,'swing',function(){
					$('#image_center')[0].src = imagePath+imagesPr[0]+'.jpg';
					$('#image_center').css('left','0px');
					$('#image_animator')[0].src = '';
			
					$('#image_animator').css('display','none');
					$('#projet_haut').css('display','none');
					resizeImage('image_center',false);
					
				});
			}
			else
			{
				$('#projet_haut').css('display','none');
				$('#image_center')[0].src = imagePath+imagesPr[0]+'.jpg';
				$('#image_holder').css('opacity','0').css('display','block').animate({opacity: 1},400);
				resizeImage('image_center',false);
			}
	
			// Load image selector
			loadSelector();
			
			// Preload images
			preloadImages();
			
		});
	});
	
	
}
checkIndex = function(index){
	if (index >= projects.length)
		return 1;
	else if (index <= 0)
		return projects.length-1;
	else
		return index;
}
preloadImages = function(){
	// Unload first
	$('#image_project_previous')[0].src = '';
	$('#image_project_next')[0].src = '';
	$('#image_next')[0].src = '';
	// Next image
	if ( images[activeProject].length > 1 )
		$('#image_next')[0].src = imagePath+images[activeProject][1]+'.jpg';
	
	// Adjacent projects' first images
	$('#image_project_previous')[0].src = imagePath+images[checkIndex(activeProject-1)][0]+'.jpg';
	$('#image_project_next')[0].src = imagePath+images[checkIndex(activeProject+1)][0]+'.jpg';
}
populateImages = function(){
	for(i=1;i<projects.length;i++)
	{
		imagesStr = new String(projects[i][4]);
		imagesList = imagesStr.split("|"); 
		images[i] = imagesList;
	}
}
loadSelector = function(){
	
	var buffer = "<span class=\"selector\">";
	
	for(i=0;i<images[activeProject].length;i++)
	{
		if ( i == 0 )
			buffer += "<img src=\"squelettes/css/css_img/hover.png\" class=\"simages active\" id=\"i"+i+"\" alt=\"\" />";
		else
			buffer += "<img src=\"squelettes/css/css_img/button.png\" class=\"simages\" id=\"i"+i+"\" alt=\"\" />";
	}
	buffer += "</span>";
	$('.image_data_selector').html(buffer);
	
	$('.simages').click(function(){
		selectImage($(this).attr('id'));
	});
}
selectImage = function(id){
	$('#projet_haut').css('display','block');
	// Delete active hover
	$('.simages.active')[0].src = 'squelettes/css/css_img/button.png';
	$('.simages.active').removeClass('active');
	
	// Select requested image
	rid = id.split('i');
	$('#image_center').fadeOut(500,function(){
		$('#image_center')[0].src = '';
		$('#image_center')[0].src = imagePath+images[activeProject][rid[1]]+'.jpg';
		$('#image_center')[0].onload = $(function(){
			$('#projet_haut').css('display','none');
			
			$('#image_center').fadeIn(500,function(){
				
				// Next preloader
				if ( images[activeProject].length > rid[1]+1 )
					$('#image_next')[0].src = imagePath+images[activeProject][rid[1]+1]+'.jpg';
				
				// Activate new button
				$('#'+id).addClass('active');
				$('#'+id)[0].src = 'squelettes/css/css_img/hover.png';
				
				
			});
		});
	});
}