$(document).ready(function()
{
	var nombreImage = 10;

	// Fix transparence pour IE6 sur les DIV contenants des .PNG en background
	if ( ($.browser.msie) && ($.browser.version == "6.0") )
	{
		DD_belatedPNG.fix('#header');
		DD_belatedPNG.fix('#logo');
		DD_belatedPNG.fix('#zephoto');
		DD_belatedPNG.fix('#girafe');
		DD_belatedPNG.fix('#vegetation');
		DD_belatedPNG.fix('#enteteMenu');
		DD_belatedPNG.fix('#menu');
		DD_belatedPNG.fix('#enteteContent');
		DD_belatedPNG.fix('#contenu');
		DD_belatedPNG.fix('#mapMonde');
		DD_belatedPNG.fix('#miniEarth');
		DD_belatedPNG.fix('#Australie, #Canada, #France, #Kenya');
		DD_belatedPNG.fix('.theme');
		DD_belatedPNG.fix('.erreur_message');
		DD_belatedPNG.fix('#enteteConstruction, #construction');
		DD_belatedPNG.fix('.previewVignette');
	}

	// Detection et Deplacement des boutons d'acces au Back Office de SPIP
	if ( $(".spip-admin-float").html() )
	{
		// modifications des class de la boite et des boutons pour pouvoir les deplacer et les redessiner
		$(".spip-admin-float").addClass("new-spip-admin-float").removeClass("spip-admin-float");
		$(".new-spip-admin-float").prependTo("#mainContener");
		$(".spip-admin-boutons").addClass("new-spip-admin-boutons").removeClass("spip-admin-boutons");
	}
	else
	{
		// Si pas de boutons backOffice SPIP alors on ajoute une div pour aerer l'entete
		$("<div id='boutonsSPIPBackOffice'></div>").prependTo("#mainContener");
	}

	/* Appels pour fixer les events sur les elements */
	tooltip();

	/* jQuery lightBox	*/
	$(".vignette a").lightBox();

	// Desactive le clic droit
	$(document).bind("contextmenu",function(e){ return false; });

	// Bouton debug 960 grid
 	$("<div id='debugBouton'>Debug</div>").appendTo(".new-spip-admin-float");
	$("#debugBouton").css("opacity", 0.5);
	$("#debugBouton").bind("click", function(e){
 		$("#mainContener").css({'background-image':'url(\'squelettes/images/12_col.gif\')'});
		$("#bandeauGauche").css({'border':'1px solid red'});
		$("#content").css({'border':'1px solid red'});
	});
	$("#debugBouton").bind("mouseenter", function(e){ $(this).stop().animate({opacity: 1}, "normal"); });
	$("#debugBouton").bind("mouseleave", function(e){ $(this).stop().animate({opacity: 0.5}, "normal");	});

/*	################################################################################
	banniere Switcher
	################################################################################ */

	// Pour faire defiller les images (On commence toujours par l'image1)
	currentImg = 1;
	delayImg(nombreImage);

/*	################################################################################
	Theme animates
	################################################################################ */

	// Gestion de la transparence sur les thèmes (Porfolio - rubrique=2.html)
	// A - On met tous les themes à 50% d'opacity au chargement de la page
	$(".theme div:first-child").css("opacity", 0.5);
	$(".nomTheme").css("opacity", 0.5);
	// B - On attache des event mouseenter et mouseleave sur .theme qui permet de jouer sur l'opacité de sa sous-div contenant l'image
	$(".theme").bind({
		mouseenter: function(e) {
			$("div", this).stop().animate({opacity: 1}, "normal");
			$(".nomTheme", this).animate({
											height: "toggle"
										}, "normal");
		},
		mouseleave: function (e) {
			$("div", this).stop().animate({opacity: 0.5}, "normal");
			$(".nomTheme", this).animate({
											height: "toggle"
										}, "normal");
		},
		click: function(e) {
			//alert('toto');
		}
	});

/*	################################################################################
	Map Monde
	################################################################################ */
/*
	$("#mapMonde").bind({
		mouseenter: function(e) {
			// on recupere la couleur de la feuille css pour la bordure
			mapBorderColor = $(this).css("border-left-color");
			$(this).css("border", "1px solid #f4f4f4");
		},
		mouseleave: function (e) {
			$(this).css("border", "1px solid "+mapBorderColor);
		},
		click: function(e) {
			if ( parseInt( $(this).css("height") ) < 400 ) {
				$(this).stop().animate({
										height: "409px"
									}, "normal", function(){
										// Affiche pastille Afrique
										$("#Afrique").css("display","block");
										$("#Afrique").css("opacity","0");
										$("#Afrique").stop().animate({opacity: 1}, "slow");
										// Affiche pastille Amerique
										$("#Amerique").css("display","block");
										$("#Amerique").css("opacity","0");
										$("#Amerique").stop().animate({opacity: 1}, "slow");
										// Affiche pastille Asie
										$("#Asie").css("display","block");
										$("#Asie").css("opacity","0");
										$("#Asie").stop().animate({opacity: 1}, "slow");
										// Affiche pastille Europe
										$("#Europe").css("display","block");
										$("#Europe").css("opacity","0");
										$("#Europe").stop().animate({opacity: 1}, "slow");
										// Affiche pastille Oceanie
										$("#Oceanie").css("display","block");
										$("#Oceanie").css("opacity","0");
										$("#Oceanie").stop().animate({opacity: 1}, "slow");
									});
				$("#miniEarth").stop().animate({
										opacity: 0
									}, "normal");
			}
		}
	});
*/

/*	################################################################################
	Hover sur vignette
	################################################################################ */

	$(".vignette img").css("opacity", 0.5);

	$(".vignette img").bind({
			mouseenter: function(e) {
				$(this).stop().animate({opacity: 1}, "normal");

				// on recupere la couleur de la feuille css pour la bordure
				vignetteBorderColor = $(this).css("border-left-color");
				$(this).css("border", "2px solid #FFF");
			},
			mouseleave: function (e) {
				$(this).css("border", "2px solid "+vignetteBorderColor);
				$(this).stop().animate({opacity: 0.5}, "normal");
			}
	});

/*	################################################################################
	Hover sur preview article (rubrique=4.html)
	################################################################################ */

	$(".previewArticle").css("opacity", 0.5);

	if ( $(".previewArticle") )
	{
		$(".previewArticle").bind({
			mouseenter: function(e) {
				$(this).stop().animate({opacity: 1}, "normal");
				$(this).css({
					'background-color': '#cec6b5',
					'border' : '1px solid #FFF'
				});
				$(".previewTexte", this).css({
					'color' : '#FFF'
				});
			},
			mouseleave : function(e) {
				$(this).stop().animate({opacity: 0.5}, "normal");
				$(this).css({
					'background-color': 'inherit',
					'border' : '1px solid transparent'
				});
				$(".previewTexte", this).css({
					'color' : '#BBB'
				});
			}
		});
	}

}); // Fin jQuery document ready

function delayImg(nbImages) {
	setInterval(function() {
		// Tire un nombre au hasard different de celui actuel
		randomImg = Math.floor((nbImages)*Math.random())+1;
		while (currentImg == randomImg) {
			randomImg = Math.floor((nbImages)*Math.random())+1;
		}
		// fade-In fade-Out sur bandeau
		$("#show").animate({
				opacity: 0
			}, 2500, function(){
				currentImg = randomImg;
				$(this).css({'background-image':'url(\'squelettes/images/banniere/image'+randomImg+'.jpg\')'});
				$(this).animate({opacity: 1}, 2500);
			});
		}, 5000);
}

/*	################################################################################
	tooltips
	################################################################################ */

function tooltip(){

	xOffset = 10;
	yOffset = -20;
	widthTip = 150;	/* Largeur des tooltip par defaut. sinon c'est l'attribut REL definissant sa taille	*/

	$(".tooltip").bind("mouseenter", function(e){

		if (this.alt) widthTip = parseInt(this.alt);
		if (this.rel) widthTip = parseInt(this.rel);

		this.widthBody = $("body").width();
		this.coordX = e.pageX;
		this.t = this.title;

		this.title = "";

		construct="<div id='tooltip'>";
			construct+="<div class='toolTitle'>"+ this.t +"</div>";
			/* construct+="<div class='toolContent'> Taille infoBulle = "+ widthTip +"<hr/><br/> blabla"+"</div>"; */
		construct+="</div>";

		$("body").append(construct);

		$("#tooltip")
			.css("font-style", "italic")
			.css("top",(e.pageY - yOffset) + "px")
			.css("left",(e.pageX + xOffset) + "px")
			.css("opacity", "0.85")
			.fadeIn("normal");
	});

	$(".tooltip").bind("mouseleave", function(e){
		this.title = this.t;	// Restaure le title du <a href>
		$("#tooltip").remove();
		/*widthTip = 250;	/* pour les tooltip n'ayant pas de taille predefinie par les balises alt ou rel	*/
	});

	$(".tooltip").bind("mousemove", function(e){

		if ( this.widthBody-e.pageX > ( widthTip + 50 ) ) {
			$("#tooltip")
				.css("top",(e.pageY - yOffset) + "px")
				.css("left",(e.pageX + xOffset) + "px")
				.css("width", widthTip + "px");
		} else {
			$("#tooltip")
				.css("top",(e.pageY - yOffset) + "px")
				.css("left",(e.pageX - ( widthTip + 30 ) + xOffset) + "px")
				.css("width", widthTip + "px");
		}
	});

}

/*	################################################################################
	mapMonde
	################################################################################ */

/* function displayRegion(region){

	$('<div id='+region+'></div>').prependTo("#mapMonde");
	$('#'+region).css("display","block");
	$('#'+region).bind("mouseleave", function(e){
		$(this).remove();
	})
} */