var carrouselAccueil = {

	nbSlide : 0,
	nbCurrent : 1,
	elemCurrent : null,
	elem : null,
	timer : null,

	init : function(elem) {
		this.nbSlide = elem.find(".slide").length;

		elem.append("<div id=\"navigationAccueil\"></div>");
		for(var i = 1; i <= this.nbSlide; i++) {
			elem.find("#navigationAccueil").append("<a id=\"nav" + i + "\"><span class=\"dn\">" + i + "</span></a>");
		}
		
		$('#nav1').attr('href', 'portails-portes-fer-forge.html');
		$('#nav2').attr('href', 'menuiserie-fer-forge.html');
		$('#nav3').attr('href', 'escaliers-rampes-fer-forge.html');
		$('#nav4').attr('href', 'marquises-fer-forge.html');
		$('#nav5').attr('href', 'pergolas-tonnelles-fer-forge.html');
		$('#nav6').attr('href', 'gardes-corps-fer-forge.html');
		$('#nav7').attr('href', 'grilles-de-protections-fer-forge.html');
		
		


		elem.find("#navigationAccueil a").hover(function() {
			carrouselAccueil.gotoSlide($(this).text());
		});
		this.elem = elem;

		elem.find(".slide").hide();

		elem.find(".slide:first").show();
		this.elemCurrent = elem.find(".slide:first");

		this.elem.find("#navigationAccueil a:first").addClass("active");

		carrouselAccueil.play();

		elem.mouseover(carrouselAccueil.stop);
		elem.mouseout(carrouselAccueil.play);
	},
	gotoSlide : function(num) {

		if(num == this.nbCurrent) {
			return false;
		}

		this.elemCurrent.fadeOut();
		this.elem.find("#slide" + num).fadeIn();

		this.elem.find("#navigationAccueil a").removeClass("active");
		this.elem.find("#navigationAccueil a:eq(" + (num - 1) + ")").addClass("active");

		this.nbCurrent = num;
		this.elemCurrent = this.elem.find("#slide" + num);
	},
	next : function() {
		var num = Number(this.nbCurrent) + 1;

		if(num > this.nbSlide) {
			num = 1;
		}

		this.gotoSlide(num);
	},
	prev : function() {
		var num = this.nbCurrent - 1;

		if(num < 1) {
			num = this.nbSlide;
		}

		this.gotoSlide(num);
	},
	stop : function() {
		window.clearInterval(carrouselAccueil.timer);
	},
	play : function() {
		window.clearInterval(carrouselAccueil.timer);
		carrouselAccueil.timer = window.setInterval("carrouselAccueil.next()", 3000);
	}
}

$(function() {
	carrouselAccueil.init($("#carrouselAccueil"));
});

