// Procédures globales du projet
function PGNJS_CHOIX_DATE(pNomChamp,pAnnee,pMois,pJour,pFonctionOnSelectDate)
{	// Affiche la date dans le champ passé en paramètre et ferme le selecteur de date

	var xChamp = document.getElementById(pNomChamp);
	var xAnnee = pAnnee.toString();
	var xMois = pMois.toString();
	var xJour = pJour.toString();
	var xDateChaine;
	 
	
	if (pMois<10) { xMois = "0"+xMois;}
	if (pJour<10) { xJour = "0"+xJour;}
	
	
	if (xChamp) 
	{	
		xChamp.value = xJour+"/"+xMois+"/"+xAnnee;		
	}
	
	PGNJS_FERMER_SELECTEUR();
	if (pFonctionOnSelectDate && pFonctionOnSelectDate!=""){
		try	{		
			eval(pFonctionOnSelectDate+"();");
		} catch (xException){
			// rien a faire : s'il n'y a pas de procedure à appeler
		}
	}
}

function PGNJS_CONTENU_CALENDRIER(pNomChamp,pAnnee,pMois,pFonctionOnSelectDate)
{	// Renvoie le contenu HTML du calque qui sert de calendrier
	
	var xTabMois=["","Janvier","Fevrier","Mars","Avril","Mai","Juin","Juillet","Aout","Septembre","Octobre","Novembre","Decembre"];
	var xTabJour=["Lun","Mar","Mer","Jeu","Ven","Sam","Dim"];
	var xHTML = "";
	
	var xJour ; 
	var xMois = parseInt(pMois);
	var xAnnee = parseInt(pAnnee);
		
	var xDateDebutMois = new Date(xAnnee,xMois-1,1);
	var xDateFinMois = new Date(xAnnee,xMois,0);
	var xDateFinMoisPrecedent = new Date(xAnnee,xMois-1,0);
	var xNumJourDebutMois = xDateDebutMois.getDay();
	if (xNumJourDebutMois == 0) {xNumJourDebutMois = 7;} // Le dimanche est le 0 en javascript et ici ce sera le n°7
	var xNbJourMois = xDateFinMois.getDate();
	var xNbJourMoisPrecdent = xDateFinMoisPrecedent.getDate();
	var xNbJourAffichesMoisPrecedent  = xNumJourDebutMois -1;
	var xAujourdhui	= new Date();
	
	var xColonne;
	var xLigne;
	//var xNbLignes = parseInt((xNbJourMois+xNbJourAffichesMoisPrecedent)/7,10); // => calcul le nombre de lignes necessaire pour le calendrier
	var xNbLignes = 6;// Toujours 6 lignes c'est mieux
	var xStyle ;	
	
	
		
	xHTML += "<table  style=\"border-spacing:2; border-collapse:separate;  margin-top: 6px; margin-left: 5px;  \" >";

	// --------------- La combo Mois ------------------------------
	xHTML += "<tr>";
	xHTML += "<td  style=\"text-align:right;vertical-align:middle; width:30%;\">";
	xHTML += "<a class=\"Bouton-Precedent-16 \" style=\"float: right;\"  ";
	xHTML += "href=\"javascript:PGNJS_RECHARGE_CALENDRIER('"+pNomChamp+"',"+xAnnee+","+(xMois-1)+",'"+pFonctionOnSelectDate+"')\">&nbsp;</a>";
	xHTML += "</td>";
	xHTML += "<td  style=\"text-align:center;vertical-align:middle; width:80px; \">";
	xHTML += "<select name=\"Mois\"  class=\"calendrier-combo\"  style=\"width:80px; \" ";
	xHTML += " onChange=\"PGNJS_RECHARGE_CALENDRIER('"+pNomChamp+"',"+xAnnee+",parseInt(this.value) ,'"+pFonctionOnSelectDate+"' )\" >";
	for ( var i = 1 ; i <= 12 ; i++)
	{
		xHTML += "<option value=\""+(i)+"\"  ";
		if (i == xMois) {xHTML += " selected=\"selected\" ";}
		xHTML +=" >"+xTabMois[i]+"</option>"
		}
	xHTML += "</select>";
	xHTML += "</td>";
	xHTML += "<td  style=\"text-align:left;vertical-align:middle; width:30%;\">";
	xHTML += "<a class=\"Bouton-Suivant-16 \"  style=\"float: left;\"  ";
	xHTML += "href=\"javascript:PGNJS_RECHARGE_CALENDRIER('"+pNomChamp+"',"+xAnnee+","+(xMois+1)+",'"+pFonctionOnSelectDate+"')\">&nbsp;</a>";
	
	xHTML += "<img  id=IM_FERMER  src=\"/DOMINO_WEB_WEB/Annuler10_i.png\" width=10 height=10 style=\"float: right; margin-right: 6px; \"   border=0  ";
	xHTML += "onClick='PGNJS_FERMER_SELECTEUR();'  onmouseover='this.src=\"/DOMINO_WEB_WEB/Annuler10_a.png\"; '  onmouseout='this.src=\"/DOMINO_WEB_WEB/Annuler10_i.png\"  ;'   >";
	
	
	xHTML += "</td>";
	xHTML += "</tr>";
	
	// --------------- La combo annee ------------------------------
	xHTML += "<tr>";
	xHTML += "<td  style=\"text-align:right; vertical-align:middle; width:30%;\">";
	xHTML += "<a class=\"Bouton-Precedent-16 \" style=\"float: right;\" ";
	xHTML += "href=\"javascript:PGNJS_RECHARGE_CALENDRIER('"+pNomChamp+"',"+(xAnnee-1)+","+xMois+",'"+pFonctionOnSelectDate+"')\">&nbsp;</a>";
	xHTML += "</td>";
	xHTML += "<td   style=\"text-align:center; vertical-align:middle; width:80px; \">";
	xHTML += "<select name=\"Annee\"  class=\"calendrier-combo\" style=\"width:80px; \" ";
	xHTML += " onChange=\"PGNJS_RECHARGE_CALENDRIER('"+pNomChamp+"',parseInt(this.value),"+xMois+",'"+pFonctionOnSelectDate+"')\" >";
	for ( var i = (xAnnee-10) ; i <= (xAnnee+10) ; i++)
	{
		xHTML += "<option style=\"text-align:center;\"  value=\""+(i)+"\"  ";
		if (i == xAnnee) {xHTML += " selected=\"selected\" ";}
		xHTML +=" >"+i+"</option>"
	}
	xHTML += "</select>";
	xHTML += "</td>";
	xHTML += "<td  style=\"text-align:left; vertical-align:middle; width:30%;\">";
	xHTML += "<a class=\"Bouton-Suivant-16 \" style=\"float: left;\" ";
	xHTML += "href=\"javascript:PGNJS_RECHARGE_CALENDRIER('"+pNomChamp+"',"+(xAnnee+1)+","+xMois+",'"+pFonctionOnSelectDate+"')\">&nbsp;</a>";
	xHTML += "</td>";
	xHTML += "</tr>";
	


	// --------------- Le tableau des dates	------------------------------
	xHTML += "<tr>";
	xHTML += "<td colspan=\"3\" style=\"text-align:center; vertical-align:middle; \">";
	
	xHTML += "<table class=\"calendrier\">";
	xHTML += "<tr>";
	// --------------- Les entete jours
	for ( xColonne = 0 ; xColonne < 7 ; xColonne++)
	{
		xHTML += "<td  class=\"entete-jour\"  >";
		xHTML += xTabJour[xColonne];
		xHTML += "</td>";
	}
	xHTML += "</tr>";
	// ---------------Les dates 
	for (xLigne = 0 ; xLigne < xNbLignes ; xLigne++)
	{
		xHTML += "<tr>";	
		for ( xColonne = 0 ; xColonne < 7 ; xColonne++)
		{
		
			xJour = xLigne*7 + xColonne-xNbJourAffichesMoisPrecedent+1;
			
			if (xJour<=0)
			{
				xStyle = "calendrier-jour-autre-mois";
				xJour = xJour + xNbJourMoisPrecdent;
				xMois = parseInt(pMois)-1;
				if (xMois < 1 )
				{
					xMois = 12;
					xAnnee = parseInt(pAnnee) -1 ;
				}else{
					xAnnee = parseInt(pAnnee) ;
				}			
			}else if (xJour > xNbJourMois)
			{
				xStyle = "calendrier-jour-autre-mois";
				xJour = xJour - xNbJourMois;
				xMois = parseInt(pMois)+1;
				
				if (xMois > 12 )
				{
					xMois = 1;
					xAnnee = parseInt(pAnnee) +1 ;
				}else{
					xAnnee = parseInt(pAnnee) ;
				}			
			}else{
				xStyle = "calendrier-jour";
				xMois = parseInt(pMois);
				xAnnee = parseInt(pAnnee);
			}
			
			
			if ( (xAujourdhui.getFullYear() == xAnnee) && (xAujourdhui.getMonth()+1 == xMois) && (xAujourdhui.getDate() == xJour))
			{xStyle = "calendrier-jour-aujourdhui";}
				
			xHTML += "<td  class=\"calendrier-jour\"  >";
			xHTML += "<a  class=\""+xStyle+"\"  href=\"javascript:PGNJS_CHOIX_DATE('"+pNomChamp+"',"+xAnnee+","+xMois+","+xJour+",'"+pFonctionOnSelectDate+"' );\"   >";
			xHTML += xJour;
			xHTML += "</a>";
			xHTML += "</td>";
		}
		xHTML += "</tr>";
	}

	xHTML += "</table >";
	xHTML += "</td>";
	xHTML += "</tr>";
	xHTML += "</table>";
	
	
	
	return xHTML;
}

function PGNJS_FERMER_SELECTEUR()
{
//	var xTableauDIV = document.getElementsByTagName("DIV");
	var xCalque = document.getElementById("Calendrier");	
	
	// Parcours de tous les DIV de la page
//	for(var i = 0; i < xTableauDIV.length; i++) {
		
		// Si le calque correspond à un calque calendrier
//		if ( xTableauDIV[i].id.substring(0,11) == "Calendrier_" ) {
//			xCalque = xTableauDIV[i];
		//	xCalque.style.visibility = "hidden"; // => On n'utilise pas cette methode car il reste une table fantome 
			xCalque.style.display = "none"; // => Cache le calque
			xCalque.style.top = 0; // => On repositionne le calque à (0,0) pour qu'il se repositionne bien si on le réaffiche aprés avoir redimensionner la page
			xCalque.style.left = 0 ;
//		}
//	}
}

function PGNJS_RECHARGE_CALENDRIER(pNomChamp , pAnnee , pMois,pFonctionOnSelectDate)
{
	var xNomCalque = "Calendrier"
	var xCalque;
	var xMois;
	var xAnnee;
	
	
	xCalque = document.getElementById(xNomCalque);	
	if (xCalque) {
	
		if (pMois<=0){
			xMois = 12;
			xAnnee = pAnnee - 1;
		}else if(pMois>12){
			xMois = 1;
			xAnnee = pAnnee +1 ;
		}else{
			xMois = pMois;
			xAnnee = pAnnee ;
		}
	
		xCalque.innerHTML = PGNJS_CONTENU_CALENDRIER(pNomChamp,xAnnee,xMois,pFonctionOnSelectDate);
	}
	
	
}

function PGNJS_SELECTEUR_DATE(pNomChamp,pNomBouton,pFonctionOnSelectDate)
{
	// Cette fonction permet de creer dynamiquement un calque contenant un calendrier pour selectionner une date à coté d'un champ date

	// Déclarations 
	var xChamp = document.getElementById(pNomChamp);
	var xBouton = document.getElementsByName(pNomBouton)[0];
	var xPos ;
	var xPosChampTop;
	var xPosChampLeft;
	var xPosBoutonTop;
	var xPosBoutonLeft;
	var xPosCalqueTop;
	var xPosCalqueLeft;
	var xDim;
	var xLargeurChamp;
	var xHauteurChamp;
	var xLargeurBouton;
	var xHauteurBouton;
	var xDateChamp;
//	var xNomCalque = "Calendrier_"+pNomChamp;
	var xNomCalque = "Calendrier";
	var xCalque;
	var xDate ;
	var xMois ; 
	var xAnnee ;
	var xPositionHauteurMilieu = false;


		//------positionnement----------------
	if (xBouton) // Si le bouton passé en paramètre existe 
	{   
		// On recupère les dimensions et position du bouton pour le posiitonnement du calendrier	
		xPos = PGNJS_GET_POSITION(xBouton)
		xPosBoutonTop = parseInt(xPos[0]);
		xPosBoutonLeft = parseInt(xPos[1]);
		xDim = 	PGNJS_GET_LARGEUR_HAUTEUR(xBouton);
		xLargeurBouton = parseInt(xDim[0]);
		xHauteurBouton = parseInt(xDim[1]);
	}			
			
			
	if(xBouton){ //s'il y a un bouton, on positionne par rapport au bouton
		// Positionnement en hauteur
		if ( (xPosBoutonTop+xHauteurBouton+220) <= PGNJS_NAV_HAUTEUR() ){ 
			// Positionnement En dessous du bouton
			xPosCalqueTop  = xPosBoutonTop+xHauteurBouton; 
		}else if(xPosBoutonTop-220 >= 0)	{
			// Positionnement Au dessus du bouton
			xPosCalqueTop  = xPosBoutonTop-220;
		}else { 
			// Positionnement par dessus le champ
			// le positionnement horizontal sera fait par rapport au bouton car le calque sera peut être par dessus le champ
			xPosCalqueTop  = 0;
			xPositionHauteurMilieu = true;
		}
		
		
		// Positionnement en largeur
		if (!xPositionHauteurMilieu){
			if(xPosBoutonLeft - 190 >= 0 ){ 
				xPosCalqueLeft = xPosBoutonLeft + xLargeurBouton - 190;// à gauche du bouton
			}else if ( (xPosBoutonLeft + 190) <= PGNJS_NAV_LARGEUR() ) 	{
				xPosCalqueLeft = xPosBoutonLeft ;// à droite du bouton
			}else{
				xPosCalqueLeft = 0 ; 
			}						
		}else{
			if ( (xPosBoutonLeft + xLargeurBouton + 190) <= PGNJS_NAV_LARGEUR() ) { 
				xPosCalqueLeft = xPosBoutonLeft + xLargeurBouton;// à droite du bouton
			}else if(xPosBoutonLeft - 190 >= 0 )	{
				xPosCalqueLeft = xPosBoutonLeft - 190;// à gauche du bouton
			}else{
				xPosCalqueLeft = 0 ; 
			}				
		}		
	}else if (xChamp && xChamp.style.visibility != "hidden" ) // Si le champ passé en paramètre existe et s'il est visible
	{   // On recupère les dimensions et position du champ pour le positonnement du calendrier

		//	alert("xChamp.style.visibility = "+xChamp.style.visibility+"\n xChamp.style.display = "+xChamp.style.display);

		xPos = PGNJS_GET_POSITION(xChamp)
		xPosChampTop = parseInt(xPos[0]);
		xPosChampLeft = parseInt(xPos[1]);
		xDim = 	PGNJS_GET_LARGEUR_HAUTEUR(xChamp);
		xLargeurChamp = parseInt(xDim[0]);
		xHauteurChamp = parseInt(xDim[1]);

		// Positionnement en hauteur
		if ( (xPosChampTop+xHauteurChamp+220) <= PGNJS_NAV_HAUTEUR() ){ 
			// Positionnement En dessous du champ
			xPosCalqueTop  = xPosChampTop+xHauteurChamp; 
		}else if(xPosChampTop-220 >= 0)	{
			// Positionnement Au dessus du champ
			xPosCalqueTop  = xPosChampTop-220;
		}else { 
			// Positionnement par dessus le champ
		 	// le positionnement horizontal sera fait par rapport au bouton car le calque sera peut être par dessus le champ
			xPosCalqueTop  = 0;
			xPositionHauteurMilieu = true;
		}
				
		// Positionnement en largeur
		if ( !xPositionHauteurMilieu || !xBouton ) { // Par rapport au champs 
			if ( (xPosChampLeft + 190) <= PGNJS_NAV_LARGEUR() ) { // aligner a gauche du champ
				xPosCalqueLeft = xPosChampLeft;				
			}else{
				xPosCalqueLeft = PGNJS_NAV_LARGEUR() - 190 ; // aligner a droite de la page
			}		
		}else{ // positionnement par rapport au bouton
			if ( (xPosBoutonLeft + xLargeurBouton + 190) <= PGNJS_NAV_LARGEUR() ) { 
				xPosCalqueLeft = xPosBoutonLeft + xLargeurBouton;// à droite du bouton
			}else if(xPosBoutonLeft - 190 >= 0 )	{
				xPosCalqueLeft = xPosBoutonLeft - 190;// à gauche du bouton
			}else{
				xPosCalqueLeft = 0 ; 
			}				
		}
	}else{ // sinon on ne sait pas comment positionner le calque donc 0,0
		xPosCalqueTop  = 0;
		xPosCalqueLeft = 0; 
	}
	//------fin du positionnement----------------
						
	// On recupère la date qui est déjà saisie dans le champ pour que le calendrier affiche cette date
	xDateChamp = xChamp.value;
	if (xDateChamp != "" )
	{
		xMois = parseInt(xDateChamp.split("/")[1],10);
		xAnnee = parseInt(xDateChamp.split("/")[2],10);
	}else // sinon on affiche le mois en cours
	{
		xDate = new Date();
		xMois = xDate.getMonth()+1;
		xAnnee = xDate.getFullYear();		
	}
	
	// Recherche si le calque est deja existant
	xCalque = document.getElementById(xNomCalque);
	
	if ( xCalque ) // Si le calque existe deja
	{
		// Si le calque est visible 
		if (xCalque.style.display == "block") { // s'il est a sa place on le ferme
			if ((parseInt(xCalque.style.top)  == parseInt(xPosCalqueTop))&&(parseInt(xCalque.style.left) == parseInt(xPosCalqueLeft))){
				PGNJS_FERMER_SELECTEUR();
			}else{ // sinon c'est qu'il a été ouvert par un autre bouton avant d'etre fermer, donc on le deplace directement
				xCalque.style.top  = xPosCalqueTop;
				xCalque.style.left = xPosCalqueLeft;
			}
		}else{ // Sinon on l'affiche
			
			// Positionnement 
			xCalque.style.top  = xPosCalqueTop;
			xCalque.style.left = xPosCalqueLeft;
			
			// On le rend visible
			xCalque.style.display = "block";				
		}

	}
	else // si le calque n'existe pas encore on le crée
	{	
		// Création d'un nouveau calque	
		xCalque = document.createElement("DIV");
		xCalque.name = xNomCalque;
		xCalque.id = xNomCalque;
		xCalque.style.position = "absolute" ;
		
		// Style du calque
		//xCalque.style.border = "1px #6E6E6E solid" ;
		//xCalque.style.backgroundColor = "#FFFFFF";
		//xCalque.style.backgroundImage = "url(../fonds_titres/fond_titre_calendrier.png)"; 
		xCalque.className = "calendrier";
		xCalque.style.align = "center";
		xCalque.style.zIndex = 99999;
		xCalque.style.visibility = "visible";
		xCalque.style.display = "block";
		
		// Positionnement 
		xCalque.style.top  = xPosCalqueTop;
		xCalque.style.left = xPosCalqueLeft;
		
		// ajout du calque au document HTML
		document.body.appendChild(xCalque);
	}
	
	xCalque.innerHTML = PGNJS_CONTENU_CALENDRIER(pNomChamp,xAnnee,xMois,pFonctionOnSelectDate);
	
}