

var autoComplete = new Class ({

    _searchId: '',
    _search: null,

    _suggestionId: '',
    _suggestion:  null,

    _req: null,

    _options:
        { url               : ''
        , minInputLength    : 3
        },

    initialize: function(searchId, suggestionId) {
        this._searchId = searchId;
        this._search = $(searchId);

        this._suggestionId = suggestionId;
        this._suggestion = $(suggestionId);

        this._req = new Request({
            url:      WEB_URL + 'search/autocomplete',
            method:   'get',
            onSuccess: this.showSuggestion.bind(this),
            link:     'cancel'
        });


        this._search.addEvents({
            'focus':    this.doFocus.bind(this),
            'blur':     this.doBlur.bind(this),
            'keyup':    function() {
                if (this._search.value.length >= this._options.minInputLength) {
                    this.doSuggest();
                }
            }.bind(this)
        });

    },

    doFocus: function() {
	    Logger.trace('searchfieldclicked');
        this._search.select();
    },

	doHideSuggestions: function(){
		this._suggestion.setStyle('display', 'none');
	},
	
    doBlur: function() {
	     this.delayTimer = this.doHideSuggestions.delay(200, this);
    },

    doSuggest: function() {
        Logger.trace('dorequest!');
        this._req.send('keywords='+this._search.value);
    },

    showSuggestion: function (responseText, responseXML) {
        Logger.trace('showsuggestion!');
        this._suggestion.set('html', responseText);
        this._suggestion.setStyle('display', 'block');
        //Logger.trace(responseXML);

        //this._suggestion.setHTML(responseText);
    }



});