$('document').ready(function(){

	/*--- menu ---*/
	active = $('#nav li.active');
	$('#nav > li').hover(function(){
		$('#nav li ul').hide();
		$('#nav li').removeClass('active');
		$(this).find('ul').show();
		$(this).addClass('hover');
	},function(){
		$(this).removeClass('hover');
		$('#nav li ul').hide();	
		active.find('ul').show();
		active.addClass('active');
	});

	/*--- liste_item ---*/
	
	$('.item_hover').hide();
	$('.item_description').hide();
	$('.img_item_hover').hide();
	
	$('.liste_item li').hover(function(){
		$(this).find('.item').addClass('item_hover');
		$(this).find('.img_item').hide();
		$(this).find('.img_item_hover').show();
	}, function(){
		$(this).find('.item').removeClass('item_hover');
		$(this).find('.img_item').show();
		$(this).find('.img_item_hover').hide();
	});
	
	box.init();

});

box = {
	
	init : function(){
		$('.liste_item li').click(function(){
			box.description = $(this).find('.item_description').clone();
			box.current = $(".liste_item li").index(this);
			box.length = $('.liste_item li').length;
			box.create();
		});
		
		$(window).resize(box.redim);
		$(window).scroll(box.redim);
	},
	
	create : function(){
		$('#box').remove();
		$('body').prepend('<div id="box_background"></div>');
		$('body').prepend('<div id="box"><div id="box_relative"><div id="box_close"></div><div id="box_prev"></div><div id="box_next"></div></div></div>');
		$('#box').hide();
		box.description.appendTo('#box_relative');
		box.open();
	},
	
	open : function(){
		box.redim();
		$('#box').fadeIn();
		box.description.fadeIn();
		$('#box_close').click(box.close);
		$('#box_background').click(box.close);
		$('#box_next').click(box.next);
		$('#box_prev').click(box.previous);
	},
	
	redim : function(){
		box.largeur = $("#box").width();
		box.hauteur = $("#box").height();
		box.hscreen = box.windowH();
		box.wscreen = box.windowW();
		if((box.scrollY()+(box.hscreen-box.hauteur)/2) < 0){
			box.top = 10
		}else{
			box.top = (box.scrollY()+(box.hscreen-box.hauteur)/2);
		}
		$('#box').css({
							top : box.top,
							left : (box.wscreen-box.largeur)/2
							});
	},
	
	close : function(){
		$('#box').fadeOut(500, function(){
			$('#box').remove();
		});
		$('#box_background').fadeOut(500, function(){
			$('#box_background').remove();
		});
	},
	
	next : function(){
		if(box.current < box.length-1){
			box.current++;
		}else{
			box.current = 0;
		}
		box.change();
	},
	
	previous : function(){
		if(box.current == 0){
			box.current = box.length-1;
		}else{
			box.current--;
		}
		box.change();
	},
	
	change : function(){
		box.description.fadeOut(300, function(){
			box.description.remove();
			box.description = $('.liste_item li').eq(box.current).find('.item_description').clone();
			box.description.appendTo('#box_relative');
			box.description.fadeIn();
		});
	},
	
	windowH : function(){
		if(window.innerHeight){
			return window.innerHeight;
		} 
		else{
			return $(window).height();
		}
	},
	
	windowW : function(){
		if(window.innerWidth){
			return window.innerWidth;
		}else{
			return $(window).width();
		}
	},
	
	scrollY : function() {
		scrOfY = 0;
		if( typeof( window.pageYOffset ) == 'number' ) {
			scrOfY = window.pageYOffset;
		} else if( document.body && ( document.body.scrollTop ) ) {
			scrOfY = document.body.scrollTop;
		} else if( document.documentElement && ( document.documentElement.scrollTop ) ) {
			scrOfY = document.documentElement.scrollTop;
		}
		return scrOfY;
	},

	scrollX : function() {
		scrOfX = 0;
		if( typeof( window.pageXOffset ) == 'number' ) {
			scrOfX = window.pageXOffset;
		} else if( document.body && ( document.body.scrollLeft ) ) {
			scrOfX = document.body.scrollLeft;
		} else if( document.documentElement && ( document.documentElement.scrollLeft ) ) {
			scrOfX = document.documentElement.scrollLeft;
		}
		 return scrOfX;
	}
	
}


/*
<div id="box">
	<div id="box_relative">
		<div id="box_close"></div>
		<div id="box_prev"></div>
		<div id="box_next"></div>
	</div>
</div>
*/