
function AutoSuggest()
{
    this.oTextField = null;
    this.oSuggestLyr = null;
    this.aSuggestions = [];
    this.sSuggestedValue = null;
    this.iNumSuggestion = 10;
    this.iKeyCheck = 100;
    this.iSelOption = -1;
    this.oTimer = null;
    this.sCurValue = null;
    this.sSugPrefix = 'sug_';
    this.oForm = null;
    this.bASShow = false;
    this.sDefVal = 'Search...';
    this.bFormSubmit = false;
    this.sBaseUrl = _GL.getBaseUrl();
    this.sAjaxBaseUrl = this.sUrl = null;
    this.init = function()
    {
        this.sAjaxBaseUrl = typeof sABUrl != 'undefined' ? sABUrl : this.sBaseUrl;
        this.sUrl = this.sAjaxBaseUrl + 'json/jsearch.aspx?keyword=<#1#>&action=suggest&count=' + this.iNumSuggestion;
        this.oForm = document.forms['search'];
        var oT = this.oTextField = _GL.getUIElem(sAutoSuggestText);
        if (!oT)
            return;
        var aDims = _GL.getOffsetLT(sAutoSuggestText),
            oDiv = _GL.createElement('div');
        oDiv.id = 'sSuggestion';
        oDiv.className = 'autoSugOuter';
        oDiv.style.width = (oT.offsetWidth - 18) + 'px';
        oDiv.style.left = (aDims[0] + 10) + 'px';
        oDiv.style.top = (aDims[1]+oT.offsetHeight-2) + 'px';
        document.body.appendChild(oDiv);
        
        for (var i=0; i<this.iNumSuggestion; i++)
        {
            var oSug = _GL.createElement('div');
            oSug.id = this.sSugPrefix + i;
            oSug.iIndex = i;
            oSug.className = 'autoSugOptions';
            
            oSug.onmouseover = function()
            {
                this.className = 'autoSugOptionOver';
                oAutoSug.sSuggestedValue = this.innerHTML;
                oAutoSug.iSelOption = this.iIndex;
            }
            oSug.onmouseout = function()
            {
                this.className = 'autoSugOptions';
            }
            oSug.onclick = function()
            {
                oAutoSug.oTextField.value = oAutoSug.sSuggestedValue;
                oAutoSug.sCurValue = oAutoSug.sSuggestedValue;
                oAutoSug.hide();
            }
            oDiv.appendChild(oSug);
            this.aSuggestions[this.aSuggestions.length] = oSug;
        }
        
        this.oSuggestLyr = oDiv;
        
        oT.onkeyup = function(pEvent)
        {
            var evt = pEvent||event, iKeyCode = evt.keyCode + '';
            
            if (oAutoSug.bFormSubmit || iKeyCode.hasAny('38','40','13'))
                return;
                
            if (this.value.length <= 1)
                oAutoSug.hide();
            clearTimeout(oAutoSug.oTimer);
            oAutoSug.oTimer = setTimeout('oAutoSug.checkSuggestion()', 100);
        }
        
        oT.onfocus = function()
        {
            if (this.value.is(oAutoSug.sDefVal))
                this.value = "";
        }
        oT.onblur = function()
        {
            if (this.value == "")
                this.value = oAutoSug.sDefVal;
        }
        
    }
    
    this.checkSuggestion = function()
    {
        if (!this.oTextField.value.is(this.sCurValue))
            this.reqSuggestion();
    }
    
    this.reqSuggestion = function()
    {
        var oAjax = new Ajax('getSuggestion', (this.sUrl.replaceTokens(this.oTextField.value) + '&rd='+_GL.getRandomNumber()), true, ['oAutoSug.processSuggestion']);
            oAjax.iResponseType = oAjax.RESPONSE_JSON;
            oAjax.send();
    }
    
    this.processSuggestion = function(pResp)
    {
        var oD = pResp.oJSON, len = oD ? oD.length : 0, iNum = this.iNumSuggestion;
        if (len > iNum)
            len = iNum;
        if (len > 0)
        {
            this.oSuggestLyr.style.display = 'block';
            this.bASShow = true;
            for (var i=0; i<len; i++)
            {
                var oL = this.aSuggestions[i];
                oL.innerHTML = oD[i];
                oL.style.display = 'block';
            }
            
            document.onkeydown = oAutoSug.onKeyDown;
        }
    }
    
    this.hide = function()
    {
        if (!this.bASShow)
            return;
        
        if (oAutoSug.oSuggestLyr)
            oAutoSug.oSuggestLyr.style.display = 'none';
        
        var oL = oAutoSug.aSuggestions[oAutoSug.iSelOption];
        if (oL)
            oL.className = 'autoSugOptions';
        
        oAutoSug.iSelOption = -1;
        clearTimeout(oAutoSug.oTimer);
        
        if (typeof oReader != 'undefined')
            document.onkeydown = oReader.navigateFeed;
        else
            document.onkeydown = null;
            
        this.bASShow = false;
    }
    
    this.onKeyDown = function(pEvent)
	{
		var evt = pEvent||event, oT = oAutoSug.oTextField;		

		switch(evt.keyCode) 
		{ 	
			case 38:
			case 40:
				oAutoSug.nextSug(evt.keyCode); 
				return false;	
			  	break;
			case 13:
			    if(oAutoSug.sSuggestedValue)
			        oT.value = oAutoSug.sSuggestedValue;
			    oAutoSug.sCurValue = oAutoSug.sSuggestedValue;
			    oAutoSug.hide();
			    
			    if (oT.value.length > 1)
			    {
			        oT.onblur = null;
			        oT.onkeyup = null;
			        //oAutoSug.bFormSubmit = true;
			        oAutoSug.oForm.submit();
			    }
			    return;
			    break;
		}		
	}
	
	this.nextSug = function(pKeyCode)
	{
	    var oT = this.oTextField, iSO = this.iSelOption, 
	        oCL = _GL.getUIElem(this.sSugPrefix+this.iSelOption);
		    
	    if (oCL)
	        oCL.className = 'autoSugOptions';
					
		var l = this.iNumSuggestion;
		iSO = pKeyCode == 40 ? iSO + 1 : iSO - 1;
		iSO = l == iSO ? 0: iSO < 0 ? l - 1 : iSO;
		this.iSelOption = iSO;
		var oL = _GL.getUIElem(this.sSugPrefix+this.iSelOption);
		if (oL)
		{
			oL.className = 'autoSugOptionOver';
			this.sSuggestedValue = oL.innerHTML;
		}
	}
    
    this.onAfterLoad = function()
    {
        oAutoSug.init();
    }
}
var sAutoSuggestText = 'skeyword';
var oAutoSug = new AutoSuggest();
_GL.addOnLoadListener(oAutoSug.onAfterLoad);

document.onclick = function()
{
    oAutoSug.hide();
    if (typeof oMyStuff != 'undefined')
        oMyStuff.hideDD();
    
    if (typeof oFilterDD != 'undefined')
        oFilterDD.hideDD();
}
