var queryField;
var divName;
var ifName;
var lastVal = "";
var val = ""
var xmlHttp;
var cache = new Object();
var searching = false;
var globalDiv;
var divFormatted = false;

function InitQueryCode (queryFieldName, hiddenDivName){
  queryField = document.getElementById(queryFieldName);
  queryField.onblur = hideDiv;
  queryField.onkeydown = keypressHandler;
    
  queryField.autocomplete = "off";
  
  if (hiddenDivName)
    divName = hiddenDivName;
  else
    divName = "querydiv";
  ifName = "queryiframe";
  
  addToCache("", new Array());
  setTimeout("mainLoop()", 100);
}

function addToCache (queryString, resultArray1){
  cache[queryString] = new Array(resultArray1);
}

function getDiv (divID){
  if (!globalDiv) {
    // if the div doesn't exist on the page already, create it
    if (!document.getElementById(divID)) {
      var newNode = document.createElement("div");
      newNode.setAttribute("id", divID);
      document.body.appendChild(newNode);
    }
    
    // set the globalDiv reference
    globalDiv = document.getElementById(divID);
    
    // figure out where the top corner of the div should be, based on the
    // bottom left corner of the input field
    var x = queryField.offsetLeft;
    var y = queryField.offsetTop + queryField.offsetHeight;
    var parent = queryField;
    while (parent.offsetParent) {
      parent = parent.offsetParent;
      x += parent.offsetLeft;
      y += parent.offsetTop;
    }
    
    // add some formatting to the div, if we haven't already
    if (!divFormatted) {
        globalDiv.className = "agGemeenteDiv"
 
        globalDiv.style.position = "absolute";
        globalDiv.style.left = x + "px";
        globalDiv.style.top = y + "px";
        globalDiv.style.visibility = "hidden";
        globalDiv.style.zIndex = 10000;
      
      divFormatted = true;
    }
  }
  
  return globalDiv;
}

function showQueryDiv (queryString, resultArray1){
  var div = getDiv(divName);
  
  // remove any results that are already there
  while (div.childNodes.length > 0)
    div.removeChild(div.childNodes[0]);
  
  // add an entry for each of the results in the resultArray
  for (var i = 0; i < resultArray1.length; i++)
  {
    // each result will be contained within its own div
    var result = document.createElement("div");
    result.style.cursor = "pointer";
    result.style.padding = "2px 0px 2px 0px";
    _unhighlightResult(result);
    result.onmousedown = selectResult;
    result.onmouseover = highlightResult;
    result.onmouseout = unhighlightResult;

    var result1 = document.createElement("span");
    result1.className = "result1";
    result1.style.textAlign = "left";
    result1.style.fontWeight = "bold";
    result1.innerHTML = (resultArray1[i]+"").split(";")[0];   
    
    result.appendChild(result1);

    div.appendChild(result);
  }
  
  // if this resultset isn't already in our cache, add it
  var isCached = cache[queryString];
  if (!isCached)
    addToCache(queryString, resultArray1);
  
  // display the div if we had at least one result
  showDiv(resultArray1.length > 0);
}

function selectResult(){
  _selectResult(this);
}

function _selectResult(item){
  var spans = item.getElementsByTagName("span");
  if (spans) {
    for (var i = 0; i < spans.length; i++) {
      if (spans[i].className == "result1") {
        queryField.value = spans[i].innerHTML;
        lastVal = val = escape(queryField.value);
        searching = false;
        mainLoop();
        queryField.focus();
        showDiv(false);
        return;
      }
    }
  }
}

function highlightResult(){
  _highlightResult(this);
}

function _highlightResult(item){
  item.className = "agGemeenteDivItemHighlight";
}

function unhighlightResult(){
  _unhighlightResult(this);
}

function _unhighlightResult(item){
  item.className = "agGemeenteDivItemNormal";
}

function showDiv (show){
  var div = getDiv(divName);
  if (show)
    div.style.visibility = "visible";
  else
    div.style.visibility = "hidden";

  adjustiFrame();
}

function hideDiv (){
  showDiv(false);
}

function adjustiFrame(){
  if (!document.getElementById(ifName)) {
    var newNode = document.createElement("iFrame");
    newNode.setAttribute("id", ifName);
    newNode.setAttribute("src", "javascript:false;");
    newNode.setAttribute("scrolling", "no");
    newNode.setAttribute("frameborder", "0");
    document.body.appendChild(newNode);
  }
  
  iFrameDiv = document.getElementById(ifName);
  var div = getDiv(divName);
  
  try {
    iFrameDiv.style.position = "absolute";
    iFrameDiv.style.width = div.offsetWidth;
    iFrameDiv.style.height = div.offsetHeight;
    iFrameDiv.style.top = div.style.top;
    iFrameDiv.style.left = div.style.left;
    iFrameDiv.style.zIndex = div.style.zIndex - 1;
    iFrameDiv.style.visibility = div.style.visibility;
  } catch(e) {
  }
}

function keypressHandler (evt){
  // don't do anything if the div is hidden
  var div = getDiv(divName);
  if (div.style.visibility == "hidden")
    return true;
  
  // make sure we have a valid event variable
  if(!evt && window.event) {
    evt = window.event;
  }
  var key = evt.keyCode;
  
  // if this key isn't one of the ones we care about, just return
  var KEYUP = 38;
  var KEYDOWN = 40;
  var KEYENTER = 13;
  var KEYTAB = 9;
  
  if ((key != KEYUP) && (key != KEYDOWN) && (key != KEYENTER) && (key != KEYTAB))
    return true;
  
  // get the span that's currently selected, and perform an appropriate action
  var selNum = getSelectedSpanNum(div);
  var selSpan = setSelectedSpan(div, selNum);
  
  if ((key == KEYENTER) || (key == KEYTAB)) {
    if (selSpan)
      _selectResult(selSpan);
    evt.cancelBubble=true;
    return false;
  } else {
    if (key == KEYUP)
      selSpan = setSelectedSpan(div, selNum - 1);
    if (key == KEYDOWN)
      selSpan = setSelectedSpan(div, selNum + 1);
    if (selSpan)
      _highlightResult(selSpan);
  }
  
  showDiv(true);
  return true;
}

function getSelectedSpanNum (div){
  var count = -1;
  var spans = div.getElementsByTagName("div");
  if (spans) {
    for (var i = 0; i < spans.length; i++) {
      count++;
      if (spans[i].style.backgroundColor != div.style.backgroundColor)
        return count;
    }
  }
  
  return -1;
}

function setSelectedSpan (div, spanNum){
  var count = -1;
  var thisSpan;
  var spans = div.getElementsByTagName("div");
  if (spans) {
    for (var i = 0; i < spans.length; i++) {
      if (++count == spanNum) {
        _highlightResult(spans[i]);
        thisSpan = spans[i];
      } else {
        _unhighlightResult(spans[i]);
      }
    }
  }
  
  return thisSpan;
}