/* Routines de gestion de slideshows + Lightbox */

// OnResize -> recalcul du bodymask
addResizeEvent( function() { sd_resize_bodymask() } )	// resize du masque à chaque resize, s'il est actif

// resize des bodymask à l'ouverture et à chaque resize de la fenêtre si le mask est visible
function sd_resize_bodymask() {
	var x=document.getElementById('bodymask')
	if(x) {
		x=x.style
		if(x.display=='block') {
			x.width=0; x.height=0
			var doc=document.compatMode && document.compatMode=="BackCompat" ?
			  document.body : document.documentElement
			var doc1=navigator.userAgent.toLowerCase().indexOf('safari')>-1? document.body : doc	// Forcage obligatoire avec Safari 3 & 4
			x.height=Math.max(doc1.scrollHeight,doc.clientHeight)+'px'								// doc1 : Safari PC, Opera, FF  - doc : IE6
			x.width=document.documentElement.scrollWidth+'px'
		}
	}
	// masque IE6 (pour les select)
//	var x=document.getElementById('sf-bodymaskframe')
//	if(x) {x.style.width=document.documentElement.scrollWidth+'px'; x.style.height=h+'px'; x.style.filter='alpha(opacity=0)' }
}


/* construction du slideShow "params[]" dynamiquement.
params['srcImg'] indique l'emplacement racine des images */
function slideShowInit(params){
	/* récupère le nombre d'image */
	var imgNbr = 0;
	var element = document.getElementById(params['imgId']);
	var imgTab = element.getElementsByTagName("img");
	for (i=0;i<imgTab.length;i++) imgNbr++;

	/* Construction du contenu de la lightbox */
	// 1. conteneur + bouton de fermeture
	var slideStr = "<div style='text-align:right;padding-bottom:10px;'>"+
		"<img id='img_liste_close1' class='img_box_close clickme' src='img/global/bouton-liste.png' width='15' height='15' alt='Fermer' title='Fermer'  onclick='fermer()' onmouseover='this.src=\"img/global/bouton-liste-hover.png\";' onmouseout='this.src=\"img/global/bouton-liste.png\";' style='border:none;'/>"+
		"<img id='img_liste_close_hover1' class='img_box_close' src='img/global/bouton-liste-hover.png' width='15' height='15' alt='Fermer' title='Fermer'  style='border:none;display:none'/>"+
		"</div>"+
		"<div  class='wrappDiapoB'><div class='leftbox'>";

	// 2. photos grand format
	for (i=1;i<=imgNbr;i++) slideStr+=
		  "<img "
		+ (i==1? '' : "class='diapoB' ")
		+ "src='" + params['srcImg'] + "diapoBig/diapo-" + i + ".jpg' width='400' height='267' alt='' id='diapoB-" + i
		+ "' style='border:3px solid #3e3e3e;' />";

	// 3. Médaillons
	slideStr+= "</div>";
	var v=0
	for (i=1;i<=imgNbr;i++) {
		slideStr+=
			  (!v? "<div class='medaillon'>" : '')
			+ "<img style='" + params['thumbsStyle'] + "' class='clickme' src='" + params['srcImg'] + "diapoThumbs/diapo-" + i + ".jpg' "
			+ "width='70' height='47' alt='' onclick='showImgBox(\"diapoB-" +i + "\");'/>"
		v++
		if(v==params['thumbsVnb']) v=0
		slideStr+= v? "<br style='clear:left' />" : '</div>'
	}
	slideStr+= (imgNbr && !v? '</div>' : '')+ '</div></div>'
	
	// mise à jour du contenu et centrage
	document.getElementById(params['idContent']).innerHTML = slideStr;
	var size = screen_center(params['idContent'],false,params['xOffset'],params['yOffset']);
	document.getElementById(params['idContent']).style.width =  (size[0])+'px';
	document.getElementById(params['idContent']).style.height =  size[1]+'px';

	// Arrondi des coins via curvyCorners
	settings = {
		tl: { radius: 25 },
		tr: { radius: 25 },
		bl: { radius: 25 },
		br: { radius: 25 },
		antiAlias: true,
		autoPad: true,
		validTags: ["div"]
	}
	var myBoxObject = new curvyCorners(settings, 'rounded');
	myBoxObject.applyCornersToAll();
}


/* affichage de la lightbox "params" */
function slideShowDisplay(params){
	clearTimeout(slide)		// Arrête le diaporama d'origine

	// cherche la diapo active au moment du clic pour voir la lightBox -> l'affiche dans la lightBox
	var element = document.getElementById(params['imgId']),
	imgTab = element.getElementsByTagName("img"),
	opacity=0, active=1
	for (i=0;i<imgTab.length;i++) {
		var style=getStyle(imgTab[i])
		if(style.opacity>opacity) { opacity=style.opacity; active=i+1 }
	}	
	showImgBox('diapoB-'+active,100)

	// Suite : affichage du masque puis de la lightbox
	displayBodyMask();
	if(nc_nav['which']=='IE') setTimeout("document.getElementById('"+params['idContent']+"').style.display = 'block'",150);
	else setTimeout("x_fade('"+params['idContent']+"','0:100:34')",100)
};


/* affichage du mask */
function displayBodyMask(){
	var z=document.getElementById('bodymask').style,
	h=document.documentElement.scrollHeight													// Safari PC, Opera, FF
	if(document.documentElement.clientHeight>h) h=document.documentElement.clientHeight		// IE6
	if(z) {
		z.width=document.documentElement.scrollWidth+'px';
		z.height=h+'px'
		z.opacity=0.7
		if(nc_nav.which=='IE') z.filter='alpha(opacity=70)'
		document.getElementById('bodymask').style.display='block';
	}
}

/* medaillon */
/* variable diapo remet la première image lorsque l'on ferme + mem diapo-précédente */
var diapo = "diapoB-1";
function showImgBox(thisId,step){
		//alert(thisId);
		if(typeof(step)=='undefined') var step=34
		x_fade(diapo,'100:1:'+step);
		x_fade(thisId,'1:100:'+step);
		diapo = thisId;
}

function fermer(){
	document.getElementById('bodymask').style.display='none'
	if(nc_nav['which']=='IE') setTimeout("document.getElementById('slideBox').style.display='none'",150);
	else setTimeout("x_fade('slideBox','100:0:34')",100)
	setTimeout('slideshow()',1000)		// relance de diaporama d'origine
	x_fade(diapo,'100:1:12');
	x_fade("diapoB-1",'1:100:12');
	return false;
}


function getStyle(_elem) {
  return typeof _elem.currentStyle == 'undefined' ?
  	  document.defaultView.getComputedStyle(_elem, null)	// all others
  	: _elem.currentStyle									// IE
}


// Centrage de l'objet "objID" à l'écran, puis affichage (display:block) pour le rendre visible, si nécessaire et que "show"=true
// S'il est display:none, on lui donne une transparence de 0 et un display block pour pouvoir lire sa taille, avant de le déplacer, puis de lui rendre son display/opacity de départ
// Rattache automatiquement l'objet à la racine du document, afin d'obtenir un centrage correct
// Retourne la largeur et la hauteur du contenu centré
function screen_center(objID,show,xoffset,yoffset) {
	var x=document.getElementById(objID)
	if(x) {
		if(typeof(xoffset)=='undefined') var xoffset=0	// offset x éventuel
		if(typeof(yoffset)=='undefined') var yoffset=0	// offset y éventuel
		if(typeof(show)=='undefined') var show=true		// true -> afficher l'objet après son centrage
		if(x.parentNode.tagName!='BODY') document.body.appendChild(x)	// rattache l'objet à la racine du body
		var n=navigator.userAgent.toLowerCase()
		var doc=document.compatMode && document.compatMode=="BackCompat" ? document.body : document.documentElement
		var doc1=n.indexOf("safari")>-1? document.body : doc			// Forcage obligatoire avec Safari PC
		var w_r=doc.clientWidth			// largeur de la fenêtre
		var w_b=doc.clientHeight		// et sa hauteur
		var w_x=doc1.scrollLeft			// son offset scroll X
		var w_y=doc1.scrollTop			// et Y

		// Lecture de la taille de l'objet à centrer
		var change_display=false
		var style=getStyle(x)
		if(style.display=='none') {
			change_display=true
			if(x.style.position!='absolute') x.style.position='absolute'
			var display=style.display
			var opacity=typeof(x.style.opacity)=='undefined' && style.opacity==1? x.style.opacity : style.opacity		// style.opacity qui est positionné à 1 par défaut
			var filter=typeof(style.filter)=='undefined'? '' : style.filter
			x.style.opacity=0; if(nc_nav.which=='IE') x.filter='alpha(opacity=0)';
			x.style.display='block'
		}
		var b_r=x.offsetWidth		// largeur de l'objet à centrer.
		var b_b=x.offsetHeight		// et sa hauteur
		if(change_display) {
			x.style.display='none'
			x.style.opacity=opacity
			if(nc_nav.which=='IE') x.style.filter=filter
		}
		// Centrage
		
		x.style.left=(w_x+Math.round((w_r-b_r)/2)+xoffset)+'px'
		x.style.top=(w_y+Math.round((w_b-b_b)/2)+yoffset)+'px'
		if(show && x.style.display!='block') setTimeout("document.getElementById('"+objID+"').style.display='block'",100);
		return(new Array(b_r,b_b))
	}

}


