// ==================================================================================== //
//					Boites de dialogues avec YUI										// 
//																						//
//	Bibliohèques à importer :															//
//		/partage/bibliotheques/yui/build/fonts/fonts-min.css							//
//		/partage/bibliotheques/yui/build/button/assets/skins/sam/button.css				//
//		/partage/bibliotheques/yui/build/container/assets/skins/sam/container.css		//		
//		/partage/bibliotheques/yui/build/yahoo-dom-event/yahoo-dom-event.js				//
//		/partage/bibliotheques/yui/build/element/element-beta.js						//
//		/partage/bibliotheques/yui/build/button/button-beta.js							//
//		/partage/bibliotheques/yui/build/container/container.js							//
// ====================================================================================	//


// pour afficher une boite de dialogue paramétrable
//		@param message
//		@parama config : paramétrage de la boite de dialogue
//						 Exple : var myConfig = { message: "Exemple...", header	: "ent tête", buttons: [ { text:"Action 1", handler:myFnAction1, isDefault:true } ] }
var alertMessage0001=null;
function affichMessage (message, config) 
{	
	// ---------- ajouter les nouveaux paramètres ici
	var conf_width 			= (config.width? config.width : "300px");
	var conf_fixedcenter 	= (config.fixedcenter!=null? config.fixedcenter : true);
	var conf_visible 		= (config.visible? config.visible : true);
	var conf_close 			= (config.close? config.close : false);
	var conf_draggable 		= (config.draggable? config.draggable : true); // NB pour deplacer la fenetre passer draggable à true et importer la biblio correspondante
	var conf_modal 			= (config.modal? config.modal : false);	
	var conf_icon 			= (config.icon? config.icon : "");	//YAHOO.widget.SimpleDialog.ICON_ALARM | YAHOO.widget.SimpleDialog.ICON_BLOCK 
																//YAHOO.widget.SimpleDialog.ICON_HELP | YAHOO.widget.SimpleDialog.ICON_INFO
																//YAHOO.widget.SimpleDialog.ICON_TIP | YAHOO.widget.SimpleDialog.ICON_WARN
	// ---------- gestion des boutons
	var conf_buttons 		= (config.buttons? config.buttons : "");	
	// ----------
		
	if (document.getElementById("divMessage") == null) {
    	var divMessage = document.createElement("div");
    	divMessage.id = "divMessage";
    	document.body.appendChild(divMessage);
	}
		
	// création de la boite des dialogue
	alertMessage0001 = new YAHOO.widget.SimpleDialog("alertMessage0001", 
												 { text			: message,
												   width		: conf_width,
												   fixedcenter	: conf_fixedcenter,
												   visible		: conf_visible,
												   close		: conf_close,
												   draggable	: conf_draggable,
												   modal		: conf_modal,
												   icon			: conf_icon,
												   constraintoviewport: true,
												   buttons 		: conf_buttons
												 } );
	
	if (config.header)	alertMessage0001.setHeader(config.header);
	if (config.footer)	alertMessage0001.setFooter(config.footer);
	
	alertMessage0001.render("divMessage");
	alertMessage0001.center();
}

// Boite de dialogue simulant un window.alert
//		@param message
function alertMessage (message) 
{
	var reponseYes = function() {	this.hide();	};
	
	var thisConf = {   width		: "400px",
					   fixedcenter	: true,
					   visible		: true,
					   close		: false,
					   draggable	: true,
					   modal		: true,
					   icon			: YAHOO.widget.SimpleDialog.ICON_WARN,
					   header		: "Information",
					   constraintoviewport: true,																   
					   buttons 		: [ { text:"OK", handler:reponseYes } ]
					};
					
	affichMessage (message, thisConf);
}	


// Boite de dialogue simulant un window.confirm
//		@param message
//		@param fnCallYes : fonction à exécuter si confirmation
//		@param fnCallNo	 : fonction à exécuter si annulation
function confirmMessage (message, fnCallYes, fnCallNo) 
{	
	var reponseYes = function() {	this.hide();	};
	
	var thisConf = {   width		: "450px",
					   fixedcenter	: true,
					   visible		: true,
					   close		: false,
					   draggable	: true,
					   modal		: true,
					   icon			: YAHOO.widget.SimpleDialog.ICON_HELP,
					   header		: "Confirmation",
					   constraintoviewport: true,																   
					   buttons 		: [ { text:"OK", handler:fnCallYes,  isDefault:true }, { text:"Annuler", handler:fnCallNo } ]
					}
					
	affichMessage (message, thisConf);
}


// ==================================
//		Fonctions au format événement pour une utilisation dans un event.addListener
// ==================================
function onAlertMessage(e, obj) {
	alertMessage(obj.message);
}	
	
function onConfirmMessage(e, obj) {
	confirmMessage(obj.message, obj.fnCallYes, obj.fnCallNo);
}

function onAffichMessageConf(e, obj) {
	affichMessage(obj.message, obj);
}
// ==================================
	
	

// ==================================================================================== //
//					Gestion des droits élémentaires avec YUI							// 
//																						//
//	Bibliohèques à importer :															//
//		 partage/bibliotheques/yui/build/yahoo-dom-event/yahoo-dom-event.js				//
// ====================================================================================	//

/*
*	Cette fonction rend actif un objet HTML (bouton, image, zone texte ...) en fonction du paramAuth
*		@param tabIds 		: Identifiant des éléments. Passer une chaine ou un tableau
* 		@param paramAuth 	: true pour activer le composant, false sinon pour le désactiver
*	Exemple :
*			enableOnRules('monBouton1', false) 
*			ou 
*			var ids= ['monImage1', 'monTextBox2']; enableOnRules (ids, true);
*/
function enableOnRules (tabIds, paramAuth) {
	var tabElt = tabIds.toString().split(",");
	for (var i=0; i < tabElt.length; i++) {
		YAHOO.util.Event.onAvailable(tabElt[i], disableEltOnRules, {auth:paramAuth});
	}
}

/*
*	Cette fonction rend visible (ou pas) un objet HTML (bouton, image, zone texte ...) en fonction du paramAuth
*	Pramètres idem que enableOnRules.
*/
function showOnRules (tabIds, paramAuth) {
	var tabElt = tabIds.toString().split(",");
	for (var i=0; i < tabElt.length; i++) {
		YAHOO.util.Event.onAvailable(tabElt[i], showEltOnRules, {auth:paramAuth});
	}
}


function authModifOnRules (tabIds, paramAuth) {
	var tabElt = tabIds.toString().split(",");
	for (var i=0; i < tabElt.length; i++) {
		YAHOO.util.Event.onAvailable(tabElt[i], modifEltOnRules, {auth:paramAuth});
	}
}

// fontion private (NE PAS UTILISER)
function disableEltOnRules(paramAuth) {
	if (paramAuth.auth == false)
		this.disabled = true;
	else
		this.disabled = false;
}
			
// fontion private (NE PAS UTILISER)
function showEltOnRules(paramAuth) {
	if (paramAuth.auth == false)
		this.style.display = 'none';
	else
		this.style.display = '';
}

// fontion private (NE PAS UTILISER)
function modifEltOnRules(paramAuth) {
	if (paramAuth.auth == false)
		this.readOnly = true;
	else
		this.readOnly = false;
}




function addCheckDate (tabIds, msg) {
	var tabElt = tabIds.toString().split(",");
	for (var i=0; i < tabElt.length; i++) {
		param = {id:tabElt[i], message:msg};
		YAHOO.util.Event.addListener(tabElt[i], "blur", onCheckDate, param);
	}
}

// Ajoute une formatage sur la zone lors de la saisie
// 		param tabIds 	= tableau des champs à modifier
//		param direction = "keyup" ou "keydown" pour savoir si l'on exécute le traitement sur le keyUp ou le keyDown
function addKeyEventFormatDate (tabIds, keyEvent, msg) {
	var tabElt = tabIds.toString().split(",");
	for (var i=0; i < tabElt.length; i++) {
		param = {id:tabElt[i], event:keyEvent, message:msg};
		YAHOO.util.Event.addListener(tabElt[i], keyEvent, onFormatDate, param);
	}
}




// ================================================================================	//
// 				GESTION D'AFFICHAGE DE BLOC											//
//	Bibliohèques à importer :														//
//		partage/bibliotheques/yui/build/fonts/fonts-min.css							//
//		partage/bibliotheques/yui/build/container/assets/skins/sam/container.css	//
//		partage/bibliotheques/yui/build/yahoo-dom-event/yahoo-dom-event.js			//
//		partage/bibliotheques/yui/build/container/container.js						//
// ================================================================================	//


/*
* Fonction spécifique pour afficher masquer un bloc
* parmèteres : - Le nom du bloc à afficher ou masquer
*				- Le nom de l'image ou du bouton lançant l'affichage
*				- Le nom de l'image ou du bouton lançant le masquage
* 				- False si le bloc est masqué par défaut, true sinon
*/
function initYui_simpleHideShowModule (moduleName, imgShowName, imgHideName, isShow) 
{
    var tempModule = document.getElementById(moduleName);
    var tempImgShow = document.getElementById(imgShowName);
    var tempImgHide = document.getElementById(imgHideName);
    
    if (isShow==true) tempImgShow.style.display = 'none';
    else tempImgHide.style.display = 'none';
    
    var replaceAndShow = function() {
    	tempModule.style.display = '';
    	tempImgShow.style.display = 'none';
    	tempImgHide.style.display = '';
    };
    
    var replaceAndHide = function() {
    	tempModule.style.display = 'none';
    	tempImgShow.style.display = '';
    	tempImgHide.style.display = 'none';
    };
    
    var hideOrShow = function() {
    	if (tempModule.style.display == 'none') {
	    	tempModule.style.display = '';
	    	tempImgShow.style.display = 'none';
	    	tempImgHide.style.display = '';
    	}
    	else {
    		tempModule.style.display = 'none';
	    	tempImgShow.style.display = '';
	    	tempImgHide.style.display = 'none';
    	}
    };
    		
    var thisModule = new YAHOO.widget.Module(moduleName, { visible:isShow });
    thisModule.render();
    YAHOO.util.Event.addListener(imgShowName, "click", replaceAndShow);
    YAHOO.util.Event.addListener(imgHideName, "click", replaceAndHide);
}

/*
* Fonction spécifique pour afficher masquer un bloc	
* parmèteres : - Le nom du bloc à afficher ou masquer
*				- Le nom de l'image ou du bouton lançant l'affichage
*				- Le nom de l'image ou du bouton lançant le masquage
* 				- False si le bloc est masqué par défaut, true sinon
*/
function initYui_hideShowModule (moduleName, zoneTitreName, imgShowName, imgHideName, isShow) 
{
    var tempModule 		= document.getElementById(moduleName);
    var tempZoneTitre 	= document.getElementById(zoneTitreName);
    var tempImgShow 	= document.getElementById(imgShowName);
    var tempImgHide 	= document.getElementById(imgHideName);
    
    if (isShow==true) tempImgShow.style.display = 'none';
    else tempImgHide.style.display = 'none';
    
    var replaceAndShow = function() {
    	tempModule.style.display = '';
    	tempImgShow.style.display = 'none';
    	tempImgHide.style.display = '';
    };
    
    var replaceAndHide = function() {
    	tempModule.style.display = 'none';
    	tempImgShow.style.display = '';
    	tempImgHide.style.display = 'none';
    };
    
    var hideOrShow = function() {
    	if (tempModule.style.display == 'none') {
	    	tempModule.style.display = '';
	    	tempImgShow.style.display = 'none';
	    	tempImgHide.style.display = '';
    	}
    	else {
    		tempModule.style.display = 'none';
	    	tempImgShow.style.display = '';
	    	tempImgHide.style.display = 'none';
    	}
    };
    		
    var thisModule = new YAHOO.widget.Module(moduleName, { visible:isShow });
    thisModule.render();
    YAHOO.util.Event.addListener(imgShowName, "click", replaceAndShow);
    YAHOO.util.Event.addListener(imgHideName, "click", replaceAndHide);
    YAHOO.util.Event.addListener(zoneTitreName, "click", hideOrShow);
}

function initYui_hideShowModuleTitre (moduleName, zoneTitreName, isShow) 
{
    var tempModule 		= document.getElementById(moduleName);
    var tempZoneTitre 	= document.getElementById(zoneTitreName);
        
    var replaceAndShow = function() {
    	tempModule.style.display = '';
    };
    
    var replaceAndHide = function() {
    	tempModule.style.display = 'none';
    };
    
    var hideOrShow = function() {
    	if (tempModule.style.display == 'none') {
	    	tempModule.style.display = '';
    	}
    	else {
    		tempModule.style.display = 'none';
    	}
    };
    		
    var thisModule = new YAHOO.widget.Module(moduleName, { visible:isShow });
    thisModule.render();
    YAHOO.util.Event.addListener(zoneTitreName, "click", hideOrShow);
}


// ================================================================================	//
// 							UTILISATION DE CALENDAR									//
//	Bibliohèques à importer :														//
//		partage/bibliotheques/yui/build/fonts/fonts-min.css							//
//		partage/bibliotheques/yui/build/container/assets/skins/sam/container.css	//
//		partage/bibliotheques/yui/build/calendar/assets/skins/sam/calendar.css		//
//		partage/bibliotheques/yui/build/yahoo-dom-event/yahoo-dom-event.js			//
//		partage/bibliotheques/yui/build/dragdrop/dragdrop.js						//
//		partage/bibliotheques/yui/build/container/container.js						//
//		partage/bibliotheques/yui/build/calendar/calendar.js						//
// ================================================================================	//

function LPadString(chaine, padCar, taille) {
	while (chaine.length < taille) { chaine = padCar + chaine; }
	return chaine;
}
	
	
/**
// Ajoute sur un champs input des fonctions JS de formattage et de validation
*/
function markAsDate(tabInputs, errorMsg) 
{
	// Ajout par défaut de la verification et de l'aide à la saisie au champs input.
	addCheckDate (tabInputs, errorMsg);
	addKeyEventFormatDate (tabInputs, "keyup", errorMsg);
}


var dialog088 = null;
var calendar088 = null;
var nameInputToMajByCalendar = null;


// > displayCalendar
// >> Cette fonction va être appelée à la suite de l'évènement déclenché par le clic sur une image de calendrier. Elle va alors se charger de 
// configurer l'objet calendrier en place et de l'afficher à l'endroit voulu.
// >>> @param div088 La div unique dans laquelle la boite de dialogue sera affichée.
// >>> @param input088 Le champ input dans lequel la date sélectionnée devra s'inscrire.
// >>> @param img088 L'image sur laquelle l'utilisateur a cliqué et qui a déclenché l'invocation de cette fonction.
// >>> @param config088 Un tableau d'options de configurations pour le calendrier, voir ci-dessous.

// > Tableau d'options pour le calendrier (à définir dans la page jsp).
// >> draggable 		<> true, false
// >> langue 			<> langue pour l'interface du calendrier (EN ou autre) 
// >> title 			<> titre à donner au calendrier
// >> close				<> true, false: croix de fermeture en haut à droite de la boite de dialogue
// >> context			<> tableau de définition du contexte, par défaut: ["show", "tl", "bl"],
// >> width				<> largeur de la fenêtre de dialogue
// >> iframe			<> true, false (par défaut)     
// >> hide_blank_weeks 	<> true, false: cache ou non les semaines vides.

function displayCalendar(div088, input088, img088, config088) 
{
	var dateDelimiter 	= (config088.datedelimiter? config088.datedelimiter : "-");
	var isDraggable 	= (config088.draggable != null ? config088.draggable : false);
	var calMindate 		= (config088.mindate? config088.mindate : "");
	var calMaxdate 		= (config088.maxdate? config088.maxdate : "");
	var showClose 		= (config088.showclose? config088.showclose : true);
	var langue			= (config088.langue? config088.langue : "FR");
	var dialogTitle 	=  (langue == "EN" ? "Calendar" : "Calendrier");
	var errorMsg		= (config088.errorMsg? config088.errorMsg : "");
	
	nameInputToMajByCalendar = input088;
	
	// =====================================================================================
	// INITIALISATION (exécuté qu une fois par page) Object calendrier et la boite de dialog
	if (calendar088 == null || dialog088 == null) 
	{	
		// ----> on complete le conteneur
    	document.getElementById(div088).innerHTML = "<div class='hd'>" + dialogTitle + "</div>"
										 		   + "<div class='bd' style='padding:0;' id='tableau_calendar'><div id='calendar_unique' style='border:none;padding:1em'></div></div>";
	
		// ---------------> création des Objets YUI
	    calendar088 = new YAHOO.widget.Calendar("calendar_unique", { iframe:false, hide_blank_weeks:true });
    	dialog088 = new YAHOO.widget.Dialog(div088, { context:["show", "tl", "bl"], width:"14em", close:true });
    	
		// -------------> maj du calendar vers la textbox -------------
		function handleSelect(type, args, obj) {
			if (nameInputToMajByCalendar != null && document.getElementById(nameInputToMajByCalendar))
			{
				var dates = args[0]; 
				var date = dates[0];
				var year = parseInt(date[0], 10), month = parseInt(date[1], 10), day = parseInt(date[2], 10);
				
				document.getElementById(nameInputToMajByCalendar).value = LPadString(day.toString(), "0", 2)  + dateDelimiter + LPadString(month.toString(), "0", 2) + dateDelimiter + year;
			}
			if (dialog088 != null) 
				dialog088.hide();
		}
		
		calendar088.selectEvent.subscribe(handleSelect, calendar088, true);
		// ----------------------------------------------------------------
		
		// ========= Gestion des configurations ===========
				
		// On entre une date au format francais dd/MM/yyyy et on veut la transformer au format anglophone MM/dd/yyyy.
	    fnDateForMaxOrMin = function (dateString) {
	    	if (dateString != "") {
	    		var tabElt = dateString.split("/");
	    		return (tabElt[1] + "/" + tabElt[0] + "/" + tabElt[2]);
	    	}
	    	else 
	    		return "";
	    }
	    
	    // Dates minimum & maximum
	    if (calMaxdate != "") {
	    	//The maximum selectable date in the current Calendar (MM/dd/yyyy)    	
	    	calendar088.cfg.setProperty("maxdate", fnDateForMaxOrMin(calMaxdate));
	    }
	    if (calMindate != "") {
	    	//The minimum selectable date in the current Calendar (MM/dd/yyyy)
	    	calendar088.cfg.setProperty("mindate", fnDateForMaxOrMin(calMindate));
	    }
	    
	    // -------- Langue ---------
	    // >>> configuration anglaise 
		if (langue == "EN") {		
			calendar088.cfg.setProperty("MDY_DAY_POSITION", 1);   
			calendar088.cfg.setProperty("MDY_MONTH_POSITION", 2);   
			calendar088.cfg.setProperty("MDY_YEAR_POSITION", 3);
			calendar088.cfg.setProperty("MD_DAY_POSITION", 1);   
			calendar088.cfg.setProperty("MD_MONTH_POSITION", 2);
			 
			calendar088.cfg.setProperty("MONTHS_SHORT",   ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]);   
			calendar088.cfg.setProperty("MONTHS_LONG",    ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]);   
			calendar088.cfg.setProperty("WEEKDAYS_1CHAR", ["S", "M", "T", "W", "T", "F", "S"]);   
			calendar088.cfg.setProperty("WEEKDAYS_SHORT", ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"]);   
			calendar088.cfg.setProperty("WEEKDAYS_MEDIUM",["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"]);   
			calendar088.cfg.setProperty("WEEKDAYS_LONG",  ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"]);
		}
		// >>> configuration française (par défaut)
		else {
		    calendar088.cfg.setProperty("MDY_DAY_POSITION", 1);   
			calendar088.cfg.setProperty("MDY_MONTH_POSITION", 2);   
			calendar088.cfg.setProperty("MDY_YEAR_POSITION", 3);
			calendar088.cfg.setProperty("MD_DAY_POSITION", 1);   
			calendar088.cfg.setProperty("MD_MONTH_POSITION", 2);
			 
			calendar088.cfg.setProperty("MONTHS_SHORT",   ["Jan", "Fev", "Mar", "Avr", "Mai", "Jun", "Jui", "Aou", "Sep", "Oct", "Nov", "Dec"]);   
			calendar088.cfg.setProperty("MONTHS_LONG",    ["Janvier", "Février", "Mars", "Avril", "Mai", "Juin", "Juillet", "Aout", "Septembre", "Octobre", "Novembre", "Decembre"]);   
			calendar088.cfg.setProperty("WEEKDAYS_1CHAR", ["D", "L", "M", "M", "J", "V", "S"]);   
			calendar088.cfg.setProperty("WEEKDAYS_SHORT", ["Di", "Lu", "Ma", "Me", "Je", "Ve", "Sa"]);   
			calendar088.cfg.setProperty("WEEKDAYS_MEDIUM",["Dim", "Lun", "Mar", "Mer", "Jeu", "Ven", "Sam"]);   
			calendar088.cfg.setProperty("WEEKDAYS_LONG",  ["Dimanche", "Lundi", "Mardi", "Mercredi", "Jeudi", "Vendredi", "Samedi"]);
		}    
		      
	    calendar088.render();
	    //calendar088.hide();
	    dialog088.render();
		dialog088.hide();
	
				
	    calendar088.renderEvent.subscribe(function() {
	        dialog088.fireEvent("changeContent"); 
	    });
	    
    }
    // FIN INITIALISATION
    // ======================================================================================

	
	// ======================================================================================
	// AFFICHAGE DU CALENDRIER
	
	// ---> objet corespondant à la textBox
	currTextBox = document.getElementById(input088);
	
	// ---> Si date est déjà saisie, on positionne le calendrier à cette date. 
	var aujourdhui = new Date();	
	if (currTextBox.value != "") 
	{
		//currDate = txtDate.value.split(dateDelimiter).join("/"); // pirouette pour mettre le délimiteur de son choix
		var date = currTextBox.value.split(dateDelimiter);					
		var year = parseInt(date[2], 10), month = parseInt(date[1], 10), day = parseInt(date[0], 10);
		if (isNaN(year))
			year = aujourdhui.getYear();
		if (isNaN(month))
			month = aujourdhui.getMonth();
		if (isNaN(day))
			day = aujourdhui.getDay();
		currDateToShow = day + "/" + month + "/" + year;
		
		calendar088.select(currDateToShow);
		var selectedDates = calendar088.getSelectedDates();
		if (selectedDates.length > 0) {
			var firstDate = selectedDates[0];
			calendar088.cfg.setProperty("pagedate", (firstDate.getMonth()+1) + "/" + firstDate.getFullYear());
			calendar088.render();		// pk pas un refresh ?????		
		} 
		//else {
		//	alert("Cannot select a date before 01/01/2006 or after 31/12/2008");
		//}
	}
	//On detecte la taille de l'ecran, si l'image est trop basse, alors on remonte un peu le calendrier
	var x = YAHOO.util.Dom.getXY(img088)[0];
	var y = YAHOO.util.Dom.getXY(img088)[1];
	//IE ?
	if (document.body){
		var larg = (document.body.clientWidth);
		var haut = (document.body.clientHeight);
	}else{
		var larg = (window.innerWidth);
		var haut = (window.innerHeight);
	}
	
	if(y+210 <= haut)
		YAHOO.util.Dom.setXY(div088, YAHOO.util.Dom.getXY(img088));
	else
		YAHOO.util.Dom.setXY(div088, [x,haut-210]);
	dialog088.show();
	larg = null;haut = null;
}


// >> hideCalendar
// >> Fonction appellée pour masquer le calendrier, par exemple quand on switch d'onglet
function hideCalendar(){
	if (dialog088 != null) 
		dialog088.hide();
}



/*
* Fonction pour lier un champs texte à un calendrier
* paramètres : panelName = Nom de la div ou l'on va encrer le calendrier YUI
*				textName	= inputText à relier au calendrier
*				bShowName	= image, ou bouton ou l'inputTexte lui même pour
*							  lancer l'affichage du calendrier
*				config		= paramètres de configuration du calendrier	
*
* Configuration (param config)
* 		dateDelimiter	:	Séparateur de dates 			--> par défaut '/'
*		calMindate		:	Date minimale de sélection		--> par défaut aucune
*		calMaxdate		:	Date maximale de sélection		--> par défaut aucune
*		dialogTitle		:	titre au dessus du calendrier	--> par défaut aucun
*		showClose		:	afficher un bouton fermer		--> par défaut affiché
*		isDraggable		:	rendre le calendar déplaçable
*		langue			: 	langue (config (FR, EN, ...)
*		errorMsg		:	Message d'erreur si valeur saise erronée
*		(nb: il faut que title non vide pour avoir une zone titre à déplacer)	--> par défaut false
* 	Exemple : { datedelimiter:"-", mindate:"01/01/2006", maxdate:"12/12/2008", draggable:false, showclose:true, title:"Sélectionnez une date" }
*/

function linkToYuiCalendar(containerName, textName, bShowName, config)
{		        
	var dialog, calendar, currTextBox;
	      
	// ---------- ajouter les nouveaux paramètres ici
	var dateDelimiter 	= (config.datedelimiter? config.datedelimiter : "-");
	var isDraggable 	= (config.draggable? config.draggable : false);
	var calMindate 		= (config.mindate? config.mindate : "");
	var calMaxdate 		= (config.maxdate? config.maxdate : "");
	var showClose 		= (config.showclose? config.showclose : true);
	var dialogTitle 	= (config.title? config.title : "Calendrier");
	var langue			= (config.langue? config.langue : "FR");
	var errorMsg		= (config.errorMsg? config.errorMsg : "");
	// ----------
	      
    // ----> on complete le conteneur
    document.getElementById(containerName).innerHTML = "<div class='hd'>" + dialogTitle + "</div>"
										 		   + "<div class='bd' style='padding:0;' id='tableau_calendar'><div id='cal_" + textName + "' style='border:none;padding:1em'></div></div>";
	// ---> objet corespondant à la textBox
	currTextBox = document.getElementById(textName);	        
	
	// ---> on ajoute par défaut la verification et l'aide à la saisie au champs input
	addCheckDate (textName, errorMsg);
	addKeyEventFormatDate (textName, "keyup", errorMsg);
	      
	
	// ---> objet calendrier
    calendar = new YAHOO.widget.Calendar("cal_" + textName, {
        iframe:false,          // Turn iframe off, since container has iframe support.
        hide_blank_weeks:true  // Enable, to demonstrate how we handle changing height, using changeContent        
    });
	
	// ---> boite de dialogue
    dialog = new YAHOO.widget.Dialog(containerName, {
        context:["show", "tl", "bl"],
        width:"16em",  // Sam Skin dialog needs to have a width defined (7*2em + 2*1em = 16em).
        draggable:false,
        close:true
    });
	      	        
    // ------> sélection du calendrier vers la textBox -------
    function handleSelect(type, args, obj) {
		var dates = args[0]; 
		var date = dates[0];
		var year = parseInt(date[0], 10), month = parseInt(date[1], 10), day = parseInt(date[2], 10);
		
		currTextBox.value = LPadString(day.toString(), "0", 2)  + dateDelimiter + LPadString(month.toString(), "0", 2) + dateDelimiter + year;
		dialog.hide();
	}
	
	// ------> pour afficher le calendrier. Si date saisie on positionne le calendrier à cette date 
	function showCalendar() {
		var current = new Date();	
		if (currTextBox.value != "") {
			//currDate = txtDate.value.split(dateDelimiter).join("/"); // pirouette pour mettre le délimiteur de son choix
			var date = currTextBox.value.split(dateDelimiter);					
			var year = parseInt(date[2], 10), month = parseInt(date[1], 10), day = parseInt(date[0], 10);
			if (isNaN(year))
				year = current.getYear();
			if (isNaN(month))
				month = current.getMonth();
			if (isNaN(day))
				day = current.getDay();
			currDate = day + "/" + month + "/" + year;
			
			calendar.select(currDate);
			var selectedDates = calendar.getSelectedDates();
			if (selectedDates.length > 0) {
				var firstDate = selectedDates[0];
				calendar.cfg.setProperty("pagedate", (firstDate.getMonth()+1) + "/" + firstDate.getFullYear());
				calendar.render();				
			} 
			//else {
			//	alert("Cannot select a date before 01/01/2006 or after 31/12/2008");
			//}
		}
		calendar.show();
		this.show(); // pour afficher la boite de dialogue contenant le calendrier !!!
	}
	      
    // ========= Gestion des configurations ===========
    
    // on entre une date au format francais dd/MM/yyyy et l'on veut la transformer au format anglophone MM/dd/yyyy
    fnDateForMaxOrMin = function (dateString) {
    	if (dateString != "") {
    		var tabElt = dateString.split("/");
    		return (tabElt[1] + "/" + tabElt[0] + "/" + tabElt[2]);
    	}
    	else 
    		return "";
    }
    
    // -------- min et max date --------
    if (calMaxdate != "") {
    	//The maximum selectable date in the current Calendar (MM/dd/yyyy)    	
    	calendar.cfg.setProperty("maxdate", fnDateForMaxOrMin(calMaxdate));
    }
    if (calMindate != "") {
    	//The minimum selectable date in the current Calendar (MM/dd/yyyy)
    	calendar.cfg.setProperty("mindate", fnDateForMaxOrMin(calMindate));
    }
    
    // -------- Langue ---------
    // >>> configuration anglaise 
	if (langue == "EN") {		
		calendar.cfg.setProperty("MDY_DAY_POSITION", 1);   
		calendar.cfg.setProperty("MDY_MONTH_POSITION", 2);   
		calendar.cfg.setProperty("MDY_YEAR_POSITION", 3);
		calendar.cfg.setProperty("MD_DAY_POSITION", 1);   
		calendar.cfg.setProperty("MD_MONTH_POSITION", 2);
		 
		calendar.cfg.setProperty("MONTHS_SHORT",   ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]);   
		calendar.cfg.setProperty("MONTHS_LONG",    ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]);   
		calendar.cfg.setProperty("WEEKDAYS_1CHAR", ["S", "M", "T", "W", "T", "F", "S"]);   
		calendar.cfg.setProperty("WEEKDAYS_SHORT", ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"]);   
		calendar.cfg.setProperty("WEEKDAYS_MEDIUM",["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"]);   
		calendar.cfg.setProperty("WEEKDAYS_LONG",  ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"]);
	}
	// >>> configuration française (par défaut)
	else {
	    calendar.cfg.setProperty("MDY_DAY_POSITION", 1);   
		calendar.cfg.setProperty("MDY_MONTH_POSITION", 2);   
		calendar.cfg.setProperty("MDY_YEAR_POSITION", 3);
		calendar.cfg.setProperty("MD_DAY_POSITION", 1);   
		calendar.cfg.setProperty("MD_MONTH_POSITION", 2);
		 
		calendar.cfg.setProperty("MONTHS_SHORT",   ["Jan", "Fev", "Mar", "Avr", "Mai", "Jun", "Jui", "Aou", "Sep", "Oct", "Nov", "Dec"]);   
		calendar.cfg.setProperty("MONTHS_LONG",    ["Janvier", "Février", "Mars", "Avril", "Mai", "Juin", "Juillet", "Aout", "Septembre", "Octobre", "Novembre", "Decembre"]);   
		calendar.cfg.setProperty("WEEKDAYS_1CHAR", ["D", "L", "M", "M", "J", "V", "S"]);   
		calendar.cfg.setProperty("WEEKDAYS_SHORT", ["Di", "Lu", "Ma", "Me", "Je", "Ve", "Sa"]);   
		calendar.cfg.setProperty("WEEKDAYS_MEDIUM",["Dim", "Lun", "Mar", "Mer", "Jeu", "Ven", "Sam"]);   
		calendar.cfg.setProperty("WEEKDAYS_LONG",  ["Dimanche", "Lundi", "Mardi", "Mercredi", "Jeudi", "Vendredi", "Samedi"]);
	}
	    
	      
    calendar.render();
    calendar.hide();
    dialog.render();
	dialog.hide();
	
	
	calendar.selectEvent.subscribe(handleSelect, calendar, true);
	
    calendar.renderEvent.subscribe(function() {
        dialog.fireEvent("changeContent"); // Tell Dialog it's contents have changed, Currently used by container for IE6/Safari2 to sync underlay size
    });
	
    YAHOO.util.Event.on(bShowName, "click", showCalendar, dialog, true);
}


// ================================================================================================================================	//
// 					UTILISATION DE LISTES (DATATABLE et DATASOURCE)																	//
//	Bibliohèques à importer :																										//
//		<link rel="stylesheet" type="text/css" href="/partage/bibliotheques/yui/build/fonts/fonts-min.css" />						//
//		<link rel="stylesheet" type="text/css" href="/partage/bibliotheques/yui/build/datatable/assets/skins/sam/datatable.css" />	//
//		<script type="text/javascript" src="/partage/bibliotheques/yui/build/yahoo-dom-event/yahoo-dom-event.js"></script>			//
//		<script type="text/javascript" src="/partage/bibliotheques/yui/build/element/element-beta.js"></script>						//
//		<script type="text/javascript" src="/partage/bibliotheques/yui/build/datasource/datasource-beta.js"></script>				//
//		<script type="text/javascript" src="/partage/bibliotheques/yui/build/datatable/datatable-beta.js"></script>					//
// ================================================================================================================================	//

// --------------------
// Préambule
// --------------------

/* 
	Comment définir et paramétrer les colonnes d'une dataTable ?
   	------------------------------------------------------------
   	
   Il faut passer la définition des colonnes dans un tableau ayant pour syntaxe : var monTabloDeColonne = [ tabloDeCle ];
   Où tabloDeCle se définit comme suit : 
   		{     key:"id du la colonne du tableau JS source", 
   			  label:"Entete de la colonne", 
   			  sortable:true,
   			  sortOptions:{sortFunction:mySortFunction, defaultOrder:"asc"}, // permet de définir une fonction de tri particulière
	   		  // la valeur du "parser" permet de stipuler la nature afin de trier correctement les données
	   		  parser:YAHOO.util.DataSource.parseString	(-->valeur du parseur par défaut) | parser:YAHOO.util.DataSource.parseDate | parser:YAHOO.util.DataSource.parseNumber
	   		  // formattage à l'affichage
	   	  	  formatter:YAHOO.widget.DataTable.formatButton |formatCheckbox|formatCurrency|formatDate|formatDropdown|formatEmail|formatLink
	   	  	  												|formatNumber|formatRadio|formatText|formatTextarea|formatTextbox
	   	  	  // on peut aussi utiliser un formatter maison --> formatter:myCustomFormatter (voir exemple de myCustomFormatter ci dessous)
	   	  	  width:"50px" // taille de la colonne
	   	  	  //... d'autres paramètres, voir doc
   		  }
   		
   	// ----------- Exemple de fonction de formattage spécifique -------------------	
	   	// @param elCell 	--> pour agir sur une cellule de la colonne
	    // @param oRecord <YAHOO.widget.Record> --> contient l'enregistrement entier (ligne) // exple : oRecord.getData("id")
	    // @param oColumn <YAHOO.widget.Column> --> pour accéder aux propriétés de la colonne
	    // @param oData --> valeur de l'enregistrement pour cette colonne	      
	myCustomFormatter = function(elCell, oRecord, oColumn, oData) { 
        elCell.innerHTML = '<a href="#">'+oRecord.getData("id") + oData +'</a>';
    };   
   
   
   // ------------- Exemple de fonction de tri ------------------------------------
   mySortFunction = function(a, b, desc) {
   		// gestion des valeurs vides
       	if(!YAHOO.lang.isValue(a))
           return (!YAHOO.lang.isValue(b)) ? 0 : 1;
       	else if(!YAHOO.lang.isValue(b)) 
           return -1;
       			  
       var compState = YAHOO.util.Sort.compare(a.getData("id"), b.getData("id"), desc);
       return compState;
   }
   
   
   // ------------ exemple de définition de colonne -----------
   var myColumnDefs = [ {key:"id", label:"ID", parser:YAHOO.util.DataSource.parseNumber, sortable:true},
						{key:"nom", label:"Nom Agence", sortable:true, sortOptions:{sortFunction:mySortFunction}, formatter:myCustomFormatter},
						{key:"ville", label:"Ville", sortable:true},
						{label:"Action", formatter:YAHOO.widget.DataTable.formatButton, width:"60px"}
					  ];
   


	Configuration d'une dataTable ?
	-------------------------------
	Extrait de la doc YUI
		paginator - Object literal of pagination values. 
		Default Value: 
			{ containers:[], // UI container elements 
			rowsPerPage:500, // 500 rows 
			currentPage:1, // page one 
			pageLinks:0, // show all links 
			pageLinksStart:1, // first link is page 1 
			dropdownOptions:null, // no dropdown 
			links: [], // links elements 
			dropdowns: [] } //dropdown elements 
	
	
	
	Créer une fonction de tri spécifique ?
	--------------------------------------

	sortNumeric = function(a, b, desc) 
        {
        	// gestion des valeurs vides
            if(!YAHOO.lang.isValue(a)) {
                return (!YAHOO.lang.isValue(b)) ? 0 : 1;
            }
            else if(!YAHOO.lang.isValue(b)) {
                return -1;
            }			            
            var comp = YAHOO.util.Sort.compare;
            var compState = comp(a.getData("id")+1-1, b.getData("id")+1-1, desc);
            return compState;
        }
*/

// ----------------------
// Listes en mode client
// ----------------------

/**
*	Cette fonction permet de créer une liste triables et paginable en mode client à partir d'un tableu de données JS
*	@param htmlContainer : id du conteneur Html qui contiendra la liste générée
*	@param jsArray 		 : Nom du tableau de données JS source
*	@param jsColumnDefs	 : Définition et paramétrage des colonnes (voir : "Comment définir et paramétrer les colonnes d'une dataTable ?")
*	@param config		 : Paramètres de configuration (voir : "Configuration d'une dataTable ?")
*/
function buildYuiDataTable(htmlContainer, jsArray, jsColumnDefs, config) 
{
	// construction du dataSource
	var myDataSource = new YAHOO.util.DataSource(jsArray);
    myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSARRAY;
    myDataSource.responseSchema = { fields: jsColumnDefs };

	// construction du dataTable
    var myDataTable = new YAHOO.widget.DataTable(htmlContainer, jsColumnDefs, myDataSource, config);
    return myDataTable;
}


/**
*	Plus complète que buildYuiDataTable
*	Elle permet en plus de gérer un dtableau de datasource plus complet
*	@param htmlContainer 	  : id du conteneur Html qui contiendra la liste générée
*	@param jsArray 		 	  : Nom du tableau de données JS source
*	@param jsColumnDataSource : Définition des colonnes formant le datasource. exemple : var columnSource = [ "id", "libelle", "perim" ];
*	@param jsColumnDataTable  : Définition et paramétrage des colonnes (voir : "Comment définir et paramétrer les colonnes d'une dataTable ?")
*	@param config		 	  : Paramètres de configuration (voir : "Configuration d'une dataTable ?")
*/
function buildYuiDataSourceAndTable(htmlContainer, jsArray, jsColumnDataSource, jsColumnDataTable, config) 
{
	// construction du dataSource
	var myDataSource = new YAHOO.util.DataSource(jsArray);
    myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSARRAY;
    myDataSource.responseSchema = { fields: jsColumnDataSource };

	// construction du dataTable
    var myDataTable = new YAHOO.widget.DataTable(htmlContainer, jsColumnDataTable, myDataSource, config);
    return myDataTable;
}





// ------------------------------------
// Création d'un color picker
// ------------------------------------

// ================================================================================================================================	//
// 
//	Bibliohèques à importer :	ATTENTION VERSION 2.5.0 minimum																									//
//	<link rel="stylesheet" type="text/css" href="/partage/bibliotheques/yui/yui_2.5.0/build/fonts/fonts-min.css" />
//	<link rel="stylesheet" type="text/css" href="/partage/bibliotheques/yui/yui_2.5.0/build/container/assets/skins/sam/container.css" />
//	<link rel="stylesheet" type="text/css" href="/partage/bibliotheques/yui/yui_2.5.0/build/colorpicker/assets/skins/sam/colorpicker.css" />
//	<script type="text/javascript" src="/partage/bibliotheques/yui/yui_2.5.0/build/utilities/utilities.js"></script>
//	<script type="text/javascript" src="/partage/bibliotheques/yui/yui_2.5.0/build/container/container-min.js"></script>
//	<script type="text/javascript" src="/partage/bibliotheques/yui/yui_2.5.0/build/slider/slider-min.js"></script>
//	<script type="text/javascript" src="/partage/bibliotheques/yui/yui_2.5.0/build/colorpicker/colorpicker-min.js"></script>


/* paramètres :
		mycontainer = conteneur ou sera généré la palette
		btnShow		= bouton (ou objet) pour afficher la palette lors d'un click
		fncallback  = fonction de retour à exécuter àpres sélection de la couleur
		config		= {btnValiderText:"Valider", btnCancelText:"Annuler", imgPicker:"<%=request.getContextPath()%>/jsp_v2/images/pickcolor/select.gif", imgHue:"<%=request.getContextPath()%>/jsp_v2/images/pickcolor/hline.png" }
*/
function makeColorPickerDialog(mycontainer, btnShow, fncallback, config) {

	document.getElementById(mycontainer).innerHTML = "<div id='yui-picker-panel' class='yui-picker-panel'>"
													+ "<div class='hd'></div>"
													+ "<div class='bd'><div id='yui-picker'></div></div>"
													+ "</div>";

	var mydialog = null;
	var mypicker = null;            
	function fnChangeColor() { this.hide(); if (fncallback!="") fncallback(document.getElementById(mypicker.ID.HEX).value); }
    function fnCancelColor() { this.cancel(); }
            
    // Instantiate the Dialog
    mydialog = new YAHOO.widget.Dialog("yui-picker-panel", { 
						width : "400px", close: true, fixedcenter : true, modal:true,
						visible : false, constraintoviewport : true,
						buttons : [ { text:config.btnValiderText, handler:fnChangeColor, isDefault:true },
									{ text:config.btnCancelText, handler:fnCancelColor } ]
         			});
 
	// Once the Dialog renders, we want to create our Color Picker instance.
    mydialog.renderEvent.subscribe(function() {
		if (mypicker == null) { //make sure that we haven't already created our Color Picker
			mypicker = new YAHOO.widget.ColorPicker("yui-picker", {
				container: mydialog, 
				images: {
					PICKER_THUMB: config.imgPicker,
					HUE_THUMB: config.imgHue
				},
				//Here are some other configurations we could use for our Picker:
				showcontrols: false,  // default is true, false hides the entire set of controls
				showhexcontrols: true, // default is false
				showhsvcontrols: true,  // default is false
				showwebsafe : false
			});

			//listen to rgbChange to be notified about new values
			mypicker.on("rgbChange", function(o) {
				//YAHOO.log(YAHOO.lang.dump(o), "info", "example");
			});
		}
	});	
			
    mydialog.render();
    
    YAHOO.util.Event.on(btnShow, "click", mydialog.show, mydialog, true);

} // fin makeColorPickerDialog



// ----------------------
// Selecteur des heures
// ----------------------

/**
// ================================================================================================================================	//
// 
//	Bibliohèques à importer :																										//
//		<link rel="stylesheet" type="text/css" href="/partage/bibliotheques/yui/build/fonts/fonts-min.css" />
//		<link rel="stylesheet" type="text/css" href="/partage/bibliotheques/yui/build/autocomplete/assets/skins/sam/autocomplete.css" />

//		<script type="text/javascript" src="/partage/js/divers.js"></script>

//		<script type="text/javascript" src="/partage/bibliotheques/yui/build/yahoo-dom-event/yahoo-dom-event.js"></script>
//		<script type="text/javascript" src="/partage/bibliotheques/yui/build/animation/animation.js"></script>
//		<script type="text/javascript" src="/partage/bibliotheques/yui/build/autocomplete/autocomplete.js"></script>
//
// à rajouter dans le code :
=> STYLE 
	<style type="text/css">
	// custom styles for scrolling container
	#autocomplete
	 {
	    width:15em; // set width of widget here
	    height:12em; // define height for container to appear inline
	}
	
	#container  {
	    max-height:11em;overflow:auto;overflow-x:hidden; // scrolling
	    _height:11em; // ie6 
	}
	</style>



=> CORPS DE LA PAGE OU DOIT APPARAITRE LA ZONE DES HEURES
	<div id="autocomplete">
		<input id="input" type="text">
	<div id="container"></div>
	
	où 	autocomplete doit etre le même que celui dans le style 
		input doit être le nom de l'input passé également en paramètre de la fonction (selectHours(input, container, emptyMessage)
		container doit être le nom du container passé également en paramètre de la fonction (selectHours(input, container, emptyMessage)
		
=> APRES LES DIVS
	<script type="text/javascript">
	
	//initialisation du selecteur des heures
	selectHours("input","container", "<%=jspbiens.getLibelle("AUCUN_ELEMENT_DISPONIBLE")%>");
	</script>
		
// ================================================================================================================================	//

*	Cette fonction permet d'afficher une "liste déroulante" pour les heures
*	@param input 		: l'id de l'input concerné 
*	@param container  	: l'id de la div contenant la liste
*	@param emptyMessage	: le message à afficher si l'utilisateur ne saisie pas une heure comprise dans la liste (permet de gérer le multilangue)

*/
function selectHours(input, container, emptyMessage) {
	//on recupére la liste des heures
    this.oACDS = new YAHOO.widget.DS_JSArray(hoursArray);
    this.oACDS.maxCacheEntries = 10;

    // Instantiate AutoComplete
    this.oAutoComp = new YAHOO.widget.AutoComplete(input,container, this.oACDS);
    this.oAutoComp.alwaysShowContainer = false; //force à garder l'affichage de la liste 
    this.oAutoComp.maxResultsDisplayed = 10; //nombre max de résultats 
    this.oAutoComp.prehighlightClassName = "yui-ac-prehighlight";
    this.oAutoComp.typeAhead = false;//complete automatique la saisie si vrai
    this.oAutoComp.useShadow = true;//ombre
    this.oAutoComp.minQueryLength = 1;//nombre de caractère à entrer avant de dérouler la liste
    this.oAutoComp.forceSelection = true;  //oblige l'utilisateur à saisir une valeur => zone à vide si pas de choix
	this.oAutoComp.allowBrowserAutocomplete = false; //desactive l'autocomplete du navigateur   
	this.oAutoComp.queryDelay = 0; //delai avant d'excuter la requete
	this.oAutoComp.animSpeed = 0; //delai annimation du déroulement de la liste
	//this.oAutoComp._bItemSelected = this.oAutoComp._elTextbox.value!=''; // Pour loader une valeur par défaut en edit par exemple
	//affichage du résultat (permet de mettre en forme 
    this.oAutoComp.formatResult = function(oResultItem, sQuery) {
        var sMarkup = oResultItem[0] ;
        return (sMarkup);
    };

    // Message à afficher si pas de résultats correspondants
    this.myOnDataReturn = function(sType, aArgs) {
        var oAutoComp = aArgs[0];
        var sQuery = aArgs[1];
        var aResults = aArgs[2];

        if(aResults.length == 0) {
        	
            oAutoComp.setBody("<div id=\"containerdefault\">" + emptyMessage + "</div>");
        }
    };
	this.oAutoComp.dataReturnEvent.subscribe(this.myOnDataReturn);

    // Preload content in the container
    this.oAutoComp.sendQuery("");
    return this.oAutoComp;
};



//DEBUT liste des heures
var hoursArray = [
    "00:00",
	"00:15",
	"00:30",
	"00:45",
	"01:00",
	"01:15",
	"01:30",
	"01:45",
	"02:00",
	"02:15",
	"02:30",
	"02:45",
	"03:00",
	"03:15",
	"03:30",
	"03:45",
	"04:00",
	"04:15",
	"04:30",
	"04:45",
	"05:00",
	"05:15",
	"05:30",
	"05:45",
	"06:00",
	"06:15",
	"06:30",
	"06:45",
	"07:00",
	"07:15",
	"07:30",
	"07:45",
	"08:00",
	"08:15",
	"08:30",
	"08:45",
	"09:00",
	"09:15",
	"09:30",
	"09:45",
	"10:00",
	"10:15",
	"10:30",
	"10:45",
	"11:00",
	"11:15",
	"11:30",
	"11:45",
	"12:00",
	"12:15",
	"12:30",
	"12:45",
	"13:00",
	"13:15",
	"13:30",
	"13:45",
	"14:00",
	"14:15",
	"14:30",
	"14:45",
	"15:00",
	"15:15",
	"15:30",
	"15:45",
	"16:00",
	"16:15",
	"16:30",
	"16:45",
	"17:00",
	"17:15",
	"17:30",
	"17:45",
	"18:00",
	"18:15",
	"18:30",
	"18:45",
	"19:00",
	"19:15",
	"19:30",
	"19:45",
	"20:00",
	"20:15",
	"20:30",
	"20:45",
	"21:00",
	"21:15",
	"21:30",
	"21:45",
	"22:00",
	"22:15",
	"22:30",
	"22:45",
	"23:00",
	"23:15",
	"23:30",
	"23:45"

		   
	    
];
//FIN liste des heures

//------------------------------------------------------------------------------
// Selecteur CP donne la liste des villes
//------------------------------------------------------------------------------
//cpinput = id de l'input du code postal
//villeinput = id de l'input de la ville
//villecontainer = id de la div dans laquelle la liste va s'afficher la ville
//cpcontainer = id de la div dans laquelle la liste des CPs va s'afficher
//divCP = id de la div englobant cpinput et cpcontainer
//divVille = id de la div englobant villeinput et villecontainer
//url = url de la page a ajaxer
//callback = fonction à lancer lorsque la méthode se termine
function linkCPAndTown(cpinput,villeinput,villecontainer,cpcontainer,divCp,divVille,url,callback){

	//autocomplete cp -> ville
    this.oACDS_zipcode = new YAHOO.widget.DS_XHR(url, [";"]);
    this.oACDS_zipcode.responseType = YAHOO.widget.DS_XHR.TYPE_FLAT;
    this.oACDS_zipcode.maxCacheEntries = 60;
    this.oACDS_zipcode.queryMatchSubset = true;
    this.oACDS_zipcode.scriptQueryAppend = "fieldType=zipcode";
    
	var oConfigs_zipcode = {
    		prehighlightClassName: "yui-ac-prehighlight",
            queryDelay: 0,
            minQueryLength: 4
    }
    var myoAutoComp_zipcode = new YAHOO.widget.AutoComplete(cpinput,cpcontainer, this.oACDS_zipcode, oConfigs_zipcode);
    myoAutoComp_zipcode.maxResultsDisplayed = 50;

    //autocomplete ville -> cp
    this.oACDS_city = new YAHOO.widget.DS_XHR(url, [";"]);
    this.oACDS_city.responseType = YAHOO.widget.DS_XHR.TYPE_FLAT;
    this.oACDS_city.maxCacheEntries = 60;
    this.oACDS_city.queryMatchSubset = true;
    this.oACDS_city.scriptQueryAppend = "fieldType=city";
    
    var oConfigs_city = {
    		prehighlightClassName: "yui-ac-prehighlight",
            queryDelay: 0,
            minQueryLength: 2          
    }
    var myoAutoComp_city = new YAHOO.widget.AutoComplete(villeinput,villecontainer, this.oACDS_city, oConfigs_city);
    myoAutoComp_city.maxResultsDisplayed = 20;
    
    // --- on ajoute la propriété useIFrame afin que l'autocomplete passe au dessus des "select" si besoin
    myoAutoComp_zipcode.useIFrame = true;
    myoAutoComp_city.useIFrame = true;
    
    
    var cp = "";
    var ville = "";
/*
	 itemSelectEvent
itemSelectEvent ( oSelf , elItem , oData )
Fired when an item is selected via mouse click, ENTER key, or TAB key.

Parameters:
    oSelf <YAHOO.widget.AutoComplete> The AutoComplete instance. 
    elItem <HTMLElement> The selected <li> element item. 
    oData <Object> The data returned for the item, either as an object, or mapped from the schema into an array. 


*/

	var tmp_value = "";
	//Qd on selectionne le CP
	var fnCP = function ( oSelf , elItem , oData ){
		$(cpinput).value = elItem[2];
		$(villeinput).value = tmp_value;
		tmp_value = "";
    
	    // lancement de la fonction callback (si une fonction callback a été passée en paramètre)
	    if (callback != null) {
	    	callback();
	    }
	}
	//Qd on selectionne la ville
	var fnVille = function ( oSelf , elItem , oData ){
		$(villeinput).value = elItem[2];
		$(cpinput).value = tmp_value;
		tmp_value = "";
    
	    // lancement de la fonction callback (si une fonction callback a été passée en paramètre)
	    if (callback != null) {
	    	callback();
	    }
	}
	var setTmpValueCP = function(oSelf){
		tmp_value = $(cpinput).value;
	}
	
	var setTmpValueVille = function(oSelf){
		tmp_value = $(villeinput).value;
	}
	myoAutoComp_city.itemSelectEvent.subscribe(fnCP);
	myoAutoComp_zipcode.itemSelectEvent.subscribe(fnVille);
	myoAutoComp_city.containerExpandEvent.subscribe(setTmpValueVille);
	myoAutoComp_zipcode.containerExpandEvent.subscribe(setTmpValueCP);
	
	//desactive la class pour utiliser hideShowErrors 
	$(villeinput).className = "";
	$(cpinput).className="";
	
}
// ----------------------
// Listes en mode serveur
// ----------------------

// ...
// en construction ...
 
/**
 * Construit une boite dialogue Yui à partir des données passées en paramètres.
 * 
 * @param divName
 *            le nom de la div dont on extirpe le contenu.
 * @param headerTitle
 *            le titre souhaité pour la boite de dialogue.
 * @param divWidth
 *            la largeur souhaitée pour la div.
 * @return l'objet correspondant a la div.
 */
function buildYuiDiv(divName, headerTitle, divWidth) {
	var myPanel = new YAHOO.widget.Panel("myPanel", {
		width : divWidth + "px",
		visible : true,
		fixedcenter : true,
		draggable : false,
		close : true,
		modal : true
	});
	myPanel.setHeader(headerTitle);
	myPanel.setBody(document.getElementById(divName).innerHTML);
	myPanel.render(document.body);
	return myPanel;
}

/**
 * Lance la boite de dialogue de chargement.
 * 
 * @param headerTitle
 *            le titre souhaité pour la boite de dialogue.
 * @param bodyImage
 *            l'image de chargement à mettre dans le body.
 * @return l'objet correspondant.
 */
function buildLoadingBox(headerTitle, bodyImage) {
	var myPanel = new YAHOO.widget.Panel("myPanel", {
		width : "300px",
		visible : true,
		fixedcenter : true,
		draggable : false,
		close : false,
		modal : false
	});
	myPanel.setHeader(headerTitle);
	myPanel.setBody('<img src="' + bodyImage + '"/>');
	myPanel.render(document.body);
	return myPanel;
}
