// JavaScript Document
/*
	NECESSITE prototype.js, scriptaculous.js, AutoLoad.js, naviguebyk.js, function addLoadEvent(), function addOnResizeEvent()
	
	*	message		: STRING,
	grise			: BOOL, par defaut false
	grise_parent	: STRING, id de popup parent a griser (utile unikement si grise est actif)
	grise_topoffset	: INT, valeur du decalage a apliquer
	width			: INT, par defaut this.nWidthDefault
	height			: INT, par defaut this.nHeightDefault
	class			: STRING, par defaut cf. "class-bt-default"
	icone			: PATH, par defaut 'img/alert-default/question.gif'
	
	animeOpen		: FUNCTION, 
							animation Open 1 sec max => cf. "time anim open"
							ATTENTION, la fonction d'animation doit contenir [ kmzPopup.draw(aParam...) ] cf. "this.draw = function"
	animeClose		: FUNCTION,
							animation Open 1 sec max => cf. "time anim close"
	
	bouton			: TABLE, par defaut bouton ok blanc
						label	: STRING,
						class	: STRING, par defaut style defini cf. class-bt-default
						width	: INT, par defaut 70
						action	: FUNCTION, par defaut kmzAlert.closeAlert();
									- [ kmzAlert.closeAlert() ] est tjs lancer sur le click
	
	ATTENTION :
		- Ne prend pas d'ID, la class les gere toute seule
	
	PRECISIONS POUR LES ANIMATIONS
		Par defaut si il ya une animation, la fonction this.draw s'acheve avec [ $(aParam["id"]).style.display = 'none'; ] 
		car certaines animation le font toutes seules et on voit la popup clignoter (ex. grow)
		DONC si on utilise morp par ex. :
			function morphAlert(aParam){
				kmzAlert.draw(aParam,2,aParam["height"]);
				$(aParam["id"]).style.display='block';
				var nLeft = kmzAlert.getLeftPosition(aParam["width"]);
				$(aParam["id"]).morph("width:"+(aParam["width"]+32)+"px; left:"+nLeft+"px");
			}
		ALORS que si on utilise grow :
			function growAlert(aParam){
				kmzAlert.draw(aParam,aParam["width"],aParam["height"]);
				Effect.Grow(aParam['id']);
			}
	
	//  --
	TESTER : Firefox 3, IE7, IE8, safari 3.2, chrome 2, opera 9.63
	//  --
	
*/

//  ----------------------  //
//  --  CLASS alertByK  --  //
function alertByK(){
//  --  INIT  --  //
	this.version = "0.1a";
	
	this.aAlert          = new Array();
	this.aAlert['alert'] = new Array();
	this.aAlert['param'] = new Array();
	
	this.zIndex          = 12000;// ! verif kmzPopup => par defaut zIndex=1000;
	this.nWidthDefault   = 'auto';
	this.nHeightDefault  = 'auto';
//  --
	this.openAlert = function (aParam){
		if(!aParam){ alert("CLASS alertByK "+this.version); return false;}
		if(!aParam["message"]){  alert("CLASS alertByK : no message"); return false;}
			//  IDs
		if(aParam['id']){aParam['id']="";}
		aParam['id'] = 'alertDiv' + this.aAlert['alert'].length;
		this.aAlert['alert'].push(aParam['id']);
			//-----------
		
			//  DIMENSION
		if(!aParam["width"]){ aParam["width"]=this.nWidthDefault; }
		if(!aParam["height"]){ aParam["height"]=this.nHeightDefault; }
			//-----------
		
			//  STYLE
		if(typeof(aParam["grise"])=='undefined'){aParam["grise"] = false;}
			//-----------
		
			//  ANIMATION
		//...
			//-----------
		
			//  SAVE PARAM
		this.aAlert['param'][aParam["id"]] = aParam;
			//-----------
			
			//  CREATION POPUP
		this.grise(aParam);
		
		if(typeof(aParam["animeOpen"]) == 'function'){
			aParam["animeOpen"](aParam);// "time anim open"
			setTimeout( function(){ kmzAlert.resizeFondGris(); },1200);
		}else{
			this.draw(aParam, aParam["width"], aParam["height"]);
		}
		return true;
	}
//  --
	this.draw = function (aParam, width, height){
		var div=document.createElement('div');
		div.setAttribute("id",aParam["id"]);
		
		document.body.appendChild(div);
		
		$(aParam["id"]).style.display         = 'none';
		$(aParam["id"]).style.position        = 'absolute';
		$(aParam["id"]).style.zIndex          = this.zIndex + this.aAlert['alert'].length;
		
		
		
		if(width=='auto'){
			$(aParam["id"]).style.width      = 'auto';
			if(navigator.userAgent.indexOf("MSIE 7") != -1) {
		//		$(aParam["id"]).style.width      = '500px';		
				
			}
			width=300;
		}else{
			$(aParam["id"]).style.width      = width+'px';
		}
		
		if(height=='auto'){
			$(aParam["id"]).style.height      = 'auto';
			height=100;
		}else{
			$(aParam["id"]).style.height      = height+'px';
		}
		
		//$(aParam["id"]).style.top             = this.getTopPosition(height)+'px';
		//$(aParam["id"]).style.left            = this.getLeftPosition(width)+'px';
		
		$(aParam["id"]).style.overflow        = 'hidden';
		
		if(!aParam['icone']){aParam['icone']='img/alert-default/question.gif';}
		if(!aParam['class']){// class-bt-default
			$(aParam["id"]).style.backgroundColor  = '#FFFFFF';
			$(aParam["id"]).style.backgroundImage  = 'url(img/alert-default/fd_popup.gif)';
			$(aParam["id"]).style.backgroundRepeat = 'repeat-x';
			$(aParam["id"]).style.border           = '1px solid #006699';
			$(aParam["id"]).style.paddingTop       = '15px';
			$(aParam["id"]).style.paddingBottom    = '15px';
			$(aParam["id"]).style.paddingLeft    = '25px';
			$(aParam["id"]).style.paddingRight    = '25px';
			if(aParam["icone"].indexOf("erreur") != -1){
				$(aParam["id"]).style.color = '#BB0000'; 
			}else{
				$(aParam["id"]).style.color = '#000000';
			}
		}else{
			$(aParam["id"]).className = aParam['class'];
		}
		
			//  CONTENT
		//var sBody = '<table cellspacing="0" cellpadding="0" border="0" width="'+aParam["width"]+'"><tr><td>&nbsp;</td><td width="39"><img src="'+aParam['icone']+'" id="'+aParam["id"]+'icone" alt="" /></td><td width="20">&nbsp;</td><td style="text-align:left;" >'+aParam["message"]+'</td><td>&nbsp;</td></tr></table><div style="height:20px"></div>';
	
		//var sBody='<table cellspacing="0" cellpadding="0" border="0" width="'+aParam["width"]+'"><tr><td>&nbsp;</td><td width="'+(parseInt(aParam["width"])-100)+'"><table cellspacing="0" cellpadding="0" border="0" width="'+(parseInt(aParam["width"])-100)+'"><tr><td width="39"><img src="'+aParam['icone']+'" id="'+aParam["id"]+'icone" alt="" /></td><td width="20">&nbsp;</td><td  ><table width="100%" cellspacing="0" cellpadding="0" border="0" ><tr><td width="100%" >&nbsp;</td><td nowrap="nowrap">'+aParam["message"]+'</td></tr></table></td></tr></table><td>&nbsp;</td></tr></table><div style="height:10px"></div>';
		var sBody='<table cellspacing="0" cellpadding="0" border="0" id="'+aParam["id"]+'alertCadre" ><tr><td ><table cellspacing="0" cellpadding="0" border="0" ><tr><td width="39"><img src="'+aParam['icone']+'" id="'+aParam["id"]+'icone" alt="" /></td><td width="20">&nbsp;</td><td  ><table width="100%" cellspacing="0" cellpadding="0" border="0" ><tr><td width="100%" >&nbsp;</td><td nowrap="nowrap"  >'+aParam["message"]+'</td></tr></table></td></tr></table></tr></table><div style="height:10px"></div>';
		
	
			//  BOUTONS
		if(!aParam["bouton"]){
			aParam["bouton"] = new Array();
			var aBtParam = { 'label':'ok', 'class':'boutonblanc', 'action':'' };
			aParam["bouton"].push(aBtParam);
		}
		
		var sBoutons = '<table cellspacing="0" cellpadding="0" border="0" width="100%"><tr><td align="center">';
		for(i=0; i<aParam["bouton"].length; i++){
			if(i>0){ sBoutons += '&nbsp;&nbsp;'; }
			if(!aParam["bouton"][i]['width']){aParam["bouton"][i]['width']=70}
			sBoutons += '<input id="' + aParam["id"] + 'bt' + i + '" type="button" value="' + aParam["bouton"][i]['label'] + '" class="' + aParam["bouton"][i]['class'] + '_off" style="width:'+aParam["bouton"][i]['width']+'px;" onmouseover="this.className=\'' + aParam["bouton"][i]['class'] + '_on\';" onmouseout="this.className=\'' + aParam["bouton"][i]['class'] + '_off\'" /><input id="' + aParam["id"] + 'bt' + i + 'action" type="hidden" value="' + i + '" />';
		}
		sBoutons += '</td></tr></table>';
		
		$(aParam["id"]).innerHTML = sBody + sBoutons;			
		
		
		
			//  ACTION SUR BOUTONS
		for(i=0; i<aParam["bouton"].length; i++){
			if(document.getElementById(aParam["id"]+'bt'+i)){
				
				if( typeof(aParam["bouton"][i]['action']) == 'function'){
					$(aParam["id"]+'bt'+i).onclick = function(){
						var sId = this.id.substring(0,this.id.indexOf("bt"));
						kmzAlert.aAlert['param'][sId]['bouton'][$(this.id+'action').value]['action']();
						kmzAlert.closeAlert();
					}
				}else{
					$(aParam["id"]+'bt'+i).onclick = function(){
						kmzAlert.closeAlert();						
					}
				}
			}
		}
			//  CLASS PNG SUR L'ICONE
		if(document.getElementById(aParam["id"]+'icone')){ if(aParam["icone"].indexOf(".png") != -1){ $(aParam["id"]+'icone').className = 'png'; } }
		
		if(!aParam["animeOpen"]){
			$(aParam["id"]).style.display = 'block';	
			if(navigator.userAgent.indexOf("MSIE 7") != -1 && $(aParam["id"]).style.width=="auto") {	
				var elm=$(aParam["id"]+'alertCadre');
				$(aParam["id"]).style.width=elm.offsetWidth+"px";		
			}
			$(aParam["id"]).style.top             = this.getTopPosition(parseInt($(aParam["id"]).clientHeight))+'px';
			$(aParam["id"]).style.left            = this.getLeftPosition(parseInt($(aParam["id"]).clientWidth))+'px';
		}else{
			$(aParam["id"]).style.top             = this.getTopPosition(parseInt(width))+'px';
			$(aParam["id"]).style.left            = this.getLeftPosition(parseInt(height))+'px';
		}
		
	
	}
//  --
	this.closeAlert = function (){
		var nLekel = this.aAlert['alert'].length-1;
		var aParam = this.aAlert['param'][this.aAlert['alert'][nLekel]];
		if(aParam['animeClose']){
			aParam['animeClose'](aParam);
			setTimeout( function(){ kmzAlert.removeALert(aParam); },1000); // "time anim close"
		}else{
			this.removeALert(aParam);
		}
	}
//  --
	this.removeALert = function(aParam){
		document.body.removeChild($(aParam["id"]));
		this.degrise(aParam);
		this.aAlert['param'][this.aAlert['alert'].length-1]=null;
		this.aAlert['alert'].pop();
	}
//  --
	this.grise = function(aParam){
		
		var div=document.createElement('div');
		div.setAttribute("id",aParam["id"]+"-grise");
		
		if(aParam["grise_parent"] && document.getElementById(aParam["grise_parent"])){
			var sLekel = aParam["grise_parent"];

			if(document.getElementById(sLekel+'hide-only')){sLekel = sLekel+'hide-only';}
			$(sLekel).appendChild(div);
			var nW = parseInt($(sLekel).clientWidth);
			var nH = parseInt($(sLekel).clientHeight);
			
			this.aAlert['param'][aParam["id"]]["remind_parent"] = $(sLekel);
			
			var nTop = 0;
			if(this.aAlert['param'][aParam["id"]]["grise_topoffset"]){ nTop = this.aAlert['param'][aParam["id"]]["grise_topoffset"]; }
		}else{
			document.body.appendChild(div);
			var nW = G_oNav.page_width(); 
			var nH = G_oNav.page_height();
			if(document.documentElement.clientHeight<oBody.scrollHeight){nH = nH + 30;}
			
			this.aAlert['param'][aParam["id"]]["remind_parent"] = document.body;
			this.aAlert['param'][aParam["id"]]["fond-bg"] = true;
			var nTop = 0;
		}
		
		$(aParam["id"]+'-grise').style.top             = nTop+"px";
		$(aParam["id"]+'-grise').style.position        = 'absolute';
		$(aParam["id"]+'-grise').style.width           = nW+"px";
		$(aParam["id"]+'-grise').style.height          = nH+"px";
		$(aParam["id"]+'-grise').style.cursor          = 'not-allowed';
		
		$(aParam["id"]+'-grise').style.zIndex          = this.zIndex + this.aAlert['alert'].length;
		
		if(aParam["grise"]){
			$(aParam["id"]+'-grise').style.display         = 'none';
			$(aParam["id"]+'-grise').style.backgroundColor = '#000000';
			$(aParam["id"]+'-grise').appear({ from:0, to:0.6,duration:1 });
		}else{
			$(aParam["id"]+'-grise').style.display         = 'block';
			var sUserAgent = navigator.userAgent;
			if(sUserAgent.indexOf("MSIE 8") != -1 || sUserAgent.indexOf("MSIE 7") != -1){ // BUG IE7 IE8
				$(aParam["id"]+'-grise').style.display         = 'none';
				$(aParam["id"]+'-grise').style.backgroundColor = '#000000';
				$(aParam["id"]+'-grise').appear({ from:0, to:0,duration:1 });
			}
			if(sUserAgent.indexOf("Opera") != -1){
				//alert('opera');
				$(aParam["id"]+'-grise').style.display         = 'none';
				$(aParam["id"]+'-grise').style.backgroundColor = '#FFFFFF';
				$(aParam["id"]+'-grise').appear({ from:0, to:0.1,duration:1 });
			}
		}
		
	}
//  --	
	this.degrise = function(aParam){
		if(document.getElementById(aParam["id"]+'-grise')){
			if(aParam["grise"]){
				$(aParam["id"]+'-grise').fade({ from:0.6, to:0,duration:1 });
				setTimeout(function(){ aParam["remind_parent"].removeChild($(aParam["id"]+'-grise')); },1000);
			}else{
				aParam["remind_parent"].removeChild($(aParam["id"]+'-grise'));
			}
		}
	}
//  --
	this.resizeFondGris = function(){
		
		if(kmzAlert.aAlert['alert'].length > 0){
			var sId = kmzAlert.aAlert["alert"][0];
			if(kmzAlert.aAlert['param'][sId]["fond-bg"]){
				if(document.getElementById(kmzAlert.aAlert["alert"][0]+'-grise') ){
					var nLargeurNavigateur = G_oNav.page_width(); 
					var nHauteurNavigateur = G_oNav.page_height();
					if(document.documentElement.clientHeight<oBody.scrollHeight){nHauteurNavigateur = nHauteurNavigateur + 30;}
					$(sId+'-grise').style.width=nLargeurNavigateur+"px";
					$(sId+'-grise').style.height=nHauteurNavigateur+"px";
				}
			}
		}
	}
//  --		
	this.getTopPosition = function (nh){
		var pageH = G_oNav.scrollY() ;
		if(typeof(nh)=='undefined'){
			var nTop = this.nTopDefault;
		}else{
			//var nTop = (pageH/2) - nh/2;
			var nTop = pageH + screen.availHeight/2 - nh;
		}
		if(nTop<10){nTop=35;}
		
		return parseInt(nTop);
	}
//  --
	this.getLeftPosition = function (nw){
		var pageW = G_oNav.page_width();
		if(typeof(nw)=='undefined'){
			var nLeft = this.nLeftDefault;
		}else{
			var nLeft = (pageW/2) - nw/2;
		}
		if(nLeft<10){nLeft=35;}
		
		return parseInt(nLeft);
	}
}
//  --  CLASS alertByK  --  //
//  ----------------------  //

//  -------------------------------  //
//  --  DECLARATION DE LA CLASS  --  //
var kmzAlert;
function LoadAlertByK(){ 
	kmzAlert = new alertByK(); 
	//document.onmousemove = mouseMove;
}
addLoadEvent(LoadAlertByK);
//  --  DECLARATION DE LA CLASS  --  //
//  -------------------------------  //
/*
SI BESOIN :
	!! A METTRE AVANT la class
function addLoadEvent(func){
	var oldonload = window.onload;
	if(typeof window.onload != 'function'){
		window.onload = func;
	}else{
		window.onload = function(){ 
			oldonload();
			func();
		}
	}
}
	!! A METTRE APRES la class
function addOnResizeEvent(){
	func = function(){
		//alert('window resize');
		if(typeof(kmzAlert)=='object'){kmzAlert.resizeFondGris();}
		if(typeof(kmzPopup)=='object'){kmzPopup.resizeFondGris();}
	}
	window.onresize = func;
}
addLoadEvent(addOnResizeEvent);

CSS
.popupModule {
	background-color:#FFFFFF;
	background-image:url(img/fd_popup.gif);
	background-repeat:repeat-x;
	border:1px solid #006699;
	padding:20px;
}
.boutonblanc_off {
	background-image:url(img/fd_btblanc_off.gif);
	border:1px solid #999999;
	color:#000000;
	font-family:Verdana,Arial,Helvetica,sans-serif;
	font-size:9px;
	height:21px;
}
.boutonblanc_on {
	background-image:url(img/fd_btblanc_on.gif);
	border:1px solid #999999;
	color:#000000;
	font-family:Verdana,Arial,Helvetica,sans-serif;
	font-size:9px;
	height:21px;
}
*/