$(document).ready(function(){
	$("#p").keyup(function(){
		hintOptionRender();
	});	
	$("#p").keydown(function(event){
		return hintOptionKey(event);
	});	
	$("#p").focus(function(){
		clearTimeout(hintTimer);
		$("#hintOption").css('display', 'block');
	});
	$("#p").blur(function(){
		hintTimer = setTimeout("$('#hintOption').css('display', 'none');", 500);
	});
	$("#p").attr('autocomplete', 'off');
	var offset = $("#p").offset();
	//$("#hintOption").css('top', offset.top + $("#p").outerHeight() );
	//$("#hintOption").css('left', offset.left);
	//$("#hintOption").css('width', $("#p").outerWidth());
});
var hintOption = new Array();
var hintLastValue = '';
var hintLastLength = 0;
var hintOptionSelected = null;
var hintCacheKey = [];
var hintCacheValue = [];
var hintTimer;
function hintCacheIs(sKey){
	var i;
	for(i=0; i<hintCacheKey.length; i++){
		if(hintCacheKey[i].toLowerCase() == sKey.toLowerCase()){
			return true;
		}
	}
	return false;
}
function hintCacheSet(sKey, aValue){
	if(hintCacheIs(sKey)){
		return;
	}
	hintCacheKey[hintCacheKey.length] = sKey;
	hintCacheValue[hintCacheValue.length] = aValue.join('|');
}
function hintCacheGet(sKey){
	var iIndex = -1;
	var i;
	for(i=0; i<hintCacheKey.length; i++){
		if(hintCacheKey[i].toLowerCase() == sKey.toLowerCase()){
			return hintCacheValue[i].split('|');
		}
	}
}
function hintOptionInsert(user){
	var sValue = $("#p").val();
	var aValue = sValue.split(',');
	aValue[aValue.length-1] = user;
	var i;
	var sOut = '';
	for(i=0; i<aValue.length; i++){
		if(i != aValue.length-1){
			sOut += hintOptionTrim(aValue[i])+'';
		}
		else{
			sOut += aValue[i]+'';
		}
	}
	hintLastValue = '';
	hintLastLength = sOut.length;
	hintOption = [];
	hintOptionRender2();
	$("#p").val(sOut);
}
function hintOptionGrep(x){
	var aUser = x.split(',');
	return hintOptionTrim(aUser[aUser.length-1]);
}
function hintOptionTrim(x){
	var i;
	var iLeft = 0;
	for(i=0 ; i<x.length; i++){
		if(x.charAt(i) == ' '){
			iLeft++;
		}
		else{
			break;
		}
	}
	x = x.substring(iLeft, x.length);
	var iRight = 0;
	for(i=x.length-1 ; i>0; i--){
		if(x.charAt(i) == ' '){
			iRight++;
		}
		else{
			break;
		}
	}
	x = x.substring(0, x.length - iRight);
	return x;
}
function hintOptionRender(){
	var sSuggestLast = hintLastValue;
	var sSuggestLength = hintLastLength;
	var sS = $('#p').val();
	hintLastLength = sS.length;
	hintLastValue = hintOptionGrep(sS);
	var sSuggest = hintLastValue;
	if(sSuggest.length > 0){
		if((sSuggestLast.toLowerCase() != sSuggest.toLowerCase() || hintLastValue == '') && sSuggestLength != hintLastLength){
			if(hintCacheIs(sSuggest)){
				hintOption = hintCacheGet(sSuggest);
				hintOptionRender2();
			}
			else if(
				sSuggest.length > sSuggestLast.length 
				&& sSuggestLast.toLowerCase() == sSuggest.substring(0, sSuggestLast.length).toLowerCase()
				&& hintOption.length < 10
				&& hintOption.length > 0
				&& sSuggestLast != ''
			){
				var a = [];
				var i;
				for(i=0; i<hintOption.length; i++){
					if(sSuggest.toLowerCase() == hintOption[i].substring(0, sSuggest.length).toLowerCase()){
						a[a.length] = hintOption[i];
					}
				}
				hintOption = a;
				hintOptionRender2();
			}
			else{

				$.get(
					"/etc/ajax_product_suggest.php",
					{q: sSuggest},
					function(x){
						if(x != ""){
							hintOption = x.split('|');
							hintCacheSet(hintLastValue, hintOption);

						}
						else{
							hintOption = [];
						}
						hintOptionRender2();
						hintCacheSet(hintLastValue, hintOption);
					}
				);
			}
		}
	}
	else{
		hintOption = [];
		hintOptionRender2(0);
	}
}
function hintOptionKey(event){
	if(hintOption.length > 0 && $("#hintOption").css('display') == 'block'){
		if(event.keyCode == 40){
			if(hintOptionSelected != null){
				hintOptionSelected = (hintOptionSelected + 1) % hintOption.length;
			}
			else{
				hintOptionSelected = 0;
			}
			hintOptionSelect($("#hintOption div").get(hintOptionSelected));
			return false;
		}
		else if(event.keyCode == 38){
			if(hintOptionSelected != null){
				hintOptionSelected--;
				if(hintOptionSelected < 0 ){
					hintOptionSelected = hintOption.length-1;
				}
			}
			else{
				hintOptionSelected = hintOption.length-1;
			}
			hintOptionSelect($("#hintOption div").get(hintOptionSelected));
			return false;
		}
		else if(event.keyCode == 13){
			if(hintOptionSelected != null){
				hintOptionInsert(hintOption[hintOptionSelected]);
			}
			return false;
		}
	}
}
function hintOptionRender2(){
	var sOut = '';
	hintOptionSelected = null;
	for(i=0; i<hintOption.length; i++){
		var str = hintOption[i];
		var sText = str.replace(hintLastValue, '<strong>'+hintLastValue+'</strong>');
		var sText = '<strong>'+hintOption[i].substring(0, hintLastValue.length)+'</strong>'+hintOption[i].substring(hintLastValue.length, hintOption[i].length);
		
		sOut += '<div onclick="hintOptionInsert(\''+(hintOption[i]+'').replace(/([\\"'])/g, "\\$1").replace(/\u0000/g, "\\0")+'\')" style="border:1px solid #eee;border-top:0px;cursor:pointer; background:#fff;padding:4px 6px;" onmouseover="hintOptionSelected = '+i+';hintOptionSelect(this);" onmouseout="hintOptionUnSelect()">'+sText+'</div>';
	}
	$("#hintOption").html(sOut);
}
function hintOptionUnSelect(){
	$("#hintOption div").each(function(){
		$(this).css('background', '#fff');
		$(this).css('color', '#000');
	});
}
function hintOptionSelect(x){
	hintOptionUnSelect();
	$(x).css('background', '#1D89DE');
	$(x).css('color', '#fff');
}