// retourne un objet xmlHttpRequest.

// méthode compatible entre tous les navigateurs (IE/Firefox/Opera)
function getXMLHTTP()
{
  var xhr=null;
  if(window.XMLHttpRequest) // Firefox et autres
  xhr = new XMLHttpRequest();
  else if(window.ActiveXObject){ // Internet Explorer
    try {
      xhr = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
      try {
        xhr = new ActiveXObject("Microsoft.XMLHTTP");
      } catch (e1) {
        xhr = null;
      }
    }
  }
  else { // XMLHttpRequest non supporté par le navigateur
    alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
  }
  return xhr;
}//getXMLHTTP()

 var _documentForm=null; // le formulaire contenant notre champ texte
 var _inputField=[]; // le champ texte lui-même
 var _submitButton=null; // le bouton submit de notre formulaire
 var _completeDiv=[];
 var _curwidth=118;
 var grand=0;

function initAutoComplete(form,field,submit,nb){


  _documentForm=form;
  _inputField[nb]=field;
  _submitButton=submit;
  _inputField[nb].autocomplete="off";

  creeAutocompletionDiv(nb);
  _currentInputFieldValue[nb]=_inputField[nb].value;
  _oldInputFieldValue[nb]=_currentInputFieldValue[nb];
  cacheResults("",new Array())
  _documentForm.onkeydown=onKeyDownHandler;
  _inputField[nb].onkeyup=onKeyUpHandler(nb);
  _inputField[nb].onblur=onBlurHandler(nb);
  //_curwidth=calculateWidth(nb)+"px";
  window.onresize=onResizeHandler(nb);
  // Premier déclenchement de la fonction dans 200 millisecondes
   affzonerech(nb);
  setTimeout("mainLoop("+nb+")",200);

}
var _oldInputFieldValue=[]; // valeur précédente du champ texte
var _currentInputFieldValue=[]; // valeur actuelle du champ texte
var _resultCache=new Object(); // mécanisme de cache des requetes

// tourne en permanence pour suggerer suite à un changement du champ texte
function mainLoop(nb){

  if(_oldInputFieldValue[nb]!=_currentInputFieldValue[nb]){

    var valeur=escapeURI(_currentInputFieldValue[nb]);
    
    //var suggestions=_resultCache[_currentInputFieldValue[nb][nb]];
    
    /*if(suggestions){ // la réponse était encore dans le cache
      metsEnPlace(valeur,suggestions)
    }else{*/

     callSuggestions(valeur, nb) // appel distant
    //}

    _inputField[nb].focus()

  }
  _oldInputFieldValue[nb]=_currentInputFieldValue[nb];
  setTimeout("mainLoop("+nb+")",200); // la fonction se redéclenchera dans 200 ms
  return true
}

// echappe les caractère spéciaux
function escapeURI(La){
  if(encodeURIComponent) {
    return encodeURIComponent(La);
  }
  if(escape) {
    return escape(La)
  }
}

var _xmlHttp = null; //l'objet xmlHttpRequest utilisé pour contacter le serveur
var _adresseRecherche = "/annonces/options.php?opt=lr" //l'adresse à interroger pour trouver les suggestions

function callSuggestions(valeur, nb){
  if(_xmlHttp&&_xmlHttp.readyState!=0){
    _xmlHttp.abort()
  }
  _xmlHttp=getXMLHTTP();
  if(_xmlHttp){
    //appel à l'url distante
    _xmlHttp.open("GET",_adresseRecherche+"&debut="+valeur,true);
    _xmlHttp.onreadystatechange=function() {
      if(_xmlHttp.readyState==4&&_xmlHttp.responseXML) {
        var liste = traiteXmlSuggestions(_xmlHttp.responseXML)
        cacheResults(valeur,liste, nb)
        metsEnPlace(valeur,liste, nb)
      }
    };
    // envoi de la requete
    _xmlHttp.send(null)
  }
  affzonerech(nb);
}//callSuggestions()

// Mecanisme de caching des réponses
function cacheResults(debut,suggestions, nb){
  _resultCache[debut]=suggestions
}

// Transformation XML en tableau
function traiteXmlSuggestions(xmlDoc) {
  var options = xmlDoc.getElementsByTagName('option');
  var optionsListe = new Array();
  for (var i=0; i < options.length; ++i) {
    optionsListe.push(options[i].firstChild.data);
  }
  return optionsListe;
}

//insère une règle avec son nom
function insereCSS(nom,regle){
  if (document.styleSheets) {
    var I=document.styleSheets[0];
    if(I.addRule){ // méthode IE
      I.addRule(nom,regle)
    }else if(I.insertRule){ // méthode DOM
      I.insertRule(nom+" { "+regle+" }",I.cssRules.length)
    }
  }
}

function initStyle(){
  var AutoCompleteDivListeStyle="font-size: 13px; font-family: arial,sans-serif; word-wrap:break-word; ";
  var AutoCompleteDivStyle="display: block; padding-left: 3; padding-right: 3; height: 16px; overflow: hidden; background-color: white;";
  var AutoCompleteDivActStyle="background-color: #3366cc; color: white ! important; ";
  insereCSS(".AutoCompleteDivListeStyle",AutoCompleteDivListeStyle);
  insereCSS(".AutoCompleteDiv",AutoCompleteDivStyle);
  insereCSS(".AutoCompleteDivAct",AutoCompleteDivActStyle);
}

function setStylePourElement(c,name){
  c.className=name;
}

// calcule le décalage à gauche
function calculateOffsetLeft(r){
  return calculateOffset(r,"offsetLeft")
}

// calcule le décalage vertical
function calculateOffsetTop(r){
  return calculateOffset(r,"offsetTop")
}

function calculateOffset(r,attr){
  var kb=0;
  while(r){
    kb+=r[attr];
    r=r.offsetParent
  }
  return kb
}

// calcule la largeur du champ
function calculateWidth(nb){

  var largch = _inputField[nb].offsetWidth;

  return (largch-2);
}

function setCompleteDivSize(nb){
  if(_completeDiv[nb]){
    _completeDiv[nb].style.left=calculateOffsetLeft(_inputField[nb])+"px";
    _completeDiv[nb].style.top=calculateOffsetTop(_inputField[nb])+_inputField[nb].offsetHeight-1+"px";

     _completeDiv[nb].style.width=_curwidth;
    }


  }


function creeAutocompletionDiv(nb) {
  initStyle();
  _completeDiv[nb]=document.createElement("DIV");
  _completeDiv[nb].id="completeDiv";
  var borderLeftRight=1;
  var borderTopBottom=1;
  var fontSize=8;
  _completeDiv[nb].style.borderRight="black "+borderLeftRight+"px solid";
  _completeDiv[nb].style.fontSize=fontSize+"pt";
  _completeDiv[nb].style.borderLeft="black "+borderLeftRight+"px solid";
  _completeDiv[nb].style.borderTop="black "+borderTopBottom+"px solid";
  _completeDiv[nb].style.borderBottom="black "+borderTopBottom+"px solid";
  _completeDiv[nb].style.zIndex="1";
  _completeDiv[nb].style.paddingRight="0";
  _completeDiv[nb].style.paddingLeft="0";
  _completeDiv[nb].style.paddingTop="0";
  _completeDiv[nb].style.paddingBottom="0";
  setCompleteDivSize(nb);
  _completeDiv[nb].style.visibility="hidden";
  _completeDiv[nb].style.position="absolute";
  _completeDiv[nb].style.backgroundColor="white";
  document.body.appendChild(_completeDiv[nb]);
  setStylePourElement(_completeDiv[nb],"AutoCompleteDivListeStyle");
}

function metsEnPlace(valeur, liste, nb){
  while(_completeDiv[nb].childNodes.length>0) {
    _completeDiv[nb].removeChild(_completeDiv[nb].childNodes[0]);
  }
  // mise en place des suggestions

  
  var grand= 0;

  for(var f=0; f<liste.length; ++f){
    var nouveauDiv=document.createElement("DIV");
    nouveauDiv.onmousedown=divOnMouseDown(nb);
    nouveauDiv.onmouseover=divOnMouseOver(nb);
    nouveauDiv.onmouseout=divOnMouseOut;
    setStylePourElement(nouveauDiv,"AutoCompleteDiv");
    var nouveauSpan=document.createElement("SPAN");
    nouveauSpan.innerHTML=liste[f]; // le texte de la suggestion
    nouveauDiv.appendChild(nouveauSpan);
    _completeDiv[nb].appendChild(nouveauDiv)

    if(liste[f].length>=20)
    {
     grand= 1;
    }

  }//for

  
  if (grand)
  {
   _curwidth=265;
  }
  else  _curwidth=118;

  if(liste.length==1 && _eventKeycode!= 8)
  {
   _inputField[nb].value=liste[0];

  }


  _completeDiv[nb].style.width=_curwidth+"px";
  //alert(_completeDiv[nb].style.width);
  PressAction(nb);
  if(_completeDivRows>0) {
    _completeDiv[nb].height=16*_completeDivRows+4;
  } else {
    hideCompleteDiv(nb);
  }

}

var _lastKeyCode=null;

// Handler pour le keydown du document
var onKeyDownHandler=function(event){
  // accès evenement compatible IE/Firefox
  if(!event&&window.event) {
    event=window.event;
  }
  // on enregistre la touche ayant déclenché l'evenement
  if(event) {
    _lastKeyCode=event.keyCode;
  }
}

var _eventKeycode = null;

// Handler pour le keyup de lu champ texte
function onKeyUpHandler(nb)
{
 return function(event){
  // accès evenement compatible IE/Firefox
  if(!event&&window.event) {
    event=window.event;
  }
  _eventKeycode=event.keyCode;
  // Dans les cas touches touche haute(38) ou touche basse (40)
  if(_eventKeycode==40||_eventKeycode==38) {
    // on autorise le blur du champ (traitement dans onblur)
    blurThenGetFocus(nb);
  }
  // taille de la selection
  var N=rangeSize(_inputField[nb]);
   //taille du texte avant la selection (selection = suggestion d'autocomplétion)
  var v=beforeRangeSize(_inputField[nb]);
  // contenu du champ texte
  var V=_inputField[nb].value;

  if(_eventKeycode!=0){
    if(N>0&&v!=-1) {
      // on recupere uniquement le champ texte tapé par l'utilisateur
      V=V.substring(0,v);
    }
    // 13 = touche entrée
    if(_eventKeycode==13||_eventKeycode==3)
    {
      hideCompleteDiv(nb);
      return;

      var d=_inputField[nb];
      // on mets en place l'ensemble du champ texte en repoussant la selection
      if(_inputField[nb].createTextRange)
      {
        var t=_inputField[nb].createTextRange();
        t.moveStart("character",_inputField[nb].value.length);
        _inputField[nb].select()
      }
      else if (d.setSelectionRange){
        _inputField[nb].setSelectionRange(_inputField[nb].value.length,_inputField[nb].value.length)
      }
    }
    else 
    {

      // si on a pas pu agrandir le champ non selectionné, on le mets en place violemment.
      if(_inputField[nb].value!=V) {
        _inputField[nb].value=V;
      }
    }
  }
  // si la touche n'est ni haut, ni bas, on stocke la valeur utilisateur du champ
  if(_eventKeycode!=40&&_eventKeycode!=38)
  {
    // le champ courant n est pas change si key Up ou key Down
  	_currentInputFieldValue[nb]=V;
  }
  if(handleCursorUpDownEnter(_eventKeycode, nb)&&_eventKeycode!=0)
  {
    // si on a préssé une touche autre que haut/bas/enter

    PressAction(nb);
  }
}
  }



// Change la suggestion selectionné.
// cette méthode traite les touches haut, bas et enter
function handleCursorUpDownEnter(eventCode, nb){
  if(eventCode==40){
    highlightNewValue(_highlightedSuggestionIndex+1, nb);
    return false
  }else if(eventCode==38){
    highlightNewValue(_highlightedSuggestionIndex-1, nb);
    return false
  }else if(eventCode==13||eventCode==3){
    return false
  }
  return true
}

var _completeDivRows = 0;
var _completeDivDivList = null;
var _highlightedSuggestionIndex = -1;
var _highlightedSuggestionDiv = null;

// gère une touche pressée autre que haut/bas/enter
function PressAction(nb){

  _highlightedSuggestionIndex=-1;
  var suggestionList=_completeDiv[nb].getElementsByTagName("div");
  var suggestionLongueur=suggestionList.length;
  // on stocke les valeurs précédentes
  // nombre de possibilités de complétion
  _completeDivRows=suggestionLongueur;
  // possiblités de complétion
  _completeDivDivList=suggestionList;
  // si le champ est vide, on cache les propositions de complétion
  if(_currentInputFieldValue[nb]==""||suggestionLongueur==0){
    hideCompleteDiv(nb)
  }else{

    showCompleteDiv(nb);

  }
  var trouve=false;
  // si on a du texte sur lequel travailler
  if(_currentInputFieldValue[nb].length>0){
    var indice;
    // T vaut true si on a dans la liste de suggestions un mot commencant comme l'entrée utilisateur
    for(indice=0; indice<suggestionLongueur; indice++){
      if(getSuggestion(suggestionList.item(indice)).toUpperCase().indexOf(_currentInputFieldValue[nb].toUpperCase())==0) {
        trouve=true;
        break
      }
    }
  }
  // on désélectionne toutes les suggestions
  for(var i=0; i<suggestionLongueur; i++) {
    setStylePourElement(suggestionList.item(i),"AutoCompleteDiv");
  }
  // si l'entrée utilisateur (n) est le début d'une suggestion (n-1) on sélectionne cette suggestion avant de continuer
  /*if(trouve){
    _highlightedSuggestionIndex=indice;
    _highlightedSuggestionDiv=suggestionList.item(_highlightedSuggestionIndex);
  }else{*/
    _highlightedSuggestionIndex=-1;
    _highlightedSuggestionDiv=null
 // }
  var supprSelection=false;
  switch(_eventKeycode){
    // cursor left, cursor right, page up, page down, others??
    case 8:
    case 33:
    case 34:
    case 35:
    case 35:
    case 36:
    case 37:
    case 39:
    case 45:
    case 46:
      // on supprime la suggestion du texte utilisateur
      supprSelection=true;
      break;
    default:
      break
  }
  // si on a une suggestion (n-1) sélectionnée
  if(!supprSelection&&_highlightedSuggestionDiv){
    setStylePourElement(_highlightedSuggestionDiv,"AutoCompleteDivAct");
    var z;
    if(trouve) {
      z=getSuggestion(_highlightedSuggestionDiv).substr(0);
    } else {
      z=_currentInputFieldValue[nb];
    }
    if(z!=_inputField[nb].value){
      if(_inputField[nb].value!=_currentInputFieldValue[nb]) {
        return;
      }
      // si on peut créer des range dans le document
      if(_inputField[nb].createTextRange || _inputField[nb].setSelectionRange) {
       // _inputField[nb].value=z;
      }
      // on sélectionne la fin de la suggestion
      if(_inputField[nb].createTextRange){
        var t=_inputField[nb].createTextRange();
        t.moveStart("character",_currentInputFieldValue[nb].length);
        t.select()
      }else if(_inputField[nb].setSelectionRange){
        _inputField[nb].setSelectionRange(_currentInputFieldValue[nb].length,_inputField[nb].value.length)
      }
    }
  }else{
    // sinon, plus aucune suggestion de sélectionnée
    _highlightedSuggestionIndex=-1;
  }
}

var _cursorUpDownPressed = null;

// permet le blur du champ texte après que la touche haut/bas ai été pressé.
// le focus est récupéré après traitement (via le timeout).
function blurThenGetFocus(nb){
  _cursorUpDownPressed=true;
  _inputField[nb].blur();
  setTimeout("_inputField["+nb+"].focus();",10);
  return
}

// taille de la selection dans le champ input
function rangeSize(n){
  var N=-1;
  if(n.createTextRange){
    var fa=document.selection.createRange().duplicate();
    N=fa.text.length
  }else if(n.setSelectionRange){
    N=n.selectionEnd-n.selectionStart
  }
  return N
}

// taille du champ input non selectionne
function beforeRangeSize(n){
  var v=0;
  if(n.createTextRange){
    var fa=document.selection.createRange().duplicate();
    fa.moveEnd("textedit",1);
    v=n.value.length-fa.text.length
  }else if(n.setSelectionRange){
    v=n.selectionStart
  }else{
    v=-1
  }
  return v
}

// Place le curseur à la fin du champ
function cursorAfterValue(n){
  if(n.createTextRange){
    var t=n.createTextRange();
    t.moveStart("character",n.value.length);
    t.select()
  } else if(n.setSelectionRange) {
    n.setSelectionRange(n.value.length,n.value.length)
  }
}


// Retourne la valeur de la possibilite (texte) contenu dans une div de possibilite
function getSuggestion(uneDiv){
  if(!uneDiv) {
    return null;
  }
  return trimCR(uneDiv.getElementsByTagName('span')[0].firstChild.data)

}

// supprime les caractères retour chariot et line feed d'une chaine de caractères
function trimCR(chaine){
  for(var f=0,nChaine="",zb="\n\r"; f<chaine.length; f++) {
    if (zb.indexOf(chaine.charAt(f))==-1) {
      nChaine+=chaine.charAt(f);
    }
  }
  return nChaine
}

// Cache completement les choix de completion
function hideCompleteDiv(nb){
  _completeDiv[nb].style.visibility="hidden"
}

// Rends les choix de completion visibles
function showCompleteDiv(nb){
  _completeDiv[nb].style.visibility="visible";
  setCompleteDivSize(nb);
}

// Change la suggestion en surbrillance
function highlightNewValue(C, nb){
  if(!_completeDivDivList||_completeDivRows<=0) {
    return;
  }
  showCompleteDiv(nb);
  if(C>=_completeDivRows){
    C=_completeDivRows-1
  }
  if(_highlightedSuggestionIndex!=-1&&C!=_highlightedSuggestionIndex){
    setStylePourElement(_highlightedSuggestionDiv,"AutoCompleteDiv");
    _highlightedSuggestionIndex=-1
  }
  if(C<0){
    _highlightedSuggestionIndex=-1;
    _inputField[nb].focus();
    return
  }
  _highlightedSuggestionIndex=C;
  _highlightedSuggestionDiv=_completeDivDivList.item(C);
  setStylePourElement(_highlightedSuggestionDiv,"AutoCompleteDivAct");
  _inputField[nb].value=getSuggestion(_highlightedSuggestionDiv);
}

// Handler de resize de la fenetre
function onResizeHandler (nb){
  return function(event){
  // recalcule la taille des suggestions
  setCompleteDivSize(nb);
}
}

// Handler de blur sur le champ texte
function onBlurHandler (nb){
 return function(event){
  if(!_cursorUpDownPressed){
    // si le blur n'est pas causé par la touche haut/bas
    hideCompleteDiv(nb);
    // Si la dernière touche préssé est tab, on passe au bouton de validation
    if(_lastKeyCode==9){
      _submitButton.focus();
      _lastKeyCode=-1
    }
  }
  _cursorUpDownPressed=false
};
 }

// declenchee quand on clique sur une div contenant une possibilite
function divOnMouseDown(nb)
{
  return function(){
      _inputField[nb].value=getSuggestion(this);
  //_documentForm.submit()
  };
}

// declenchee quand on passe sur une div de possibilite. La div précédente est passee en style normal
function divOnMouseOver(nb)
{
 return function()
 {
  if(_highlightedSuggestionDiv)
  {
    setStylePourElement(_highlightedSuggestionDiv,"AutoCompleteDiv");
  }
  setStylePourElement(this,"AutoCompleteDivAct")
 };
}

// declenchee quand la sourie quitte une div de possiblite. La div repasse a l'etat normal
function divOnMouseOut(nb) {
  //return function(){

  setStylePourElement(this,"AutoCompleteDiv");
//};
  }



