function Autocompleter(objname, datadiv, containerId, inputId, formName) {

// local variables
var c = 0;
var selected = '';
var data = new Array();
var cur_item = -1;
var count = 0;
var num = 1;

// private functions
function elem(name, attrs, style, text) {
    var e = document.createElement(name);
    if (attrs) {
        for (key in attrs) {
            if (key == 'class') {
                e.className = attrs[key];
            } else if (key == 'id') {
                e.id = attrs[key];
            } else if(key == 'onclick'){
                e.onclick = new Function(attrs[key]);
            }else if(key == 'onmouseover'){
                e.onmouseover = new Function(attrs[key]);
            }else if(key == 'onmouseout'){
                e.onmouseout = new Function(attrs[key]);
            } else {
                e.setAttribute(key, attrs[key]);
            }
        }
    }
    if (style) {
        for (key in style) {
            e.style[key] = style[key];
        }
    }
    if (text) {
        e.appendChild(document.createTextNode(text));
    }
    return e;
}
function creatSelect(answer)
{
    if(document.getElementById(containerId) != null ){
        var e= document.getElementById(datadiv);
        var e1 = document.getElementById(containerId);
        if(e != null ){
		while(e.childNodes.length>0)e.removeChild(e.childNodes[0]);
	}
	while(e1.childNodes.length>0)e1.removeChild(e1.childNodes[0]);

	c = 0;
	count = 0;
	cur_item = -1;
    }

    data = answer.split('//');
    count=data.length-1;

    if(count > 10) count = 10;

    if(count <= 0) return;

    var m_style = new Array();
    m_style['zIndex']        = '110';
    m_style['visibility'] = 'visible';

    document.getElementById(containerId).appendChild(elem('div',{'id':datadiv,'class':'qsContainer active'},m_style,0));
    var parent = document.getElementById(datadiv);

    parent.appendChild(elem('div',{'class':'qsContainer-top'}));
    
    var searchValue = document.getElementById(inputId).value;

    for(var x=0; x<count; x++){
	    var attr  = new Array();
	    var style = new Array();
	    attr['onclick']     = "var resDiv1=document.getElementById('" + datadiv + "');while(resDiv1.childNodes.length>0)resDiv1.removeChild(resDiv1.childNodes[0]);var resDiv=document.getElementById('" + containerId + "');while(resDiv.childNodes.length>0)resDiv.removeChild(resDiv.childNodes[0]); var result=document.getElementById('" + inputId + "');result.value =" + objname + ".Data()["+ x +"];" + objname + ".setC(0);" + objname + ".setCurItem(-1);document." + formName + ".submit();";
	    attr['onmouseover'] = "if(" + objname + ".C()==1){document.getElementById('span" + x*num + "').className='qsElem-over';selected=" + x + ";}";
	    attr['onmouseout']  = "if(" + objname + ".C()==1){document.getElementById('span" + x*num + "').className='qsElem';selected='';return true;}";
	    attr['id']          = "span" + x*num;
	    attr['class']       = "qsElem";

	    style['visibility'] = 'visible';
	    style['zIndex']     = '112';
	    
      var elem1 = elem('div',attr,style,data[x]);
      elem1.innerHTML=elem1.innerHTML.replace(eval("/"+searchValue+"/i"), '<span style="color:#900;">'+searchValue+'</span>');
		  parent.appendChild(elem1);
 		  c = 1;
   }

   parent.appendChild(elem('div',{'class':'qsContainer-bottom'}));
   num++;
}

function col(x)
{
	if(c==1)
	{
	    eval('span'+x*(num-1)).className='qsElem-over';
       selected=x;
	}
}

function col_1(x)
{
	if(c==1)
	{
	    eval('span'+x*(num-1)).className='qsElem';
	    selected='';
	    return true;
	}
}

function enter_data(x)
{
    var keyword = document.getElementById(inputId).value = data[x];
    var resDiv1=document.getElementById(datadiv);
    while(resDiv1.childNodes.length>0)resDiv1.removeChild(resDiv1.childNodes[0]);
    var resDiv=document.getElementById(containerId);
    while(resDiv.childNodes.length>0)resDiv.removeChild(resDiv.childNodes[0]);

    cur_item = -1;
    c=0;
}

function hide(){
  if(c!=0){
    var resDiv1=document.getElementById(datadiv);
    while(resDiv1.childNodes.length>0)resDiv1.removeChild(resDiv1.childNodes[0]);

    var resDiv=document.getElementById(containerId);
    while(resDiv.childNodes.length>0)resDiv.removeChild(resDiv.childNodes[0]);
    cur_item = -1;
    c=0;
  }
}

function getData(dataSource)
{
    var XMLHttpRequestObject = false;
    if (window.XMLHttpRequest){
        XMLHttpRequestObject = new XMLHttpRequest();
    }else if (window.ActiveXObject){
        XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHTTP");
    }

    if(XMLHttpRequestObject){
        XMLHttpRequestObject.open("GET", dataSource);

        XMLHttpRequestObject.onreadystatechange = function(){
            if (XMLHttpRequestObject.readyState == 4 && XMLHttpRequestObject.status == 200){
                var answerDiv=XMLHttpRequestObject.responseText;
                creatSelect(answerDiv);
                delete XMLHttpRequestObject;
                XMLHttpRequestObject = null;
            }
        }
        XMLHttpRequestObject.send(null);
    }
}

// public functions
this.getKey = function(keyEvent) {
   keyEvent = (keyEvent) ? keyEvent: window.event;
   input = (keyEvent.target) ? keyEvent.target : keyEvent.srcElement;
   if (keyEvent.type != "keyup") return;


    if(keyEvent.keyCode==13){

      }else{
        if(keyEvent.keyCode==38){
        	if(cur_item>-1) col_1(cur_item);
        	if(cur_item>0)  col(--cur_item);
        }else{
          if(keyEvent.keyCode==40){
            if(count-1<=cur_item) return;
            if(cur_item>-1) col_1(cur_item);
            col(cur_item+1);
            cur_item++;
          }else{
            if(keyEvent.keyCode != 255){
               if(c == 1){
                 var resDiv1=document.getElementById(datadiv);
                 while(resDiv1.childNodes.length>0)resDiv1.removeChild(resDiv1.childNodes[0]);

               	var resDiv=document.getElementById(containerId);
	       	while(resDiv.childNodes.length>0)resDiv.removeChild(resDiv.childNodes[0]);
	       	cur_item = -1;
	       	c=0;
	       }

                var edit=document.getElementById(inputId);
                var value = edit.value;
                getData("includes/advanced_search/ajax_drop_down_list_with_products/?query=" + value);
            }
          }
        }
    }
}
this.onPress = function(keyEvent){
  if(keyEvent.keyCode==13){
        if(cur_item>-1) enter_data(cur_item);
  }
}

this.hide_all = function(){
   hide();
}

this.C = function(){
   return c;
}

this.Data = function(){
   return data;
}

this.setC = function(newC)
{
   c = newC;
}

this.setCurItem = function(newCurItem)
{
   cur_item = newCurItem;
}

}

function AutocompleterTracker() {
  var instances = new Array();
  this.add = function(instance) {
    instances[instances.length] = instance;
  }
  this.hideAll = function() {
    for(var i = 0; i < instances.length; i++) {
      eval(instances[i]+'.hide_all()');
    }
  }
}