var etapeactive = 1;
var maxetapes = 1;

var imageactive = 1;

$(document).ready(function() {
	maxetapes = $("div.etape").length;
	
	$("div.etape").hide();
	$("div.etape:first").show();
	
	$("div#select_etape ul li a:eq(" + (etapeactive-1) + ")").attr("class", "pageselect");
	
	$("div.etape img").hide();
	$("div.etape img").css("border", "4px solid #DFE2CD");
	$("div.etape img:first").show();
	
	for (var i = 0; i < $("div.etape").length; i++) {
		var leTD = $("div.etape:eq(" + i + ") td:first");
		
		var nbimages = $("div.etape:eq(" + i + ") td:first img").length;
		
		leTD.find("p").css("padding", "0").css("margin", "0");
		
		if (nbimages > 1) {
			leTD.append("<div class=\"select_photo\" style=\"padding:10px 0 0 0;\"><p>Photos : </p><ul style=\"padding:0; margin:0;\"></ul></div>");
			
			for (var i2 = 1; i2 <= nbimages; i2++) {
				leTD.find("ul").append("<li><a href=\"#\" class=\"pagenonselect\">" + i2 + "</a></li>");
			}
		}
		
		var leTD = $("div.etape:eq(" + i + ") td:last");
		var location_str = self.document.location + '';
		if (CurrentLg == "fr") {
			leTD.append("<p style=\"float:left;\"><a href=\"#\" class=\"etapeprecedente pagenonselect\">&lsaquo; Étape précédente</a></p>");
			leTD.append("<p style=\"float:right;\"><a href=\"#\" class=\"etapesuivante pagenonselect\">Étape suivante &rsaquo;</a></p>");
		} else {
			leTD.append("<p style=\"float:left;\"><a href=\"#\" class=\"etapeprecedente pagenonselect\">&lsaquo; Previous stage</a></p>");
			leTD.append("<p style=\"float:right;\"><a href=\"#\" class=\"etapesuivante pagenonselect\">Next stage &rsaquo;</a></p>");
		}
	}
	
	// Selection de photos
	$("div.select_photo ul li a:first").attr("class", "pageselect");
	$("div.select_photo ul li a").click(
		function () {
			imageactive = parseInt($(this).html());
			changerImage(imageactive, etapeactive);
			
			return false;
		}
	);
	
	// Selection d'etape
	$(".selecteur_etape a").click(
		function () {
			etapeactive = parseInt($(this).attr("rel"));
			changerEtape(etapeactive);
			
			return false;
		}
	);
	
	$("div#select_etape ul li a:not(:last)").click(
		function () {
			etapeactive = parseInt($(this).html());
			changerEtape(etapeactive);
			
			return false;
		}
	);
	
	// Bouton next
	$("div#select_etape ul li a:last").click(
		function () {
			if (etapeactive+1 <= maxetapes) {
				etapeactive++;
				changerEtape(etapeactive);
			} else {
				etapeactive = maxetapes;
			}
			
			return false;
		}
	);
	
	$("a.etapeprecedente").click(
		function () {
			if (etapeactive-1 >= 1) {
				etapeactive--;
				changerEtape(etapeactive);
			}
			
			return false;
		}
	);
	
	$("a.etapesuivante").click(
		function () {
			if (etapeactive+1 <= maxetapes) {
				etapeactive++;
				changerEtape(etapeactive);
			}
			
			return false;
		}
	);
});

function changerEtape (no) {
	$("div.etape").hide();
	$("div.etape:eq(" + (no -1) + ")").show();
	
	$("div#select_etape ul li a").attr("class", "pagenonselect");
	$("div#select_etape ul li a:eq(" + (no-1) + ")").attr("class", "pageselect");
	
	imageactive = 1;
	
	$("div.etape div.select_photo ul li a").attr("class", "pagenonselect");
	$("div.etape:eq(" + (no -1) + ") div.select_photo ul li a:eq(0)").attr("class", "pageselect");
	
	$("div.etape img").hide();
	$("div.etape:eq(" + (no -1) + ") img:eq(0)").show();
}

function changerImage (no, etape) {
	$("div.etape:eq(" + (etape -1) + ") div.select_photo ul li a").attr("class", "pagenonselect");
	$("div.etape:eq(" + (etape -1) + ") div.select_photo ul li a:eq(" + (no -1) + ")").attr("class", "pageselect");
	$("div.etape:eq(" + (etape -1) + ") img").hide();
	$("div.etape:eq(" + (etape -1) + ") img:eq(" + (no-1) +")").show();
}