/*
tableau des reponses necessaires à la correspondance entre la suggestion et les données
Vous pouvez bien entendu le generer en php ou bien de facon dynamique avec ajax ;)
*/
var formatSuggest="";
function  formatSuggests(suggest,valeur){
	var testRed =suggest.fontcolor('red');
	return testRed.bold()+valeur.substring(suggest.length,valeur.length);
}

/*
fonction de recalcul de l'offset top et left qui se refere à l'offsetParent pour palier au probleme de positionnement dans les tableaux
*/
function positionAbsolute(obj, mode)
{
	currentValue = 0;
	if (obj.offsetParent)
	{
		if (mode == 'top')
			currentValue = obj.offsetTop;
		else if (mode == 'left')
			currentValue = obj.offsetLeft;
		while (obj = obj.offsetParent)
			if (mode == 'top')
				currentValue += obj.offsetTop;
			else if (mode == 'left')
				currentValue += obj.offsetLeft;
	}

	return currentValue;
}
		
/*
la fonction principale qui remplis le div des differentes suggestions possibles en corélation avec le champ input
*/
var listSelection ="";
var listPasSelection ="";

function	showValue(inside)
{
	divDest						= document.getElementById('menuRightHidden');
	divDest.innerHTML			= '';
	valueOfElement				= '';
	exist						= 0;
	nbOfElement					= 0;

	divDest.style.top			= positionAbsolute(inside, 'top') + inside.offsetHeight;
	divDest.style.left			= positionAbsolute(inside, 'left');
	divDest.style.width			= inside.offsetWidth - 3;
	listSelection ="";
	listPasSelection="";
	for (i = 0; i < suggests.length; i++)
	{
		if (suggests[i].indexOf(inside.value) == 0 && inside.value != '')
		{
			formatSuggest=formatSuggests(inside.value,suggests[i])
			listSelection+=','+formatSuggest;
			
			
			nbOfElement++;
			exist					= 1;
			valueOfElement			= formatSuggest;
			currentDiv				= document.createElement("div");
			currentInner			= document.createTextNode(formatSuggest);
			currentDiv.indice		= suggests[i];
			currentDiv.className	= 'currentDiv';
			currentDiv.onclick		= function()
			{
				inside.value = this.indice;
				divDest.style.visibility = 'hidden';
			}
			currentDiv.appendChild(currentInner);
			currentDiv.innerHTML=formatSuggest;
			divDest.appendChild(currentDiv);
		}
		else 
			listPasSelection+=','+formatSuggest;
	}
	
	if (exist == 0 || (valueOfElement.length  == inside.value.length && nbOfElement == 1))
		divDest.style.visibility = 'hidden'
	else
		divDest.style.visibility = 'visible';
		
	
}
function	showValueSelect(inside)
{
	divDest						= document.getElementById('menuRightHidden');
	
	divDest.innerHTML			= '';
	valueOfElement				= '';
	exist						= 0;
	nbOfElement					= 0;
	divDest.style.top			= positionAbsolute(inside, 'top') + inside.offsetHeight;
	divDest.style.left			= positionAbsolute(inside, 'left');
	divDest.style.width			= inside.offsetWidth - 3;
	
	listSelection ="";
	listPasSelection="";
	for (i = 0; i < suggests.length; i++)
	{
		if (suggests2[i].indexOf(inside.value) == 0 && inside.value != '')
		{
			listSelection+=','+suggests[i];
			
			nbOfElement++;
			exist					= 1;
			valueOfElement			= suggests2[i];
			currentDiv				= document.createElement("div");
			currentInner			= document.createTextNode(suggests2[i]);
			currentDiv.indice		= suggests2[i];
			currentDiv.className	= 'currentDiv';
			currentDiv.onclick		= function()
			{
				inside.value = this.indice;
				divDest.style.visibility = 'hidden';
			}
			currentDiv.appendChild(currentInner);
			divDest.appendChild(currentDiv);
		}
	}
	
	if (exist == 0 || (valueOfElement.length  == inside.value.length && nbOfElement == 1))
		divDest.style.visibility = 'hidden'
	else
		divDest.style.visibility = 'visible';
		
	afficherListeProdDispo(listSelection.split(","));
}
function ecrire(texte,leSelect){
	leSelect.options[leSelect.length]=new Option(texte.split("@")[1]);
	leSelect.options[leSelect.length-1].value=texte.split("@")[0];
	
}
function afficherListeProdDispo(liste){
	leSelect  = document.getElementById('idProduit');
	leSelect.length=0;
	for(i=1;i<liste.length;i++){
		ecrire(liste[i],leSelect);
	}
	
}		
/*
intialisation de la div qui contiendra les differentes suggestions
*/
function	initMenuRightDiv()
{
	menuRightDiv			= document.createElement("div");
	menuRightDiv.className	= 'hiddenDiv';
	menuRightDiv.id			= 'menuRightHidden';
	window.document.body.appendChild(menuRightDiv);
}
function affcherRecherche(){
	document.getElementById("recherche").innerHTML="<input onkeyup='showValue(this);' />";
}		
function affcherRechercheSelect(){
	document.getElementById("recherche").innerHTML="<input onkeyup='showValueSelect(this);' />";
}		
window.onload = initMenuRightDiv;
