// JScript File

var Autocomplete = Class.create(); 
Autocomplete.prototype = { 
    
    initialize : function(options) { 

	    /* **********************************************************************************************/		
	    /* first set all options to override standard vars **********************************************/
	    /* **********************************************************************************************/
	    this.setOptions(options);
	    Object.extend(this.options, options);
        if(this.options.update==false)this.getData();
        this.setEvent();
    },
    
    getData: function(){
        var request = new Ajax.Request(this.options.url, {method: 'get',onSuccess: function(transport) {this.options.data = transport.responseText.evalJSON();}.bind(this)});        
    },
    
    setEvent: function(){
        Event.observe(this.options.textfield, 'keyup', this.checkKey.bind(this));
        Event.observe(document.body, 'click', this.hideList.bind(this));
        
    },
    
    checkKey: function(event){
        var key = event.which || event.keyCode;
        switch (key) {
        
            case Event.KEY_DOWN: this.setSelection(-1);
            break;
            
            case Event.KEY_UP: this.setSelection(1);
            break;      
                 
            default: this.checkValue(event);
        }
                
    },
    
    checkValue: function(event){
        
        var key = event.which || event.keyCode;
        var input = Event.element(event).value.toLowerCase();
        if(key==13){this.selectItem(null);return;}
        
        if(input.length>=this.options.minchar)
        {
            if(this.options.data!=null)
            {
                var r = new Array();
                this.options.data.each(function(e){
                    var t = e.place.toLowerCase();
                    var c = e.count;  
                    var i = new Array(t, c);
                    if(t.indexOf(input)>-1)r.push(i);
                });
                
                this.showResult(r);
            }
        }
    },
    
    setSelection: function(d){
    
        if($('ac_' + this.options.textfield)!=null)
        {
            var ul = $('ac_' + this.options.textfield);
            var selected = ul.select('li.selected');
            if(selected.length>0){
                if(d==-1)_selected = selected[0].next();
                else if(d==1) _selected = selected[0].previous();
                selected.each(function(s){s.removeClassName('selected');});
            }
            else _selected = ul.down();
            
            _selected.addClassName('selected');
           $(this.options.textfield).value =  _selected.id;
        }
    
        
    },
    
    hideList: function()
    {
        if($('ac_' + this.options.textfield)!=null)$('ac_' + this.options.textfield).remove();
    },
    
    selectItem: function(e)
    {
        if(e==null){
            var selected = $('ac_' + this.options.textfield).select('li.selected');
            if(selected.lenght>0)$(this.options.textfield).value = selected[0].id; 
        }else $(this.options.textfield).value = Event.element(e).id;
        this.hideList();
        
    },
        
    showResult: function(a){
        
        if(a.length>0){       
            var ul = new Element('ul', {'id':'ac_' + this.options.textfield,'class':'ajaxDropdownList'});
            a.each(function(p){
                var li = new Element('li', {id:p[0],'class':'ajaxItem'}).update(p[0] + ' (' + p[1] + ')');
                li.observe('click', this.selectItem.bind(this)); 
                ul.insert(li);
            }.bind(this));
            
            ul.style.left = $(this.options.textfield).positionedOffset().left + 'px';
            ul.style.top = ($(this.options.textfield).positionedOffset().top + 18) + 'px';
            
            if($('ac_' + this.options.textfield)!=null)$('ac_' + this.options.textfield).remove();
            $(this.options.container).insert(ul);
        }else if($('ac_' + this.options.textfield)!=null)$('ac_' + this.options.textfield).remove();
    },
	
	validateValue: function(searchstring)
	{
	    var valid = false;
        this.options.data.each(function(e){
            var t = e.place.toLowerCase();
            if(t==searchstring.toLowerCase()){
                valid = true; 
                throw $break;
            }
        });
        
       return valid;
	},
	             
	setOptions: function(options)
	{
		this.options = {
			textfield:'txtLocatie',
			url:'../assets/ajax/GetPlaces.aspx',
			update:false,
			container: 'homeSearchForm',
			data:null,
			minchar:3
		}
		Object.extend(this.options, options || {});
	}
	


    
    
}