var txtAccueil = "Vous trouverez ci-dessus mes dernières réalisations de sites internet.";
$(document).ready(function(){
	
	
	
$("var").each(function(){
	if($(this).html().match(/([^,\s]{2,30})\s?,\s?([^,v]{2,30})\s?,\s?([^,\s]{2,7})/gi)){
		var mail = RegExp.$1 +'@' + RegExp.$2 + '.' + RegExp.$3;
		$(this).html("<a href='MailTo:"+mail+"'>"+mail+"</a>");
	}
});

	
	
	
	
	var ajout = '<div id="bt" class="bt"><div><span>Site</span><br /><span>pr&eacute;c&eacute;dent</span></div></div>';
	
	
	ajout += '<div id="bt2" class="bt"><div><span>Site</span><br /><span>suivant</span></div></div>';
	
	
	ajout += '<div id="bt3" class="bt"><div><span>Retour au</span><br /><span>menu</span></div></div>';
	
	
	ajout += '<div id="fakeLi"></div>';
	

	
	$("#container").prepend(ajout);
	
	var effetG = new transition();
	
	effetG.creerAccueil(txtAccueil);
	
	$("#bt").click(function(){
		var numLI = effetG.nextLi - 1;
		if(numLI < 0) numLI = effetG.liMax - 1;
		effetG.trans(numLI, 4, 1, 1);
		$(this).css("display","none");
		var t = setTimeout("$('#bt').css('display', 'inline').children('div').css('opacity','0');", 1500);
	});
	
	$("#bt2").click(function(){
		var numLI = effetG.nextLi + 1;
		if(numLI > effetG.liMax -1) numLI = 0;
		effetG.trans(numLI, 4, 1, 1);
		$(this).css("display","none");
		var t = setTimeout("$('#bt2').css('display', 'inline').children('div').css('opacity','0');", 1500);
	});
	
	$("#bt3").click(function(){
		$('#bt,#bt2,#bt3').css('display', 'none');
		effetG.retourMenu();
	});
	
	$("#bt, #bt2, #bt3").hover(
	function(){
		$(this).children("div").animate({opacity:1},200);
	},
	function(){
		$(this).children("div").animate({opacity:0},200);
	}
	);
});


function randOrd(){
	return (Math.round(Math.random())-0.5);
}


function transition(){
	this.limit = 0;
	this.myAr = [];
	for(var i = 0 ; i < this.limit  ; i++){
		this.myAr.push(i);
	}
	this.numCol = 0;
	this.numRow = 0;
	this.parall = 0;
	this.nextLi = 0;
	this.liMax = $("#main-diaporama li").size();
	
	
	
	this.creerAccueil = function(txtAccueil){
		thisO = this;
		var n = this.liMax;
		$("#fakeLi").empty();
		var wDiv = Math.floor(800 / n);
		var hDiv = 400;
		//var xOffset = (1  - n) * wDiv;
		xOffset = - wDiv;
		for(var i=0 ; i <n ; i++){
			var img = $("#main-diaporama li:eq("+i+") img:eq(0)").clone();
			$("#fakeLi").append("<div style='width:"+wDiv+"px;height:"+hDiv+"px;'></div>")
			.css('display','block')
			.children("div:last")
			.append(img)
			.children("img:first")
			.css({display:"inline", opacity:1, top:0, left:xOffset, cursor:"pointer"})
			.hover(
				function(){
					$(this).animate({left:0}, 950, "bounceout")
				},
				function(){
					$(this).stop().animate({left:xOffset}, 340, "easein")
				})
			.bind("click", {li: i, thisObjet:thisO}, this.remAccueil );
		}
		$("#fakeLi").append("<p>"+txtAccueil+"</p>");
		
	}
	
	
	
	
	this.remAccueil = function(event){
		thisO = event.data.thisObjet;
		thisO.nextLi = event.data.li;
		$("#fakeLi p").remove(); 
		$("#main-diaporama li:eq("+thisO.nextLi +") ").addClass("visib");
		$("#fakeLi div img").unbind().animate({left:-800}, 400, "easein");
		$("#bt, #bt2, #bt3").css("display","inline").children("div").css("opacity","0");
		$("#main-diaporama li.visib").children("p, span").animate({opacity:1},280);
	}
	
	
	this.retourMenu = function(){
			$("#fakeLi p").remove(); 
			$("#main-diaporama li").removeClass("visib");
			$("#fakeLi div img").unbind().animate({left:-800}, 400, "easein");
			$("#bt, #bt2, #bt3").css("display","none");
			
			this.creerAccueil(txtAccueil);
		}
	
	
	
	this.setFakeLi = function(numCol, numRow){
		$("#fakeLi").empty();
		this.numCol = numCol;
		this.numRow = numRow;
		this.limit = numCol * numRow;
		this.myAr = [];
		for(var i = 0 ; i < this.limit  ; i++){this.myAr.push(i);}
		
		var wDiv = 800 / numCol;
		var hDiv = 400 / numRow;
		for(var i=0 ; i <this.limit ; i++){
			$("#fakeLi").append("<div style='width:"+wDiv+"px;height:"+hDiv+"px;'></div>").css('display','block');
		}
	
	}
	this.trans = function(numLi, numCol, numRow, numActions){
		this.parall = numActions;
		this.setFakeLi(numCol, numRow);
		this.nextLi = numLi;
		var im = $("#main-diaporama li:eq("+numLi+") img");
		var thisO = this;
		$("#fakeLi div").append(im);
		var myLimit = (this.limit < this.parall) ? this.limit : this.parall;
		for(var j = 0  ; j < myLimit; j++){
			this.animCell(j);
		}
	}
	this.animCell = function(i){
		thisO = this;
		var x =i%this.numCol;
		var yOffset = - (400 / this.numRow) * (i -x)/this.numCol;
		var xOffset = -(800 / this.numCol) * x;
		$("#fakeLi div:eq("+ i +" )").css(
			'left',	-(800 / this.numCol) + "px")
			.children("img").css({
			left: (xOffset  +800 / this.numCol) + "px",
			top: yOffset + "px",
			opacity:0,
			display:"block"
			})
			.fadeTo(
			2,1,
			function(){
				$(this).parent().animate({
					left: 0
					}, 
					15 ,
					function(){
					$(this).children("img").animate({left: xOffset}, 110 ,
						function(){
							if(i + thisO.parall < thisO.limit ){
								thisO.animCell(i + thisO.parall);
							}else if(i == thisO.limit - 1){
								thisO.change();
							}
						});
					})
			});
	}
	this.change = function(){
		thisO = this;
		$("#main-diaporama li").filter('.visib').children("p, span").css("opacity","0").end().removeClass( "visib" ).end().filter( ":eq("+thisO.nextLi+")").addClass("visib").end().ready(function(){
			var t =setTimeout('$("#fakeLi").css("display","none").empty();$("#main-diaporama li.visib").children("p, span").animate({opacity:1},280);', 150);
		});
	}
}