$(document).ready(function(){
	$('.menu').hide();
	$('.menu.work').show();
		
	//Click sur une section ////////////////////////////////////////////////////////////////////////////////////////////////////////
	////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
	////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
	$('.nav').live('click', function(){ 
		var obj = $(this);
		skins = $(obj).attr('id');
		
		//Switch des section (animation) ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
		if(!$(obj).hasClass('active'))
		{
			//Cache l'objet flash si il est ouvert (car il gere mal les z-index.)
			if ($('.nav.active .picture object').length != 0){ $('.nav.active .picture').html('');}
			//Background des div du menu vertical ( section)
			$('.nav').each( function(){
				$(this).css('background', 'url("skins/'+skins+'/background/'+$(this).attr('id')+'.jpg") top left no-repeat ');
			})
			
			//Affiche le menu cliqué.
			$('.menu').hide();
			$('.menu.'+skins).fadeIn(1000);
			$('.menu.'+skins+' .galerieListe').jScrollPane();
			$('#'+skins+' .navpicture').jScrollPane();
				
			$(obj).animate({ marginLeft: "225px"}, 1200, 'easeOutExpo' , function(){
				if ($(obj).hasClass('last'))
				{
					//Passe le active en dernier
					$(".nav.seconde .cache-color").show();
					$('.active').css('margin-left','1010px').addClass('last').removeClass('active').animate({marginLeft : "960px"},500, function(){$(".nav.seconde .cache-color").hide();});
					//Passe le div cliqué en premier
					$(obj).addClass('active').removeClass('last');
				}else{
					$(".nav.last .cache-color").show();
					$('.last').animate({ marginLeft: "910px"}, 500 , function(){
						$(".nav.last .cache-color").hide();
						//Enleve la classe second au div cliqué
						$('.seconde').addClass('temp').removeClass('seconde');
						//Passe le dernier en second
						$('.last').addClass('seconde').removeClass('last');
						//Passe le active en dernier et lui enleve la class active
						$('.active').hide().css('margin-left','960px').addClass('last');
						$('.last').show();//, function(){ $('.nav.seconde .wrapper').show(); });
						$('.active').removeClass('active');
						//Ajoute la class active au div cliqué.
						$('.temp').addClass('active');
						$('.active').removeClass('temp');
					});
				}
				
				//Activation du premier thumb ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
				$('#'+skins+' .navpicture .thumb:first').addClass('firstThumb'); 
				initFirstPicture(skins); 			
			});	
		}
	});

	//Click sur une galerie////////////////////////////////////////////////////////////////////////////////////////////////////////
	////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
	////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
	$('.galerieListe .galerie').live('click', function(){
	//Liste des thumbs
		var title = $(this).attr('title');
		$('.'+skins+' .galerie').removeClass('openGalerie');
		$(this).addClass('openGalerie');
		$.get('function/fn.thumb.liste.php',{section:skins,galerie:title},function(content){
			$('#'+skins).html(content);
				//Activation du premier thumb ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
				$('#'+skins+' .navpicture .thumb:first').addClass('firstThumb'); 
				$('#'+skins+' .navpicture').jScrollPane();
				var color = getSkinsColor('graph');
				$('#graph .thumb').hover( function(){ $(this).parent().css('background',color);},function(){ if (!$(this).hasClass('openThumb')){ $(this).parent().css('background','none'); }});
				initFirstPicture(skins); 	
		});	 
	});
	

	//Click sur un thumb////////////////////////////////////////////////////////////////////////////////////////////////////////
	////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
	////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
	$('.thumb').live('click',function(){
		var src = $(this).children().attr('name');
		var id = $(this).children().attr('id').slice(5);
		
		$.get('function/fn.picture.get.info.php',{idPicture:id},function(content){ //Récupère les informations ainsi que la hauteur ou la largeur max 
			$('#'+skins+' .pictureinfo').html(content);

			var media = ' ';
			if (src.slice(-3) == 'flv')
			{
				var loadingcolor = getSkinsColor(skins);
				media = '<object type="application/x-shockwave-flash" data="swf/player.swf" width="500" height="400">';
				media += '<param name="movie" value="swf/player.swf" />';
				media += '<param name="allowFullScreen" value="true" />';
				media += '<param name="FlashVars" value="flv=../'+src+'&amp;width=500&amp;height=400&amp;autoplay=1&amp;loadingcolor='+loadingcolor.slice(1)+'" />';
				media += '</object>';
				$('#'+skins+' .galerie .picture').fadeOut(500, function(){	
					$('#'+skins+' .galerie .picture').html(media).fadeIn(500);
				});
				
			}else{
				$.get('function/fn.picture.get.fix.php',{src:src},function(fix){
				media = '<img src="'+src+'" alt="&nbsp;" '+fix+' /><div class="cache-picture"></div>';
					$('#'+skins+' .galerie .picture').fadeOut(500, function(){			
						$('#'+skins+' .galerie .picture').html(media);
						$('#'+skins+' .galerie .picture img').load( function(){ $('#'+skins+' .galerie .picture').fadeIn(500); });
					});
				});
			}
			activeThumb(skins);		
		});
		$('#'+skins+' .openThumb').removeClass('openThumb');
		$(this).addClass('openThumb');
	});
})
	function getSkinsColor(skins)
	{
		var color = '#000000';
		if (skins == "work"){ color = '#004F56'; }
		if (skins == "graph"){ color = '#922502'; }
		if (skins == "prod"){ color = '#620055'; }
		return color;
	}

	function limitNavThumb(){
		$('#'+skins+' .navpicture .thumb:first').addClass('firstThumb');
	}


	function activeThumb(skins){ 
		var color = getSkinsColor(skins);
		$('#'+skins+' .thumb').parent().css('background','');
		$('#'+skins+' .openThumb').parent().css('background',color);
	}

	function initFirstPicture(skins){
		if ( !$('#'+skins+' .navpicture .firstThumb').hasClass('openThumb') )
		{
			$('#'+skins+' .openThumb').removeClass('openThumb');
			$('#'+skins+' .navpicture .firstThumb').addClass('openThumb');
			activeThumb(skins);
		}
	}
	
	function Manuelswitch(cat)
	{
		skins = cat;
		var obj = '#'+cat;
		//Cache l'objet flash si il est ouvert (car il gere mal les z-index.)
		if ($('.nav.active .picture object').length != 0){ $('.nav.active .picture').html('');}
		//Background des div du menu vertical ( section)
		$('.nav').each( function(){
			$(this).css('background', 'url("skins/'+skins+'/background/'+$(this).attr('id')+'.jpg") top left no-repeat ');
		})
			
		//Affiche le menu cliqué.
		$('.menu').hide();
		$('.menu.'+skins).fadeIn(1000);
		$('.menu.'+skins+' .galerieListe').jScrollPane();
		$('#'+skins+' .navpicture').jScrollPane();
			
		$(obj).animate({ marginLeft: "225px"}, 1200, 'easeOutExpo' , function(){
			if ($(obj).hasClass('last'))
			{
				//Passe le active en dernier
				$(".nav.seconde .cache-color").show();
				$('.active').css('margin-left','1010px').addClass('last').removeClass('active').animate({marginLeft : "960px"},500, function(){$(".nav.seconde .cache-color").hide();});
				//Passe le div cliqué en premier
				$(obj).addClass('active').removeClass('last');
			}else{
				$(".nav.last .cache-color").show();
				$('.last').animate({ marginLeft: "910px"}, 500 , function(){
					$(".nav.last .cache-color").hide();
					//Enleve la classe second au div cliqué
					$('.seconde').addClass('temp').removeClass('seconde');
					//Passe le dernier en second
					$('.last').addClass('seconde').removeClass('last');
					//Passe le active en dernier et lui enleve la class active
					$('.active').hide().css('margin-left','960px').addClass('last');
					$('.last').show();//, function(){ $('.nav.seconde .wrapper').show(); });
					$('.active').removeClass('active');
					//Ajoute la class active au div cliqué.
					$('.temp').addClass('active');
					$('.active').removeClass('temp');
				});
			}
			
			//Activation du premier thumb ////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
			$('#'+skins+' .navpicture .thumb:first').addClass('firstThumb'); 
			initFirstPicture(skins); 			
		});	
	}