// JavaScript Document
//script mon alert 
//affiche une boite de dialogue de type alert() avec fond semi-transparent et contenir tt le HTML qu on le veut.
var divBox;
var divFond;

var largeur = 0, hauteur = 0;
if( typeof( window.innerWidth ) == 'number' ) {
  largeur = window.innerWidth;
  hauteur = window.innerHeight;
  }
else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
  largeur = document.documentElement.clientWidth;
  hauteur = document.documentElement.clientHeight;
  }
else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
  largeur = document.body.clientWidth;
  hauteur = document.body.clientHeight;
  }
else {
  largeur = -1;
  hauteur = -1;
  }

function Navigateur(){
  if (navigator.appName.indexOf("Netscape") > -1) {return "Netscape";}
  if (navigator.appName.indexOf("Explorer") > -1) {return "Explorer";}
  return "Unknown";}
  
var Nav = Navigateur();

// creation du div fond
//document.write("<div id='fond'></div> tres vieille methode
//document.getElementsByTagName('body')[0].innetHTML +=' <div id='fond'></div>' plus recent

//methode nouvelle : creation d un nouveau noeud (node) avec DOM
divFond = document.createElement("div");
divFond.style.position = "absolute";
divFond.style.top = "0";
divFond.style.left = "0";
divFond.style.backgroundColor = "#E3CFD1";
if (Nav != "Explorer")
	divFond.style.width = ( largeur - 16 ) + "px";
else
	divFond.style.width = largeur + "px";
divFond.style.height = hauteur + "px";
divFond.style.opacity = 0.5;// 0 : transparent, 1: opaque
divFond.style.filter = "Alpha(opacity=50)"; // transparance IE : 100 :opaque.
divFond.style.visibility = "hidden";
//divFond.style.zIndex = "50";

//attache ce div fond au document directement sous la balise balise 
var bodyNode = document.getElementsByTagName('body')[0];
//bodyNode.appendChild(divFond);
bodyNode.insertBefore(divFond,bodyNode.childNodes[0]);

// creation de la boite de dialogue divBox 
// qui contient un titre h1 et un contenu p
divBox = document.createElement("div");
divBox.style.position = "absolute";
//divBox.style.left = "100px";
divBox.style.top = "50px";
//divBox.style.backgroundColor = "#666666";
divBox.style.border = "solid #BF838A 5px";
//divBox.style.textAlign = "center"
//divBox.style.fontFamily = "Verdana";
//divBox.style.backgroundImage = "url('01grand.jpg')";
divBox.style.visibility = "hidden"; // au debut, le divBox est masque
bodyNode.appendChild(divBox);

// titre h1
var h1Box = document.createElement("h1");
h1Box.style.backgroundColor = "#999999";
h1Box.style.margin = "0px";
//h1Box.innerHTML = "Titre par défaut";
h1Box.style.fontSize = "16pt";
divBox.appendChild(h1Box); // accroche l'element H1 dans l'element DIV

// contenu p
var pBox = document.createElement("p");
pBox.style.margin = "0px";
pBox.style.padding = "10px";
divBox.appendChild(pBox); // accroche l'element p dans l'element DIV

// bouton OK
//var okButton = document.createElement("button");
//okButton.innerHTML = "OK";
//okButton.style.width = "50px";
//okButton.style.margin = "10px";
//divBox.appendChild(okButton);

var divCentre = document.createElement("div");
divCentre.style.position = "relative";
divCentre.style.width = "500px";
//divCentre.style.textAlign = "left";
divCentre.style.margin = "auto";
divCentre.style.zIndex = "52";

//divCentre.style.border = "1px solid red";

divCentre.appendChild(divBox);
bodyNode.insertBefore(divCentre,bodyNode.childNodes[1]);

// masquage des deux divs 
function Affiche_photo(image,w,h) {
	//okButton.fonctionRappel = fonctionRappel;
/*	if(titre)
		h1Box.innerHTML = titre;
	else
		h1Box.innerHTML = document.title;
		//document.getElementByTagName("title")[0].innerHTML
	pBox.innerHTML = texte;*/

	divFond.style.zIndex = "50";
	divBox.style.zIndex = "51";
	divCentre.style.zIndex = "52";
	divBox.style.backgroundImage = "url('images/content/"+ image + "grand.jpg')";
	divCentre.style.width = parseInt(w) + "px";
	divBox.style.width = parseInt(w) + "px";
	divBox.style.height = parseInt(h) + "px";
	divFond.style.visibility = "visible";
	divBox.style.visibility = "visible";
}

function fermeBox () {
	
	divFond.style.visibility = "hidden";
	divBox.style.visibility = "hidden";	
	//okButton.fonctionRappel();
}

divFond.onclick = fermeBox;
divBox.onclick = fermeBox;