//affiche une image avec l'effet lightbox de slimbox
function montrer_image(image,titre) {
  Lightbox.show(image, titre);
}

//on definit un effet de couleur pour la couleur de fond du div contenu
var effetCouleur = new Fx.Color('contenu', 'background-color');

//fonction qui va afficher les photo
function afficher(prenom) {
  //syntaxe : ajax(quel_fichier, {options})
  //postBody est le parametre envoyé au fichier PHP
	new ajax('../recuperer_photo.php',{postBody:'prenom='+prenom, onComplete: photoFinished, update: 'contenu',method: 'post'}).request();
	//new ajax('download_inserts.php',{postBody:'pdf='+prenom, onComplete: photoFinished, update: 'contenu',method: 'post'}).request();
	//document.getElementById('posts-list').style.display = 'none';
}

function launchpdf(title) {
		new ajax('../download_inserts.php',{postBody:'pdf='+title, onComplete: photoFinished, update: 'contenu',method: 'post'}).request();
}
//fonction appelée à la fin de la requete ajax de la fonction afficher()
function photoFinished(request){
  //on lance un effet de changement couleur lorsque chargement est terminé
  //il est important de bien affecté une valeur de départ au div contenu
  
  effetCouleur.fromColor('#6990B8');
  //alert('chargement photo fini :)');
	//pour les infobulles
	//syntaxe new Tips(quelElement,{options})
	//on place ici la fonction pour l'appliquer quand toutes les images sont chargées
	var myTips = new Tips($ES('a','contenu'), {
      maxTitleChars: 50, //des titres avec une longueur max de 50
      maxOpacity: .85, //un peu de transparence
      className: 'infobulle' //quel classe CSS pour notre petite infobulle
	    });

}

function externalLinks() 
{
	  if (!document.getElementsByTagName) return;
	  var anchors = document.getElementsByTagName("a");
	  for (var i=0; i<anchors.length; i++) {
	    var anchor = anchors[i];
	    if (anchor.getAttribute("href") &&
	      anchor.getAttribute("rel") == "external")
	      anchor.target = "_blank";
	    }
}

function addLoadEvent(func) 
{
	  var oldonload = window.onload;
	  if (typeof window.onload != 'function') {
	    window.onload = func;
	  } else {
	    window.onload = function() {
	      oldonload();
	      func();
	    }
	  }
	}

//pour commencer avec les elements fermés au départ
var stretchers = $$('div.accordeon');
stretchers.each(function(item){
	item.setStyles({'height': '0', 'overflow': 'hidden'});
});

//au chargement de la page , pour eviter certain bug sur safari (mac looser)
window.onload = function(){
		
	var togglers = $$('h4.toggler'); //on met dans la variable togglers tous les div H4 de la page appartenant a la classe toggler. C'est la syntaxe $$ de element de Mootools qui permet cela tr�s facilement
	var bloc = $('featured');
	
	var bgFx = []; //variable pour la gestion des couleurs de fond
	
	togglers.each(function(toggler, i){
		toggler.defaultColor = toggler.getStyle('background-color');
		//fx creation
		bgFx[i] = new Fx.Color(toggler, 'background-color', {wait: false});
	});
	
	bloc.setStyle('margin-left', '290px');
	
	// creation de l'effet accordeon
	//syntaxe : new Fx.Accordion(quel_div_visible, quel_div_a_afficher, {options eventuelles});
	var myAccordion = new Fx.Accordion(togglers, stretchers, { opacity: false, start:false, transition: Fx.Transitions.quadOut,
		
		onActive: function(toggler, i){
			bgFx[i].toColor('#0065b3'); //quand un element est actif
			toggler.getFirst().setStyle('color', '#fff');
		},
	
		onBackground: function(toggler, i){
			bgFx[i].clearTimer(); //quand un element n'est actif
			toggler.setStyle('background-color', toggler.defaultColor);
			toggler.getFirst().setStyle('color', '#222');
		}
	,alwaysHide: true});
	
	//permet de reouvrir directement le bon element 
	//grace � l'url test.html#cat_a_ouvrir
	function checkHash(){
		var found = false;
		$$('h4.toggler a').each(function(link, i){
			if (window.location.hash.test(link.hash)){
				myAccordion.showThisHideOpen(i);
				found = true;
			}
		});
		return found;
	}

	if (!checkHash()) myAccordion.showThisHideOpen(7);

    var img = document.getElementById("neologo");
    img.style.display = "none";
    var r = Raphael("holder", 220, 220);
    
    r.image(img.src, 0, 0, 200, 200);
    r.image(img.src, 0, 200, 210, 20).scale(1, -1).attr({opacity: .6});
    r.rect(125, 220, 150, 90).attr({gradient: "90-#FFF-#F5F4EF", opacity: .6, stroke: '#F5F4EF'});
};

//pour les infobulles
//syntaxe new Tips(quelElement,{options})
//on place ici la fonction pour l'appliquer quand toutes les images sont chargées
var myTips = new Tips($ES('a','contenu'), {
maxTitleChars: 50, //des titres avec une longueur max de 50
maxOpacity: .85, //un peu de transparence
className: 'infobulle' //quelle classe CSS pour notre petite infobulle
});