/*
 * class IndexedSearch
 * @require mootools js framework
 * @author Steffen Mächtel <s.maechtel@netzbewegung.com>
 * 
 * elements required (with id):
 * > input text id="search_test"
 * > input submit id="search_submit"
 * > div for autocompletet id="search_autocomplete"
 */

IndexedSearch = new Class({
    initialize: function(objRoot, strDefaultValue, strURL) 
	{	
		this.objRoot         = objRoot;
		this.objBody    	 = $$('body')[0];
		this.strDefaultValue = strDefaultValue;
		this.strURL			 = strURL;
		this.intDelayID      = 0;
		this.intCurrentFocus = -1;
		
		/*
		 * get elements
		 */
		this.objText   		 = $('search_text');
		this.objSubmit 		 = $('search_submit');
		this.objAutoComplete = $('search_autocomplete');
		
		/*
		 * disable default autocomplete from browser
		 */
		this.objText.set('autocomplete', 'off'); 
		
		/*
         * add events
         */
		this.objText.addEvent('focus',   this.textFocus.create({bind: this}));
		this.objText.addEvent('blur',    this.textBlur.create({bind: this}));
		this.objText.addEvent('keydown', this.moveAutoComplete.create({bind: this, event: true}));
		this.objText.addEvent('keyup',   this.showAutoComplete.create({bind: this, event: true}));
		this.objRoot.addEvent('submit',  this.showLoader);
	}
});

IndexedSearch.implement({
	showLoader: function()
	{
		NB.Effect.loader(true);
	},
	
	textFocus: function()
	{	
		if (this.objText.get('value') == this.strDefaultValue) {
			this.objText.set('value', '');
		}
	},
	
	textBlur: function()
	{	
		if (this.objText.get('value') == '') {
			this.objText.set('value', this.strDefaultValue);
		}
	},
	
	hideAutoComplete: function()
	{
		this.objAutoComplete.setStyle('display', 'none');
	},
	
	moveAutoComplete: function(objEvent)
	{	
		/*
		 * 13: return
		 * 38: arrow up
		 * 40: arrow down
		 */
		
		if (objEvent.code != 38 && objEvent.code != 40 && objEvent.code != 13) {
			return;
		}
		
		if (objEvent.code == 13) {
			if (this.intCurrentFocus != -1) {
				this.selectValue(this.arrList[this.intCurrentFocus].get('html'));
			}
			return;
		}
		
		
		this.intCurrentFocus = -1;
		
		for (var i = 0; i < this.arrList.length; i++) {
			if (this.arrList[i].hasClass('hover')) {
				this.intCurrentFocus = i
				this.arrList[i].removeClass('hover');
			}
		}
		
		if (objEvent.code == 40) {
			if (this.intCurrentFocus + 1 == this.arrList.length) {
				this.intCurrentFocus = -1;
			}
			this.intCurrentFocus++;
			this.arrList[this.intCurrentFocus].addClass('hover');;
		}
		
		if (objEvent.code == 38) {
			if (this.intCurrentFocus == -1) {
				this.intCurrentFocus = this.arrList.length - 1;
			}
			this.intCurrentFocus--;
			this.arrList[this.intCurrentFocus].addClass('hover');;
		}

	},
	
	showAutoComplete: function (objEvent)
	{	
		/*
		 * 13: return
		 * 38: arrow up
		 * 40: arrow down
		 */
		if (objEvent.code == 38 || objEvent.code == 40 || objEvent.code == 13) {
			return;
		}
		
		/*
		 * nothing to show
		 */
		if (this.objText.get('value').length < 2 || this.objText.get('value') == this.strDefaultValue) {
			this.hideAutoComplete();
			return;
		}

		/* 
		 * body event click: hide layer
		 * > current select has changed
		 * > is used by other classes (Select, ...)
		 */
        if (this !== this.objBody.obj) {
            // fire event
            this.objBody.fireEvent('click');
            
            // add event on body from current select
            this.objBody.obj = this;
			this.objBody.removeEvents('click');
            this.objBody.addEvent('click', function (objEvent) {
                this.obj.hideAutoComplete();
            });
        }

		/*
		 * delay
		 */
		if (this.intDelayID) {
			$clear(this.intDelayID);
		}
		
		var fncDelay = function() {
			this.showAutoCompleteReal();
		}
		
		this.intDelayID = fncDelay.delay(500, this);
	},
	
    showAutoCompleteReal: function ()
    {
		strValue = this.objText.get('value');

		/*
		 * send ajax request and update search_autocomplete div
		 */
		var objOption = {
			url: this.strURL,
			async: true,
			update: this.objAutoComplete,
			onComplete: this.complete.bind(this)
		};
		
		new Request.HTML(objOption).get('?eID=tx_nbsearchbox_pi1_ajax&action=getAutoComplete&value=' + strValue);
		
		/*
		 * show layer
		 */
		if (this.objAutoComplete.get('text')) {
			this.objAutoComplete.setStyle('display', 'block');
		} else {
			this.objAutoComplete.setStyle('display', 'none');
		}
		
    },
	
	complete: function()
	{
		/*
		 * add events on result list
		 */
		objList = this.objAutoComplete.getChildren()[0];
		if (objList) {
			this.arrList = objList.getChildren();
			/*
			 * add "this" as attribute "obj" to all objects with events (reference)
			 * add Events
			 */
			for (intIndex in this.arrList) {
				objElement = this.arrList[intIndex];
				objElement.obj = this;
			}
			
			/*
			 * add Event
			 */
			this.arrList.each(function(objElement){
				objElement.addEvent('focus', function(){
					this.addClass('hover');
				});
				
				objElement.addEvent('mouseover', function(){
					this.addClass('hover');
				});
				
				objElement.addEvent('mouseout', function(){
					this.removeClass('hover');
				});
				
				objElement.addEvent('click', function(objEvent){
					objEvent.stop();
					this.obj.selectValue(this.get('html'));
				});
				
			});
		}
	},
	
	selectValue: function (strValue)
	{
		//strValue = strValue.replace(/ <span class="*hit"*>.*<\/span>/i, '');

		/*
		 * set value
		 */
		this.objText.set('value', strValue);
		
		/*
		 * hide layer
		 */
		this.objAutoComplete.setStyle('display', 'none');
		
		/*
		 * submit form
		 */
		
		this.objRoot.fireEvent('submit');
		this.objRoot.submit();
	}
});


