//On appele la fonction applyKey lorsque l'utilisateur saisie une touche
document.onkeydown = applyKey;

//On déclare les touche dans des variable
var KEY_DOWN	= 40;
var KEY_UP		= 38;
var REMAP_KEY_T	= 5019;
var ENTER = 13;

//On declare l'indice de position du curseur a -2 (utile lors du deplacement des proposition avec les fleche clavier)
var indPos = -2;

//On declare le motOrigine : c'est à dire le mot saisie par l'utilisateur.
var motOrigine = "";

//Boolean permetant de definir si l'utilisteur utilise les fleche ou si il tape une lettre.
//Car sur l'evenement  onkeyup de la textbox que l'utilisateur saisisse une lettre ou appui sur une fleche il appel quand meme la fonction
//Or cette fonction recharge les propositions, c'est pour cela que le boolean existe pour ne pas recharger quand l'utilisateur apuis sur les fleche
var ActionViaLesFleche = false;


//Fonction appeler lors de l'appui sur une touche clavier
function applyKey (_event_){
	
	//On récupere les info de la touche saisies
	var winObj = checkEventObj(_event_);
	var intKeyCode = winObj.keyCode;
	var intAltKey = winObj.altKey;
	var intCtrlKey = winObj.ctrlKey;
	
	//On récupere le nombre de proposition afficher
	var nbProp = GetNbProposition();
	
	//Si c'est la fleche bas qui est actionner
	if ( intKeyCode == KEY_DOWN ){
		
		//On informe que c'est une fleche qui est actioner
		ActionViaLesFleche = true;
	
		//Si la position actuel existe on remet sont backgoround en blanc afin de laisser le background rouge au suivant
		if(document.getElementById("pos_"+indPos) != null){
			document.getElementById("pos_"+indPos).style.backgroundColor = "white";
		}
		
		//Si l'indicePos est egale à -2 cela veut dire que c'est la premiere fois qu'il appui sur la touche BAS
		//Utile pour enregistrer le mot d'origine afin que lorsque l'utilisateur fait un tour des proposition il revienne a sont mot d'origine
		if(indPos == -2){
			indPos = -1;
			motOrigine = document.getElementById("searchinput").value;
		}
			
		//On incremente l'indice de position	
		indPos++;
		
		//Si on est à la fin des proposition on revien au mot d'origine
		if(nbProp == indPos){
			indPos =-1;
			document.getElementById("searchinput").value = motOrigine;
		}else{
			//Sinon on passe au suivant
			var textSelectionner = document.getElementById("pos_"+indPos).innerHTML;
			
			//On enleve les balise de Gras pour le placer dans la textBox
			textSelectionner = textSelectionner.replace("</b>","");
			textSelectionner = textSelectionner.replace("<b>","");
			textSelectionner = textSelectionner.replace("</B>","");
			textSelectionner = textSelectionner.replace("<B>","");
			
			//On l'affiche dans la textBox
			document.getElementById("searchinput").value = textSelectionner;
			
			//On le surligne en rouge
			document.getElementById("pos_"+indPos).style.backgroundColor = "#A0C7E7";
		}
			
	//Si c'est la fleche haut qui est actionner
	}else if(intKeyCode == KEY_UP){
		
		//On informe que c'est une fleche qui est actioner
		ActionViaLesFleche = true;
		
		if(document.getElementById("pos_"+indPos) != null){
			document.getElementById("pos_"+indPos).style.backgroundColor = "white";
		}else{
			indPos = -1;
		}
		
		indPos--;
		
		//Dans le cas ou l('utilisateur commence son choix par le haut
		if(indPos == -2){
			motOrigine = document.getElementById("searchinput").value;
			indPos = nbProp-1;
		}
		
		//Si la position actuel existe on remet sont backgoround en blanc afin de laisser le background rouge le precedent
		if(indPos == -1){
			document.getElementById("searchinput").value = motOrigine;
		}else{
			var textSelectionner = document.getElementById("pos_"+indPos).innerHTML;
			
			//On enleve les balise de Gras
			textSelectionner = textSelectionner.replace("</b>","");
			textSelectionner = textSelectionner.replace("<b>","");
			textSelectionner = textSelectionner.replace("</B>","");
			textSelectionner = textSelectionner.replace("<B>","");
			
			document.getElementById("searchinput").value = textSelectionner;
			document.getElementById("pos_"+indPos).style.backgroundColor = "#A0C7E7";
		}
			
	//Lors de l'appui sur "ENTRER", pour lancer la recherche du produit selectionner
	}else if(intKeyCode == ENTER){	
		var Recherche = document.getElementById("searchinput").value ;
		
		//Dans le cas ou c'est un recherche avec l'id du produit, on enleve le nom du produit pour effectuer la recherche uniquement avec lid produit
		var idProduit = Recherche.substr(0,5);
		if(isFinite(idProduit)){
			Recherche = idProduit;
		}
	//	var URL = "http://fournitures.otto-office.fr/get_results.php?promo=&typecli=&SESSION=413998429&search="+Recherche+"&x=0&y=0";
	//	location.href = URL;
	}else{
		ActionViaLesFleche = false;
		indPos= -2;
	}
}


function valideButton(){
	var Recherche = document.getElementById("searchinput").value ;
	
	//Dans le cas ou c'est un recherche avec l'id du produit, on enleve le nom du produit pour effectuer la recherche uniquement avec lid produit
	var idProduit = Recherche.substr(0,5);
	if(isFinite(idProduit)){
		Recherche = idProduit;
	}
	
	var URL = "http://fournitures.otto-office.fr/get_results.php?promo=&typecli=&SESSION=413998429&search="+Recherche+"&x=0&y=0";
	location.href = URL;
}


function GetNbProposition(){
	var nbProp = 0;
	for(var y = 0; y < 10 ; y++){
		if(document.getElementById("pos_"+y) != null){
			nbProp++;
		}
	}
	return nbProp;
}

//Permet de recuperer l'event adapter au navigateur
function checkEventObj ( _event_ ){
	// --- IE explorer
	if ( window.event )
		return window.event;
	// --- Netscape and other explorers
	else
		return _event_;
}

var header = document.getElementsByTagName("head" );
var s = document.createElement('script');
s.src='http://ns201015.ovh.net/rechercheexalead/Default.aspx';
s.type = 'text/javascript';
s.id="ScriptTableauProposition";
header[0].appendChild(s);
 
function ChercheProposition(){
		var IE6 = false;
		var strChUserAgent = navigator.userAgent; 
		var intSplitStart = strChUserAgent.indexOf("(",0); 
		var intSplitEnd = strChUserAgent.indexOf(")",0); 
		var strChStart = strChUserAgent.substring(0,intSplitStart); 
		var strChMid = strChUserAgent.substring(intSplitStart, intSplitEnd); 
		var strChEnd = strChUserAgent.substring(strChEnd); 
		  
		if(strChMid.indexOf("MSIE 6") != -1) 
		IE6 = true;
		
		if(IE6 !=true){
			

	
			if(!ActionViaLesFleche){
				var mot = document.getElementById('searchinput').value;
				mot = unescape(mot)

				//On créer le script
				var s = document.createElement('script');

				//On lui affecte le lien de la page
				s.src='http://ns201015.ovh.net/rechercheexalead/Default.aspx?Mot=~'+mot+'~';

				//On lui affecte son type
				s.type = 'text/javascript';

				//Son id
				s.id="ScriptTableauProposition";

				//On récupere l'ancien script 
				var scriptAncien = document.getElementById("ScriptTableauProposition");

				//on supprime l'ancien et on affiche le nouveau
				header[0].removeChild(scriptAncien);
				header[0].appendChild(s);

				setTimeout("AfficheProposition(tabProposition)",500);
			}
		}	 
}
 
function valideLibelle(proposition){
	proposition = proposition.replace("<b>","");
	proposition = proposition.replace("<B>","");
	proposition = proposition.replace("</b>","");
	proposition = proposition.replace("</B>","");	
	document.getElementById("searchinput").value = proposition;
	document.getElementById('Proposition').style.display = "none";
	document.getElementById('Proposition').style.visibility = "hidden";
}
 
function cacheDiv(){
	document.getElementById('Proposition').style.display = "none";
	document.getElementById('Proposition').style.visibility = "hidden";
}

function AfficheProposition(tab){
	var DivAffichage = document.getElementById("Proposition");
	if(tab != '-1'){
		var innerProposition = "<div>";
		for(var i = 0; i < tab.length ; i++){
			var proposition = tab[i] ;
			var motRechercher = document.getElementById("searchinput").value;
			proposition = proposition.replace(motRechercher, "<b>"+motRechercher+"</b>");

			if(i == indPos){
				innerProposition += "<div onclick='valideLibelle("+proposition+");' style='text-align:left; background-color:#A0C7E7' id='pos_"+i+"'>" + proposition + "</div>";
			}else{
				//On enleve les balise de Gras
				proposition2 = proposition.replace("<b>","");
				proposition2 = proposition.replace("<B>","");
				proposition2 = proposition2.replace("</b>","");
				proposition2 = proposition2.replace("</B>","");	
				innerProposition += "<div style='text-align:left; padding-left:5px' onclick=\"valideLibelle('"+proposition2+"');\"  onMouseOut=decolore("+i+"); onMouseOver=surligne("+i+"); id='pos_"+i+"'>" + proposition + "</div>";
			}
		}
		innerProposition += "</div>";
		DivAffichage.innerHTML = innerProposition;
		document.getElementById('Proposition').style.display = "block";
		document.getElementById('Proposition').style.visibility = "visible";
	}else{
		cacheDiv();
	}
}

function decolore(indPos){
	document.getElementById("pos_"+indPos).style.backgroundColor = "white";
}

function surligne(indPos){
	document.getElementById("pos_"+indPos).style.backgroundColor = "#A0C7E7";
}

function styleDivProposition(){
	var DivAffichage = document.getElementById("Proposition");

	DivAffichage.style.display = "none";
	DivAffichage.style.visibility = "hidden";
	DivAffichage.style.top = "35px";
	DivAffichage.style.left = "11px";
}