﻿/************************************************* MyComboBox *************************************************/
var MyComboBox_Instances_Array = new Array();

function MyComboBox()
{
	this.Container=null;
	var oThis = this;//We save the reference to the current MyComboBox instance	

	this.width = 200; //default width
	this.getWidth = function() { return this.width; }
	this.setWidth = function(w) { this.width = w; this.contentWidth = w; }
	this.headerTextfontSize = "10px";
	
	// Objet de détection de navigateur
	this.browserDetect = new BrowserDetect();
	
	// Méthode et propriété déterminant si le ContentContainer doit être en position: relative
	this.forceRelative = true;
	this.setForceRelative = function (bool) {
	this.forceRelative = bool;
	}
	
	this.setHeaderTextfontSize = function(size)
	{	
		if(!isNaN(size))
		{
			cssSize = size.toString()+"px";
			this.headerTextfontSize = cssSize;
		}
		else
			this.headerTextfontSize = "10px";
	}
	
	this.marginRight = "0px";
	this.setMarginRight = function(size)
	{	
		if(!isNaN(size))
		{
			cssSize = size.toString()+"px";
			this.marginRight = cssSize;
		}
		else
			this.marginRight = "0px";
	}
	
	this.marginTop = "2px";
	this.setMarginTop = function(size)
	{	
		if(!isNaN(size))
		{
			cssSize = size.toString()+"px";
			this.marginTop = cssSize;
		}
		else
			this.marginTop = "2px";
	}
	
	this.marginLeft = "5px";
	this.setMarginLeft = function(size)
	{	
		if(!isNaN(size))
		{
			cssSize = size.toString()+"px";
			this.marginLeft = cssSize;
		}
		else
			this.marginLeft = "5px";
	}
	
	this.contentWidth = this.width; //default to size of parent
	this.contentHeight = 120; //default height
	this.checkedBoxesNumber=0;
	this.selectedCriteriaMessage = " critère(s) sélectionné(s)";
	this.familyName="MyComboBox_";
	this.numericId=0;
	this.setNumericId = function()
	{
		//var documentDIVS = document.getElementsByTagName("DIV");
		var documentDIVS = $("div");
		
		var familyElementsCounter = 0;
		for(var i in documentDIVS)
		{
			if((documentDIVS[i].id) && (documentDIVS[i].id.indexOf(this.familyName+"Header") > -1))
				familyElementsCounter++;
		}
		this.numericId = familyElementsCounter;
	}

	this.itemsData = null; 

	this.setItemsData = function (dataArray)
	{
		this.itemsData = dataArray;
	}
	
	this.defaultHeaderText = "";
	
	this.setDefaultHeaderText = function(mode)
	{	if(mode=="NORMAL")
		{
			if((this.itemsData) && (this.itemsData.length > 0))
				this.defaultHeaderText = "Sélectionnez jusqu'à "+this.itemsData.length+" critères";
			else
				this.defaultHeaderText = "Aucun critère à afficher";
		}
		else
			this.defaultHeaderText = "";
	}

	this.HeaderText = "";
	this.setHeaderText = function(newText) {
		this.HeaderText = newText;
		if (this.ComboHeaderTextContainer)
			this.ComboHeaderTextContainer.innerHTML = this.HeaderText;
	}

	this.addCssClear = function(aContainer) {
		var myBr = document.createElement("br");
		myBr.style.clear = "both";
		myBr.style.cssFloat = "none";
		myBr.style.styleFloat = "none";
		myBr.id = this.familyName+this.numericId+"_Br";
		aContainer.appendChild(myBr);
	}

		
	this.fillComboBox = function()
	{	
		for(var counter in this.itemsData)
		{
			myData = this.itemsData[counter];
			this.addComboItem(myData[0],myData[1],myData[2],counter);
			if(counter<(this.itemsData.length-1))
			this.addCssClear(this.ItemsContainer);
		}
	}

	this.addComboFooter = function()
	{
		this.ComboFooter=document.createElement("div");
		//this.ComboFooter.setAttribute(SetBrowser(), "ComboFooter");
		$(this.ComboFooter).addClass("ComboFooter");
		this.ComboFooter.id=this.familyName+this.numericId+"_Footer";
		this.ComboFooterCloseItem = document.createElement("div");
		//this.ComboFooterCloseItem.setAttribute(SetBrowser(), "ComboFooterCloseItem");
		$(this.ComboFooterCloseItem).addClass("ComboFooterCloseItem");
		this.ComboFooterCloseItem.id=this.familyName+this.numericId+"_FooterCloseItem";
		this.ComboFooterCloseItemText="Fermer";
		this.ComboFooterCloseItem.innerHTML = this.ComboFooterCloseItemText;
		this.ComboFooter.appendChild(this.ComboFooterCloseItem);
		this.ContentContainer.appendChild(this.ComboFooter);
	}


	this.uncheckBoxes = function()
	{
		//checkboxesArray=oThis.ItemsContainer.getElementsByTagName("input");
		checkboxesArray=$("input",oThis.ItemsContainer);
		
			if(checkboxesArray)
			{
				for(var i in checkboxesArray)
				checkboxesArray[i].checked=false;
				oThis.checkedBoxesNumber=0;
				oThis.setHeaderText(oThis.defaultHeaderText);
			}
	}

	this.addDefaultComboItem = function(name,itemText)
	{
		this.ItemsContainer = document.createElement("div");
		//this.ItemsContainer.setAttribute(SetBrowser(), "ComboItemsContainer");
		$(this.ItemsContainer).addClass("ComboItemsContainer");
		this.ItemsContainer.style.overflowX = "hidden";
		this.ItemsContainer.style.overflowY = "scroll";
		this.ItemsContainer.id=this.familyName+this.numericId+"_ItemsContainer";
		this.defaultComboItem = document.createElement("div");
		//this.defaultComboItem.setAttribute(SetBrowser(), "CombodefaultComboItem");
		$(this.defaultComboItem).addClass("CombodefaultComboItem");
		this.defaultComboItem.setAttribute("name",name);
		this.defaultComboItem.setAttribute("title",itemText)
		this.defaultComboItem.id=this.familyName+this.numericId+"_DefaultItem";
		this.defaultComboItem.innerHTML = itemText;
		this.defaultComboItem.onclick = function() {
			oThis.uncheckBoxes();}
		this.ItemsContainer.appendChild(this.defaultComboItem);
	}

	this.countCheckedBoxes = function()
	{
		var aCounter=0;
		//checkboxesArray=oThis.ItemsContainer.getElementsByTagName("input");
		checkboxesArray=$("input",oThis.ItemsContainer);
		
			if(checkboxesArray)
			{
				for(i in checkboxesArray)
				{
					if(checkboxesArray[i].checked)
					aCounter++;
				}
			}
		return aCounter;
	}

	this.addComboItem = function(checkboxName,checkboxValue,itemText,itemPosition)
	{
		var newComboItem = document.createElement("div");
		//newComboItem.style.width = (this.contentWidth - 40) + "px";//"187px";
		newComboItem.style.width = this.contentWidth + "px";//"187px";
		//newComboItem.setAttribute(SetBrowser(), "newComboItem");
		$(newComboItem).addClass("newComboItem");
		newComboItem.id=this.familyName+this.numericId+"_Item_"+itemPosition;
		
		var newCheckbox = document.createElement("input");
		//newCheckbox.setAttribute(SetBrowser(), "newCheckbox");
		$(newCheckbox).addClass("newCheckbox");
		newCheckbox.setAttribute("type","checkbox");
		newCheckbox.setAttribute("name",checkboxName);
		newCheckbox.setAttribute("value",checkboxValue);
		newCheckbox.id=this.familyName+this.numericId+"_Checkbox_"+itemPosition;
		newCheckbox.onclick = function(oEvent) {
		oEvent = oEvent || window.event;
        oTarget = oEvent.target || oEvent.srcElement;
			if(oTarget.checked){oThis.checkedBoxesNumber++;}
			else{oThis.checkedBoxesNumber--;}
			if(oThis.checkedBoxesNumber==0)
			{oThis.setHeaderText(oThis.defaultHeaderText);}
			else{oThis.setHeaderText(oThis.checkedBoxesNumber+oThis.selectedCriteriaMessage);}
			}
			
		var newItemTextContainer = document.createElement("div");
		newItemTextContainer.setAttribute("title",itemText);
		//newItemTextContainer.setAttribute(SetBrowser(), "newItemTextContainer");
		$(newItemTextContainer).addClass("newItemTextContainer");
		newItemTextContainer.style.textDecoration = "none";
		newItemTextContainer.innerHTML = itemText;
		newItemTextContainer.id=this.familyName+this.numericId+"_ItemTextContainer";

		newComboItem.appendChild(newCheckbox);
		newComboItem.appendChild(newItemTextContainer);

		this.ItemsContainer.appendChild(newComboItem);
	}

	this.addToContainer = function (Container)
	{
		this.Container = Container;
		if (typeof this.Container == "string")
		{
			//document.getElementById(this.Container).appendChild(this.ComboHeader);
			$("#"+this.Container).append(this.ComboHeader);
			//document.getElementById(this.Container).appendChild(this.ContentContainer);
			$("#"+this.Container).append(this.ContentContainer);
		}
		else
		{
			this.Container.appendChild(this.ComboHeader);
			this.Container.appendChild(this.ContentContainer);
		}
	}

	this.addToMyComboBox_Instances_Array = function()
	{
		 MyComboBox_Instances_Array.push(this);
	}
	
	this.init = function()
	{	
	    // Objet de détection de navigateur
	    this.browserDetect.init();
		this.setNumericId();
		this.addToMyComboBox_Instances_Array();
		this.ComboHeader = document.createElement("div");
		//this.ComboHeader.setAttribute(SetBrowser(), "ComboHeader");
		$(this.ComboHeader).addClass("ComboHeader");
		this.ComboHeader.id = this.familyName+this.numericId+"_"+this.familyName+"Header";
		// Create Header Text Container
		this.ComboHeaderTextContainer = document.createElement("div");
		//this.ComboHeaderTextContainer.setAttribute(SetBrowser(), "ComboHeaderTextContainer");
		$(this.ComboHeaderTextContainer).addClass("ComboHeaderTextContainer");
		this.ComboHeaderTextContainer.id = this.familyName+this.numericId+"_HeaderTextContainer";
		// Create Button Container
		this.ComboButtonContainer = document.createElement("div");
		//this.ComboButtonContainer.setAttribute(SetBrowser(), "ComboButtonContainer");
		$(this.ComboButtonContainer).addClass("ComboButtonContainer");
		this.ComboButtonContainer.id=this.familyName+this.numericId+"_ButtonContainer";
		// Create Button
		this.ComboButton = document.createElement("img");
		this.ComboButton.alt = this.HeaderText;
		this.ComboButton.id = this.familyName+this.numericId+"_Button";
		this.ComboButton.src = globals.server+"anyimages/Controls/normal.gif";
		// Create ContentContenair
		this.ContentContainer = document.createElement("div");
		//this.ContentContainer.setAttribute(SetBrowser(), "ContentContainer");
		$(this.ContentContainer).addClass("ContentContainer");
		this.ContentContainer.style.display = "none";
		this.ContentContainer.id = this.familyName+this.numericId+"_ContentContainer";
		// On force la position a "relative" si le navigateur est Firefox en version 2 pour corriger un bug de z-index
        if ( (this.forceRelative) && (this.browserDetect.browser == 'Firefox' &&  this.browserDetect.version == '2') ) {
            this.ContentContainer.style.position = "relative";
        }

		this.ComboButtonContainer.appendChild(this.ComboButton);
		this.ComboHeader.appendChild(this.ComboButtonContainer);
		this.ComboHeader.appendChild(this.ComboHeaderTextContainer);
		this.addCssClear(this.ComboHeader);
		this.addDefaultComboItem("indiff","-- Indifférent --");
		this.fillComboBox();
		this.ContentContainer.appendChild(this.ItemsContainer);
		this.addComboFooter();
		this.setHeaderText(this.defaultHeaderText);
		document.body.appendChild(this.ComboHeader);
		document.body.appendChild(this.ContentContainer);
		this.ComboHeader.style.zIndex = 13000;

		// Adding Events
		this.ComboButton.onmouseover = this.OverMyCombo;
		this.ComboButton.onmouseout = this.OutMyCombo;
		this.ComboButton.onmousedown = this.PressedMyCombo;
		this.ComboButton.onclick = this.ClickedMyCombo;
		this.ComboHeader.onmouseover = this.OverMyCombo;
		this.ComboHeader.onmouseout = this.OutMyCombo;
		this.ComboHeader.onclick = this.OpenOrClose;
		this.ComboHeaderTextContainer.onmouseover = this.OverMyCombo;
		this.ComboHeaderTextContainer.onmouseout = this.OutMyCombo;
		this.ComboHeaderTextContainer.onclick = this.OpenOrClose;
		this.ComboFooterCloseItem.onclick = this.OpenOrClose;
		document.onclick = MyClickHandler;
	}

	this.contentVisible = function() { return this.ContentContainer.style.display == "none" ? false : true; }
	this.showContent = function() { /*this.RepositionContainer();*/ this.ContentContainer.style.display = "block"; 
	//This part solves a bug on IE
	var countedCheckedBoxesNumber = oThis.countCheckedBoxes();
	if(oThis.checkedBoxesNumber != countedCheckedBoxesNumber)
	{
		oThis.checkedBoxesNumber = 0;
		oThis.uncheckBoxes();
	}
    }

	this.hideContent = function() { this.ContentContainer.style.display = "none"; }

	this.OverMyCombo = function (oEvent)
	{
		oThis.ComboButton.src = globals.server+"anyimages/Controls/over.gif";
	}

	this.OutMyCombo = function (oEvent)
	{
		oThis.ComboButton.src = globals.server+"anyimages/Controls/normal.gif";
	}

	this.PressedMyCombo = function (oEvent)
	{
		oThis.ComboButton.src = globals.server+"anyimages/Controls/pressed.gif";
	}

	this.ClickedMyCombo = function (oEvent)
	{
		oThis.ComboButton.src = globals.server+"anyimages/Controls/over.gif";
		oThis.OpenOrClose(oEvent);
	}

	this.MyClickHandler = function (oEvent)	{	
	oEvent = oEvent || window.event;
    oTarget = oEvent.target || oEvent.srcElement;
	for(var i in MyComboBox_Instances_Array)
	{
		var aCombo = MyComboBox_Instances_Array[i];
		if (!((oTarget.id) && (oTarget.id.indexOf(aCombo.familyName+aCombo.numericId) > -1)))
		aCombo.hideContent();
    }
    }


	this.OpenOrClose = function(oEvent)
	{
		oEvent = oEvent || window.event;
		MyClickHandler(oEvent);
		
		if (document.all)
		{	
			window.event.cancelBubble = true;
		} else
			oEvent.stopPropagation();

		if (oThis.contentVisible())
		{
			oThis.hideContent();
		}
		else 
			oThis.showContent();
	}
}


function comboToString()
{
	for(var i in MyComboBox_Instances_Array)
	{
		var aCombo = MyComboBox_Instances_Array[i];
		//checkboxesArray=aCombo.ItemsContainer.getElementsByTagName("input");
		checkboxesArray = $("input",aCombo.ItemsContainer);
		
		if(checkboxesArray)
		{
			var filterKey="f_"+checkboxesArray[0].name;
			var checkedBoxesArray = new Array();
			var filterValue="";//Pas de sélection
						
			for(var i in checkboxesArray)
			{
				if(checkboxesArray[i].checked)
					checkedBoxesArray.push(checkboxesArray[i].value);
			}

			if(checkedBoxesArray.length > 0)
				filterValue = checkedBoxesArray.join(',');
				
			globals[filterKey] = filterValue;
		}
	}
}


function stringToCombo()
{
	for(var i in MyComboBox_Instances_Array)
	{
		var aCombo = MyComboBox_Instances_Array[i];
		//checkboxesArray=aCombo.ItemsContainer.getElementsByTagName("input");
		checkboxesArray = $("input",aCombo.ItemsContainer);
		
		if(checkboxesArray && checkboxesArray[0])
		{
			var filterKey ="f_"+checkboxesArray[0].name;
			if(globals[filterKey])
			{						
				if(globals[filterKey]!="")
				{
						for(var j in checkboxesArray)
						{	
								var checkedBoxesValuesArray = globals[filterKey].split(',');
								var inArray = 0;
								for(var k in checkedBoxesValuesArray)
								{
									if(checkboxesArray[j].value == checkedBoxesValuesArray[k])
										inArray = 1;
								}
								if(inArray == 1)
								{
									checkboxesArray[j].checked = true;
								}
						}
				}
				else
					aCombo.uncheckBoxes();
			}
			aCombo.checkedBoxesNumber = aCombo.countCheckedBoxes();
			if(aCombo.checkedBoxesNumber > 0)
				aCombo.setHeaderText(aCombo.checkedBoxesNumber+aCombo.selectedCriteriaMessage);
		}
	}	
}

/************************************************* myselectbox *************************************************/
var MySelectBox_Instances_Array = new Array();

// Fonction retournant l'instance de SelectBox dont le nom est spécifié
function getSelectBoxInstance (name) {
    for(var i in MySelectBox_Instances_Array) {
		if (MySelectBox_Instances_Array[i].getVarName() == name) {
		    return MySelectBox_Instances_Array[i];
		}
	}
	return null;
}

/**
 * Classe fournissant un composant équivalent au SELECT HTML
 * @author GM
 */
function MySelectBox()
{
    this.redirect = false;
    this.withRedirect = function (bool) {
    this.redirect = bool;
    }
	// Référence de l'élément qui contient le composant
	this.Container = null;
	var oThis = this;//We save the reference to the current MySelectBox instance	
	/* ################################################################
	 * Données et fonctions liées aux ID du composant et de ses éléments
	 ################################################################ */
	
	// Chaine servant de base à chaque identifiant des éléments du composant
	this.familyName = 'MySelectBox_';
	
	// Identifiant numérique pour la génération automatique des noms des composants
	this.numericId=0;
	this.setNumericId = function()
	{
		//var documentDIVS = document.getElementsByTagName("DIV");
		var documentDIVS = $("div");
		
		var familyElementsCounter = 0;
		for(var i in documentDIVS)
		{
			if((documentDIVS[i].id) && (documentDIVS[i].id.indexOf(this.familyName+"Header") > -1))
				familyElementsCounter++;
		}
		this.numericId = familyElementsCounter;
	}
	
	
	// nom de l'instance du composant
    this.varName = null;
    this.setVarName = function (name) {
    this.varName = name;
    }
    this.getVarName = function () {
    return this.varName;
    }
	
	/* ################################################################
	 * Données et fonctions liées au INPUT caché qui contient la valeur
	 * de la ligne sélectionnée
	 ################################################################ */
	// Nom de l'INPUT caché 
	this.inputName = 'defaultInput';
	this.setInputName = function (name) {
	this.inputName = name;
	}
	
	// référence de l'INPUT HIDDEN
	this.hiddenInput = null;
    this.defaultItemIndex = null;
    this.setDefaultItemIndex = function (index) {
    this.defaultItemIndex = index;
    }

	
	/* ################################################################
	 * Données et fonctions liées au style CSS des éléments
	 ################################################################ */
	
	// Objet de détection de navigateur
	this.browserDetect = new BrowserDetect();
	
	// Méthode et propriété déterminant si le ContentContainer doit être en position: relative
	this.forceRelative = true;
	this.setForceRelative = function (bool) {
	this.forceRelative = bool;
	
	}
	
	 // Fonction activant ou désactivant le composant
	 // Attention : fonction dépendant du nom de la classe css
	 // il faut que la classe correspondant au visuel disabled
	 // finisse par 'Disabled'
	this.disable = function (bool) {
	
	//var cssClass = this.SelectHeaderTextContainer.getAttribute(SetBrowser());
	var cssClass = $(this.SelectHeaderTextContainer).attr("className");
	var stringDisabled = 'Disabled';
	if (bool) {
	       //alert('avant:'+cssClass);
    if (cssClass.indexOf(stringDisabled) == -1) {
        //this.SelectHeaderTextContainer.setAttribute(SetBrowser(), cssClass + stringDisabled);
        $(this.SelectHeaderTextContainer).attr('className',cssClass + stringDisabled);
        //alert('après:'+$(this.SelectHeaderTextContainer).attr("className"));
        this.SelectButton.onclick = null;
        this.SelectHeader.onclick = null;
    }
    }
    else {
        if (cssClass.indexOf(stringDisabled) != -1) {
            var length = cssClass.length - 8;
            cssClass = cssClass.substr(0, length);
        }
        
        //this.SelectHeaderTextContainer.setAttribute(SetBrowser(), cssClass);
        $(this.SelectHeaderTextContainer).attr('className',cssClass);
        //alert('(actif)après:'+$(this.SelectHeaderTextContainer).attr("className"));
        this.SelectButton.onclick = this.ClickedMySelect;
        this.SelectHeader.onclick = this.OpenOrClose;
    }
	}
	
	// Données et fonctions définissant les images du bouton du composant
	this.pictureOver = globals.server + 'anyimages/Controls/over.gif';
	this.pictureNormal = globals.server + 'anyimages/Controls/normal.gif';
	this.picturePressed = globals.server + 'anyimages/Controls/pressed.gif';
	this.setPictureOver = function (path) {
    this.pictureOver = globals.server + path;
	}
	
	this.setPictureNormal = function (path) {
    this.pictureNormal = globals.server + path;
	}
	
	this.setPicturePressed = function (path) {
    this.picturePressed = globals.server + path;
	}
	 
	// Nom de la class SelectHeader
	this.SelectHeaderClass = 'SelectHeader';
	this.setSelectHeaderClass = function (CssClass) {
    this.SelectHeaderClass = CssClass;
	}
	
	// Nom de la class SelectHeaderTextContainer
	this.SelectHeaderTextContainerClass = 'SelectHeaderTextContainer';
	this.setSelectHeaderTextContainerClass = function (CssClass) {
    this.SelectHeaderTextContainerClass = CssClass;
	}
	
	// Nom de la class SelectButtonContainer
	this.SelectButtonContainerClass = 'SelectButtonContainer';
	this.setSelectButtonContainerClass = function (CssClass) {
    this.SelectButtonContainerClass = CssClass;
	}

    // Nom de la class SelectContentContainer
	this.SelectContentContainerClass = 'SelectContentContainer';
	this.setSelectContentContainerClass = function (CssClass) {
    this.SelectContentContainerClass = CssClass;
	}
	
	// Nom de la class SelectItemsContainer
	this.SelectItemsContainerClass = 'SelectItemsContainer';
	this.setSelectItemsContainerClass = function (CssClass) {
    this.SelectItemsContainerClass = CssClass;
	}

    // Nom de la class SelectdefaultComboItem
	this.SelectdefaultComboItemClass = 'SelectdefaultComboItem';
	this.setSelectdefaultComboItemClass = function (CssClass) {
	
	    this.SelectdefaultComboItemClass = CssClass;
	
	}
	
	// Nom de la class newSelectItem
	this.newSelectItemClass = 'newSelectItem';
	this.setnewSelectItemClass = function (CssClass) {
	this.newSelectItemClass = CssClass;
	}
	
	// Nom de la class newSelectItemTextContainer
	this.newSelectItemTextContainerClass = 'newSelectItemTextContainer';
	this.setnewSelectItemTextContainerClass = function (CssClass) {
	this.newSelectItemTextContainerClass = CssClass;
	}
	
	// Nom de la class SelectFooter
	this.SelectFooterClass = 'SelectFooter';
	this.setSelectFooterClass = function (CssClass) {
	this.SelectFooterClass = CssClass;
	}
	
	// Nom de la class SelectFooterCloseItem
	this.SelectFooterCloseItemClass = 'SelectFooterCloseItem';
	this.setSelectFooterCloseItemClass = function (CssClass) {
	this.SelectFooterCloseItemClass = CssClass;
	}
	
	// Taille de la police du headerText
	this.headerTextfontSize = "10px";
	this.setHeaderTextfontSize = function(size)
	{	
		if(!isNaN(size))
		{
			cssSize = size.toString()+"px";
			this.headerTextfontSize = cssSize;
		}
		else
			this.headerTextfontSize = "10px";
				 
	}
	
	// Marges
	this.marginRight = "0px";
	this.setMarginRight = function(size)
	{	
		if(!isNaN(size))
		{
			cssSize = size.toString()+"px";
			this.marginRight = cssSize;
		}
		else
			this.marginRight = "0px";
				 
	}
	
	this.marginTop = "2px";
	this.setMarginTop = function(size)
	{	
		if(!isNaN(size))
		{
			cssSize = size.toString()+"px";
			this.marginTop = cssSize;
		}
		else
			this.marginTop = "2px";
				 
	}
	
	this.marginLeft = "5px";
	this.setMarginLeft = function(size)
	{	
		if(!isNaN(size))
		{
			cssSize = size.toString()+"px";
			this.marginLeft = cssSize;
		}
		else
			this.marginLeft = "5px";
				 
	}

	
	/* ################################################################
	 * Données et fonctions liées aux dimensions
	 ################################################################ */
	this.width = 200; //default width
	
	this.getWidth = function() { return this.width; }
	this.setWidth = function(w) { this.width = w; this.contentWidth = w; }
	
	this.contentWidth = this.width; //default to size of parent
	this.contentHeight = 120; //default height
	
	// Fonction définissant la taille optimale du composant en fonction
	this.setOptimalHeight = function () {
    this.contentHeight = (this.dataLength() * 17) + 17;
    }
	
	// Fonction qui compte le nombre d'élément du tableau de données
	this.dataLength = function () {
	var cpt = 0;
	for(var i in this.itemsData) {
        cpt++;
    }
    return cpt;
	}
	
    	
	/* ################################################################
	 * Données et fonctions métiers
	 ################################################################ */

    // Données de la liste telle qu'on les fournit
	this.itemsData = null; 
	this.setItemsData = function (dataArray)
	{
		this.itemsData = dataArray;
	}
	
	// Fonction qui parcours les données à la recherche de la bonne valeur
	this.getLineValueCorrespondance = function (value) {
	    var found = false;
	    var cpt = 0;
	    while (!found && cpt < this.itemsData.length) {
	        if (this.itemsData[cpt][0] == value) {
	            found = true;
	        }
	        else {
	         cpt++;
	        }
	    }
	    return cpt;
	}
	

	 // Fonction qui charge l'input caché avec la valeur par défaut
    this.loadDefaultItem = function () {
    
    // Si aucune valeur par défaut n'a été choisie
    // on sélectionne la première ligne du composant
    if (this.defaultItemIndex == null) {
        this.loadItem(0);}
        else {
            this.loadItem(this.getLineValueCorrespondance(this.defaultItemIndex));}
    }
    
    // Fonction qui charge l'input caché avec une valeur
    this.loadItem = function (index) {
    var oHiddenInput = this.hiddenInput;
    oHiddenInput.value = this.itemsData[index][0];
    this.setHeaderText(this.itemsData[index][1]);
    this.hideContent();
    }
    
    // Fonction ajoutant le composant courant à la liste des composants de même type
	this.addToMySelectBox_Instances_Array = function()
	{
		 MySelectBox_Instances_Array.push(this);
	}
	
	// Fonction qui extrait l'id (numérique) d'une ligne à partir de l'id d'un élément
	this.getIndexFromId = function (id) {
        // Extrait l'index de la ligne
    var res = null;
    var reg = new RegExp("^(.*_)([0-9]+)$", "g");
    if (id.match(reg)) {
        res = id.replace(reg, "$2");
        return res;
    }
    }
    
    /* ################################################################
	 * Données et fonctions métiers de création du composant
	 ################################################################ */
    
	// Charge le texte visible par défaut
	this.HeaderText = "";
	this.setHeaderText = function(newText) {
		this.HeaderText = newText;
		if (this.SelectHeaderTextContainer)
			this.SelectHeaderTextContainer.innerHTML = this.HeaderText;
	}
	
	// Fonction liant le composant à un conteneur
	this.addToContainer = function (Container)
	{
		this.Container = Container;
		// override default addToContainer
		if (typeof this.Container == "string")
		{	
			//document.getElementById(this.Container).appendChild(this.SelectHeader);
			$("#"+this.Container).append(this.SelectHeader);
			//document.getElementById(this.Container).appendChild(this.ContentContainer);
			$("#"+this.Container).append(this.ContentContainer);
		}
		else
		{
			//this.Container.appendChild(this.SelectHeader);
			$(this.Container).append(this.SelectHeader);
			//this.Container.appendChild(this.ContentContainer);
			$(this.Container).append(this.ContentContainer);
		}
	}
	
	// Fonction de chargement du header du composant
	this.addSelectHeader = function()
	{
		this.SelectHeader = document.createElement("div");
		this.SelectHeader.id = this.familyName+this.numericId+"_"+this.familyName+"Header";
		this.SelectHeader.style.zIndex = 100;
		//this.SelectHeader.setAttribute(SetBrowser(), this.SelectHeaderClass.toString());
		$(this.SelectHeader).addClass(this.SelectHeaderClass.toString());
	}
	
	// Fonction de chargement du conteneur du bouton d'ouverture/fermeture
	this.addButtonContainer = function () 
	{
	    this.SelectButtonContainer = document.createElement("div");
		//this.SelectButtonContainer.setAttribute(SetBrowser(), this.SelectButtonContainerClass.toString() );
		$(this.SelectButtonContainer).addClass(this.SelectButtonContainerClass.toString());
		this.SelectButtonContainer.id=this.familyName+this.numericId+"_ButtonContainer";
	}
	
	// Fonction de chargement du bouton d'ouverture/fermeture
	this.addSelectButton = function () 
	{
		this.SelectButton = document.createElement("img");
		this.SelectButton.alt = this.HeaderText;
		this.SelectButton.id = this.familyName+this.numericId+"_Button";
		this.SelectButton.src = this.pictureNormal;
	}
	
	// Fonction de chargement du conteneur de texte du header
	this.addHeaderTextContainer = function () 
	{
		this.SelectHeaderTextContainer = document.createElement("div");
		//this.SelectHeaderTextContainer.setAttribute(SetBrowser(), this.SelectHeaderTextContainerClass.toString());
		$(this.SelectHeaderTextContainer).addClass(this.SelectHeaderTextContainerClass.toString());
		this.SelectHeaderTextContainer.id = this.familyName+this.numericId+"_HeaderTextContainer";
	}

	// Fonction de chargement du conteneur de lignes
	this.addContentContainer = function()
	{
	    this.ContentContainer = document.createElement("div");
		//this.ContentContainer.setAttribute(SetBrowser(), this.SelectContentContainerClass.toString());
		$(this.ContentContainer).addClass(this.SelectContentContainerClass.toString());
		this.ContentContainer.id = this.familyName+this.numericId+"_ContentContainer";
		// On force la position a "relative" si le navigateur est Firefox en version 2 pour corriger un bug de z-index
        if ( (this.forceRelative) && (this.browserDetect.browser == 'Firefox' &&  this.browserDetect.version == '2') ) {
            this.ContentContainer.style.position = "relative";
        }
	}
	
	// Fonction de chargement du conteneur de lignes sélectionnables
	this.addItemsContainer = function()
	{	
	    // Elément conteneur des lignes
		this.ItemsContainer = document.createElement("div");
		//this.ItemsContainer.setAttribute(SetBrowser(), this.SelectItemsContainerClass.toString());
		$(this.ItemsContainer).addClass(this.SelectItemsContainerClass.toString());
		this.ItemsContainer.style.overflowX = "hidden";
		this.ItemsContainer.style.overflowY = "scroll";
		this.ItemsContainer.id=this.familyName+this.numericId+"_ItemsContainer";
	}
	
	// Fonction de chargement du INPUT caché
	this.addHiddenInput = function()
	{
		this.hiddenInput = document.createElement("input");
		this.hiddenInput.setAttribute("type","text");
		this.hiddenInput.style.display = "none";
		this.hiddenInput.setAttribute("name",this.inputName);
		this.hiddenInput.setAttribute("id",this.inputName);
		this.hiddenInput.setAttribute("value","");	
		this.hiddenInput.setAttribute("varName",this.varName);
	}
	
	// Fonction de chargement du composant
	// Créé les lignes du composant
	this.fillSelectBox = function()
	{	
		for(var counter in this.itemsData)
		{
			this.addSelectItem(this.itemsData[counter][1], counter);
		}
	}	
	
	// Fonction de création d'une ligne
	this.addSelectItem = function(itemText,itemPosition)
	{	
		// Elément ligne
		var newSelectItem = document.createElement("div");
		//newSelectItem.setAttribute(SetBrowser(), this.newSelectItemClass.toString());
		$(newSelectItem).addClass(this.newSelectItemClass.toString());
		newSelectItem.id=this.familyName+this.numericId+"_Item_"+itemPosition;
		newSelectItem.innerHTML = itemText;
		// Gestion d'evenement pour la surbrillance
		newSelectItem.onmouseover = this.OverMyItem;
		newSelectItem.onmouseout = this.OutMyItem;		
		// Evenements
		newSelectItem.onclick = this.clickedSelectItem;
        // Liaison avec le conteneur de lignes
		this.ItemsContainer.appendChild(newSelectItem);
	}

    // Fonction de chargement du FOOTER
	this.addSelectFooter = function()
	{
	    // Elément conteneur du footer
		this.SelectFooter=document.createElement("div");
		//this.SelectFooter.setAttribute(SetBrowser(), this.SelectFooterClass.toString());
		$(this.SelectFooter).addClass(this.SelectFooterClass.toString());
		this.SelectFooter.id=this.familyName+this.numericId+"_Footer";
		// Elément footer
		this.SelectFooterCloseItem = document.createElement("div");
		//this.SelectFooterCloseItem.setAttribute(SetBrowser(), this.SelectFooterCloseItemClass.toString());
		$(this.SelectFooterCloseItem).addClass(this.SelectFooterCloseItemClass.toString());
		this.SelectFooterCloseItem.id=this.familyName+this.numericId+"_FooterCloseItem";
		this.SelectFooterCloseItemText="Fermer";
		this.SelectFooterCloseItem.innerHTML = this.SelectFooterCloseItemText;
        // Liaison élément ==> conteneur (footer)
		this.SelectFooter.appendChild(this.SelectFooterCloseItem);
	}


	
	// Fonction d'initialisation
	this.init = function()
	{	
	     this.browserDetect.init();
	    // Définie l'identifiant numérique de ce composant
		this.setNumericId();
		// Ajoute le composant à la liste des composants de même type
		this.addToMySelectBox_Instances_Array();
		
		// Création du header du composant
		this.addSelectHeader(); // Conteneur du header
		this.addButtonContainer(); // Create Button Container
		this.addSelectButton();// Create Button
		this.addHeaderTextContainer();// Conteneur de texte du header
		
		// Liaisons des éléments du header
		this.SelectButtonContainer.appendChild(this.SelectButton); // bouton ==> conteneur du bouton
		this.SelectHeader.appendChild(this.SelectButtonContainer); // conteneur du bouton => conteneur du header
		this.SelectHeader.appendChild(this.SelectHeaderTextContainer); // conteneur du texte du header => conteneur du header
		
		// Création e la partie déroulante du composant
		this.addContentContainer(); // Création du conteneur de ligne
		this.addHiddenInput(); // Création du INPUT caché		
		this.addItemsContainer(); // Création du conteneur de ligne sélectionnable
		this.addSelectFooter(); // Création du footer
		
	    // Liaisons des éléments de la partie déroulante
		this.fillSelectBox(); // Création des éléments
        this.ContentContainer.appendChild(this.hiddenInput); // INPUT ==> conteneur de lignes
		this.ContentContainer.appendChild(this.ItemsContainer); // conteneur de lignes sélectionnables => conteneur de lignes
		this.ContentContainer.appendChild(this.SelectFooter);// Liaison conteneur footer => conteneur de lignes

        // Sélection de la ligne par défaut
		this.loadDefaultItem();
		document.body.appendChild(this.SelectHeader);
		document.body.appendChild(this.ContentContainer);
		
		// Adding Events
		// Bouton d'ouverture/fermeture du composant
		this.SelectButton.onmouseover = this.OverMySelect;
		this.SelectButton.onmouseout = this.OutMySelect;
		this.SelectButton.onmousedown = this.PressedMySelect;
		this.SelectButton.onclick = this.ClickedMySelect;
		
        // Zone visible par défaut du composant
		this.SelectHeader.onmouseover = this.OverMySelect;
		this.SelectHeader.onmouseout = this.OutMySelect;
		this.SelectHeader.onclick = this.OpenOrClose;
        
        // Texte de fermeture du composant
		this.SelectFooterCloseItem.onclick = this.OpenOrClose;
		document.onclick = MyClickHandler;
	}
	
	/* ################################################################
	 * Données et fonctions liées aux événements
	 ################################################################ */

    // Fonction affichant/masquant le composant
	this.contentVisible = function() { return this.ContentContainer.style.display == "none" ? false : true; }
	// Fonction affichant le contenu du composant
	this.showContent = function() { /*this.RepositionContainer();*/
	this.ContentContainer.style.display = "block"; 
    
    }

    // Fonction masquant le contenu du composant
	this.hideContent = function() { this.ContentContainer.style.display = "none"; }
	// Fonctions de gestion de l'image flèche
	this.OverMySelect = function (oEvent)
    {
        oThis.SelectButton.src = oThis.pictureOver;
	} 

	this.OutMySelect = function (oEvent)
    {
        oThis.SelectButton.src = oThis.pictureNormal;
    } 

	this.PressedMySelect = function (oEvent)
    {
        oThis.SelectButton.src = oThis.picturePressed;
    } 
    
	this.ClickedMySelect = function (oEvent)
    {
        oThis.SelectButton.src = oThis.pictureOver;
        oThis.OpenOrClose(oEvent);
    }

    // Fonctions de gestion de la surbrillance
	this.OverMyItem = function (oEvent)
    {
		oEvent = oEvent || window.event;
        oTarget = oEvent.target || oEvent.srcElement;
        if (oTarget.nodeType==3) // defeat Safari bug
        {
            oTarget = oTarget.parentNode;
        }
        // Surbrillance des enfants
        if (oTarget.hasChildNodes()) {
            var childNodes = oTarget.childNodes;
            for (var i = 0; i < childNodes.length; i++) {
            
                if (childNodes[i].style != null) {
                    childNodes[i].style.backgroundColor = "lightblue";
                }
            }
        }
        oTarget.style.backgroundColor = "lightblue";
    } 

	this.OutMyItem = function (oEvent)
    {
		oEvent = oEvent || window.event;
        oTarget = oEvent.target || oEvent.srcElement;
        
        if (oTarget.nodeType==3) // defeat Safari bug
        {
            oTarget = oTarget.parentNode;
        }
         // Surbrillance des enfants
        if (oTarget.hasChildNodes()) {
        
            var childNodes = oTarget.childNodes;
            for (var i = 0; i < childNodes.length; i++) {
                if (childNodes[i].style != null) {
                    childNodes[i].style.backgroundColor = "white";
                }
            }
        }
        
        oTarget.style.backgroundColor = "white";
    } 

    // Fonction affichant/masquant le contenu du composant
	this.OpenOrClose = function(oEvent)
	{
		oEvent = oEvent || window.event;
		MyClickHandler(oEvent);
		if (document.all)
		{
			window.event.cancelBubble = true;
		} else
			oEvent.stopPropagation();
		    if (oThis.contentVisible())
		    {
			    oThis.hideContent();
		    } 
		    else 
			    oThis.showContent();
		}
		
	// Fonction sélectionnant la ligne cliquée
    this.clickedSelectItem = function(oEvent)
	{

		oEvent = oEvent || window.event;
        oTarget = oEvent.target || oEvent.srcElement;
        if (oTarget.nodeType==3) // defeat Safari bug
        {
            oTarget = oTarget.parentNode;
        }
        
        var id = oThis.getIndexFromId(oTarget.id);
        oThis.loadItem(id);
        if (oThis.redirect) {
            redirect();
        }
    }
}


/***************************************** Fonctions Transverses *********************************************/
function SetBrowser()
{
    if(navigator.appName == 'Microsoft Internet Explorer')
    {
        return "className";
    }
    else
    {
        return "class";
    }
}