//////////////////////////////////////////////////////////////
// 제시어(자동완성) 기능을 위한 자바스크립트 코드 (2010.11) //
//////////////////////////////////////////////////////////////

/////////////////////////////////////////////////////////////////
// 제시어 기능을 사용하기 위해 초기화하는 함수                 //
// 제시어 기능을 사용하는 Body 태그의 onLoad 이벤트에서 처리함 //
/////////////////////////////////////////////////////////////////

// 제시어 기능을 위한 전역 변수들
var cm_suggest_check_first;
var cm_suggest_last_keyword;
var cm_suggest_loop_send_keyword;
var cm_suggest_list;
var cm_suggest_result_num;
var cm_suggest_cursor;
var cm_suggest_keyword_location;	// 제시어를 사용할 Keyword 텍스트필드의 위치 정보
var cm_suggest_select_bg_color;		// 제시어 리스트에서 하이라이트되었을 때의 색깔
var cm_suggest_submit_function;		// 제시어를 선택하고 검색버튼을 눌렀을 때 실행되어야 하는 Submit함수명
var cm_suggest_div_id;				// 제시어 결과가 보여야 하는 div의 id
var cm_suggest_div_list_id;			// 제시어 리스트가 보여야 하는 div의 id
var cm_suggest_flag;				// 제시어 기능을 사용하는지 하지 않는지에 대한 flag
var cm_suggest_show_flag;			// 제시어 리스트 박스의 현재 상태를 나타내는 flag
var cm_suggest_body_click_flag;		// 제시어 기능을 사용하는 페이지의 Body 부분을 클릭했는지를 나타내는 flag
var cm_suggest_search_flag;			// 검색어를 입력하고 엔터키나 검색 버튼을 눌렀을 때를 나타내는 flag
var cm_suggest_keyword_obj;         // 검색어를 입력하는 input의 id

function initSuggest(keyLoc, funcName, divId, divListId, bgColor, keywordObj, left, top)
{
	initVariableSuggest();

	cm_suggest_flag = true;
	cm_suggest_show_flag = false;
	cm_suggest_body_click_flag = false;
	cm_suggest_search_flag = false;

	setSuggestKeywordLocation(keyLoc);
	setSuggestSubmitFunction(funcName);
	setSuggestDivId(divId);
	setSuggestDivListId(divListId);
	setSuggestSelectBgColor(bgColor);
	setSuggestKeywordObj(keywordObj);
	
	initSuggestDivLoc(left, top);
}

///////////////////////////////////
// 제시어 기능을 위한 set 함수들 //
///////////////////////////////////
function setSuggestKeywordLocation(keyLoc)
{
	cm_suggest_keyword_location = keyLoc;
}
function setSuggestSubmitFunction(funcName)
{
	cm_suggest_submit_function = funcName;
}
function setSuggestDivId(divId)
{
	cm_suggest_div_id = divId;
}
function setSuggestDivListId(divListId)
{
	cm_suggest_div_list_id = divListId;
}
function setSuggestSelectBgColor(bgColor)
{
	cm_suggest_select_bg_color = bgColor;
}
function setSuggestKeywordObj(keywordObj)
{
    cm_suggest_keyword_obj = keywordObj;
}

/////////////////////////////////////////////
// 제시어 기능을 위한 변수들의 초기화 함수 //
/////////////////////////////////////////////
function initVariableSuggest()
{
	cm_suggest_check_first = false;
	cm_suggest_last_keyword = '';
	cm_suggest_loop_send_keyword = false;
	cm_suggest_list = new Array();
	cm_suggest_result_num = 0;
	cm_suggest_cursor = 0;
}
function initSuggestDivLoc(left, top)
{
	var keywordObj = document.getElementById(cm_suggest_keyword_obj);
	var divId = document.getElementById(cm_suggest_div_id);

	divId.style.left = (parseInt(keywordObj.offsetLeft) + left) + "px";
	divId.style.top = (parseInt(keywordObj.offsetTop) + top) + "px";
}

//////////////////////////////////////////////////////////
// 검색어 텍스트필드에 글자를 입력했을 때 실행되는 함수 //
//////////////////////////////////////////////////////////
function startSuggest() 
{
	if(cm_suggest_check_first == false) 
	{
		if(cm_suggest_flag == true)
		{
			// 제시어 기능이 켜져 있을때 실행
			setTimeout("sendKeyword();", 100);
			cm_suggest_loop_send_keyword = true;
		}
		else
		{
			// 제시어 기능이 꺼져 있다면 실행하지 않음
			cm_suggest_loop_send_keyword = false;
			return;
		}
	}
	cm_suggest_check_first = true;
}

///////////////////////////////////////////////////////////
// 제시어 검색을 위해서 입력한 글자를 서버로 보내는 함수 //
///////////////////////////////////////////////////////////
function sendKeyword() 
{
	if (cm_suggest_loop_send_keyword == false) return;
	var keyword = cm_suggest_keyword_location.keyword.value;
	if (keyword == "") 
	{
		cm_suggest_last_keyword = "";
		cm_suggest_result_num = 0;
		cm_suggest_cursor = 0;
		hide(cm_suggest_div_id);
		var listView = document.getElementById(cm_suggest_div_list_id);
		if(cm_suggest_flag == false)
		{
			listView.innerHTML = "<div align=\"center\" style=\"font-size:9pt\">현재 자동완성 기능을<br>사용하지 않습니다.</font>";
		}
		else
		{
			listView.innerHTML = "<div align=\"center\" style=\"font-size:9pt\">현재 자동완성 기능을<br>사용하고 있습니다.</font>";
		}
	} 
	else if(keyword != cm_suggest_last_keyword) 
	{
		cm_suggest_last_keyword = keyword;
		if(keyword != "") 
		{
			// 서버로 보내는 부분
			var searchparam = {};
			searchparam.keyword = encodeURI(keyword); 
			searchparam.split_keyword = encodeURI(splitKorean(keyword));
			//alert(searchparam.split_keyword);
			HTTP.message = "";
			HTTP.get("/search/SearchSuggest.aspx", searchparam, displayResult, null);
		} 
		else 
		{
			hide(cm_suggest_div_id);
		}
	}
	setTimeout("sendKeyword();", 100);
}

/////////////////////////////////////////////////////////
// 제시어 검색 결과를 받았을 때 실행되는 callback 함수 //
// 결과를 HTML 코드로 렌더링하는 부분임                //
/////////////////////////////////////////////////////////
function displayResult(response)
{
    var count = parseInt(response.split("|")[0]);
    var keywordList = response.split("|")[1].split(",");

    if(count > 0 && cm_suggest_search_flag == false)
    {
		var html = "<table id=\"list\" width=\"100%\" cellpadding=\"0\" cellspacing=\"0\" align=\"center\" class=\"suggest_box\">";
        for(var i=0; i < count; i++)
		{
		    var keyword_temp = keywordList[i];
			var keyword = cm_suggest_keyword_location.keyword.value.toUpperCase();
			var keyword_color = keyword_temp.replace(keyword, "<b style=\"color:#e15500;\">" + keyword + "</b>");
			
			html = html + "<tr onmouseover=\"this.style.backgroundColor='"+cm_suggest_select_bg_color+"'; setTrOnmouseover('list'); this.style.cursor='hand'; clearTrBgColor('list');\" onmouseout=\"this.style.backgroundColor=''\" onClick=\"javascript:selectKeyword('"+keywordList[i]+"'); submitSuggest();\" height=25>";
			html = html + "<td width=\"8\"></td><td style=\"font:normal 9pt/1.5 dotum;\">"+keyword_color+"</td><td width=\"8\"></td></tr>";
			cm_suggest_list[i] = keywordList[i];
		}
		var listView = document.getElementById(cm_suggest_div_list_id);
		listView.innerHTML = html + "</table>";

		cm_suggest_result_num = count;
		show(cm_suggest_div_id);
    }
    else
    {
        hide(cm_suggest_div_id);
    }
}

////////////////////////////////////////////
// 제시어 리스트에서 제시어를 선택했을 때 //
// 검색어 텍스트필드에 입력하는 함수      //
////////////////////////////////////////////
function selectKeyword(selectedKeyword) 
{
	cm_suggest_keyword_location.keyword.value = selectedKeyword;
	cm_suggest_loop_send_keyword = false;
	cm_suggest_check_first = false;
	hide(cm_suggest_div_id);
}

///////////////////////////////////
// 제시어 리스트를 보여주는 함수 //
///////////////////////////////////
function show(elementId) 
{
	var element = document.getElementById(elementId);
	if(element) 
	{
		element.style.display = "block";
		element.style.border = "solid #cccccc";
		element.style.borderWidth = "1px";
		cm_suggest_show_flag = true;
		btnShowHide();
	}
}

/////////////////////////////////
// 제시어 리스트를 숨기는 함수 //
/////////////////////////////////
function hide(elementId) 
{
	var element = document.getElementById(elementId);
	if(element) 
	{
		element.style.display = "none";
		cm_suggest_show_flag = false;
        btnShowHide();
	}
}

///////////////////////////////////////////////////////
// 제시어 리스트 박스가 보여지는 경우에              //
// 다른 곳을 클릭했을 때 박스가 사라지도록 하는 함수 //
///////////////////////////////////////////////////////
function offSuggest()
{
	if(cm_suggest_body_click_flag == false)
	{
		initVariableSuggest();
		hide(cm_suggest_div_id);
	}
	else
	{
		cm_suggest_body_click_flag = false;
	}
	btnShowHide();
}

///////////////////////////////////////////////
// △▽ 버튼을 눌렀을 때 실행되는 함수       //
// 제시어 리스트 박스가 사라졌다 나타났다 함 //
///////////////////////////////////////////////
function btnClickSuggest()
{
	showSuggest(); 
	cm_suggest_body_click_flag = true;
	btnShowHide();
}

////////////////////////////////////////////////
// △▽ 버튼을 눌렀을 때 이미지를 바꾸는 함수 //
// 예) △ 버튼을 누르면 ▽ 이미지로 바뀜      //
////////////////////////////////////////////////
function btnShowHide()
{
	var btnOn = document.getElementById("btnSuggestOn");
	var btnOff = document.getElementById("btnSuggestOff");
	if(cm_suggest_show_flag == true)
	{
		btnOn.style.display = "none";
		btnOff.style.display = "block";
	}
	else
	{
		btnOn.style.display = "block";
		btnOff.style.display = "none";
	}
}

////////////////////////////////////////////////////////
// 제시어 리스트 박스를 나타내거나 사라지게 하는 함수 //
////////////////////////////////////////////////////////
function showSuggest()
{
	initVariableSuggest();
	cm_suggest_keyword_location.keyword.blur();

	if(cm_suggest_show_flag == true)
	{
		hide(cm_suggest_div_id);
	}
	else
	{
	    //startSuggest();
		show(cm_suggest_div_id);
	}
}

/////////////////////////////////
// 제시어 기능을 정지하는 함수 //
/////////////////////////////////
function stopSuggest()
{
	initVariableSuggest();
	cm_suggest_keyword_location.keyword.blur();
	hide(cm_suggest_div_id);
}

//////////////////////////////////
// 제시어 기능을 켜고 끄는 함수 //
//////////////////////////////////
function onoffSuggest()
{
	var listView = document.getElementById(cm_suggest_div_list_id);
	if(cm_suggest_flag == true)
	{
		stopSuggest();
		cm_suggest_flag = false;
		listView.innerHTML = "<div align=\"center\" style=\"font-size:9pt\">현재 자동완성 기능을<br>사용하지 않습니다.</font>";
	}
	else
	{
		cm_suggest_flag = true;
		listView.innerHTML = "<div align=\"center\" style=\"font-size:9pt\">현재 자동완성 기능을<br>사용하고 있습니다.</font>";
		cm_suggest_keyword_location.keyword.focus();
	}
}

///////////////////////////////////////////
// 마우스로 검색 버튼을 클릭했을 때      //
// 폼을 submit 하는 함수를 실행하는 함수 //
///////////////////////////////////////////
function submitSuggest()
{
	stopSuggest();
	cm_suggest_search_flag = true;
	cm_suggest_submit_function();
}

//////////////////////////////////////////////////////
// 검색어 텍스트필드에 포커스가 될 때 실행되는 함수 //
//////////////////////////////////////////////////////
function onFocusSuggest()
{
	cm_suggest_body_click_flag = true; 
	startSuggest();
}

////////////////////////////////////////////////////
// 엔터나 커서키를 입력했을 때의 이벤트 처리 함수 //
////////////////////////////////////////////////////
function suggestCheckKey(keyEvent)
{
	if (keyEvent.keyCode == 13)
	{
		// 엔터를 치면 제시어 기능을 멈추고 폼을 submit 하는 함수를 실행한다.
		submitSuggest();
	}
	else if(keyEvent.keyCode == 40)
	{
		// 아래방향 커서키를 누르면 제시어 리스트의 하이라이트가 아래로 이동한다.
		if(cm_suggest_result_num > 0)
		{
			if(cm_suggest_cursor >= cm_suggest_result_num)
			{
				cm_suggest_cursor = cm_suggest_result_num;
				return;
			}
			cm_suggest_cursor = cm_suggest_cursor + 1;

			clearTrBgColor("list");
			clearTrOnmouseover("list");

			var listElement = document.getElementById("list").rows;
			listElement[cm_suggest_cursor-1].bgColor = cm_suggest_select_bg_color;
			cm_suggest_keyword_location.keyword.value = cm_suggest_list[cm_suggest_cursor-1];
			cm_suggest_loop_send_keyword = false;
			cm_suggest_check_first = false;
			if((cm_suggest_cursor-2) >= 0)
			{
				listElement[cm_suggest_cursor-2].bgColor = "";
			}
		}
	}
	else if(keyEvent.keyCode == 38)
	{
		// 위방향 커서키를 누르면 제시어 리스트의 하이라이트가 위로 이동한다.
		if(cm_suggest_result_num > 0)
		{
			cm_suggest_cursor = cm_suggest_cursor - 1;
			if(cm_suggest_cursor <= 0)
			{
				cm_suggest_cursor = 1;
				return;
			}

			clearTrBgColor("list");
			clearTrOnmouseover("list");

			var listElement = document.getElementById("list").rows;
			listElement[cm_suggest_cursor-1].bgColor = cm_suggest_select_bg_color;
			cm_suggest_keyword_location.keyword.value = cm_suggest_list[cm_suggest_cursor-1];
			cm_suggest_loop_send_keyword = false;
			cm_suggest_check_first = false;
			listElement[cm_suggest_cursor].bgColor = "";
		}
	}
	else
	{
		// 엔터와 커서키를 제외한 나머지 경우에는 제시어 검색을 시작한다.
		startSuggest();
	}
}

////////////////////////////////////////////////////////////////
// 제시어 리스트 박스의 하이라이트된 부분을 초기화시키는 함수 //
////////////////////////////////////////////////////////////////
function clearTrBgColor(id)
{
	var element = document.getElementById(id).rows;
	for(var i=0; i<element.length; i++)
	{
		element[i].bgColor = "#ffffff";
	}
}

////////////////////////////////////////////////////////////////
// 방향 커서키가 입력되었을 때                                //
// TR 태그에 적용되어 있는 마우스 오버 함수를 재정의하는 함수 //
////////////////////////////////////////////////////////////////
function clearTrOnmouseover(id)
{
	var element = document.getElementById(id).rows;
	for(var i=0; i<element.length; i++)
	{
		element[i].onmouseover = function()
		{
			this.style.backgroundColor = "";
			setTrOnmouseover("list"); 
			this.style.cursor = "hand";  
			clearTrBgColor("list");
		}
		element[i].onmouseover();
	}
}

////////////////////////////////////////////////////////////////
// 마우스가 제시어 리스트 박스에 마우스 오버되었을 때         //
// TR 태그에 적용되어 있는 마우스 오버 함수를 재정의하는 함수 //
////////////////////////////////////////////////////////////////
function setTrOnmouseover(id)
{
	var element = document.getElementById(id).rows;
	for(var i=0; i<element.length; i++)
	{
		element[i].onmouseover = function()
		{
			this.style.backgroundColor = cm_suggest_select_bg_color;
			setTrOnmouseover("list"); 
			this.style.cursor = "hand";  
			clearTrBgColor("list");
		}
	}
}

///////////////////////////////////////
// 한글을 초/중/종성으로 자르는 함수 //
///////////////////////////////////////
function splitKorean(kor)
{
	var font_cho = Array(
	'ㄱ', 'ㄲ', 'ㄴ', 'ㄷ', 'ㄸ',
	'ㄹ', 'ㅁ', 'ㅂ', 'ㅃ', 'ㅅ', 'ㅆ',
	'ㅇ', 'ㅈ', 'ㅉ', 'ㅊ', 'ㅋ', 'ㅌ', 'ㅍ', 'ㅎ' );

	var font_jung = Array(
	'ㅏ', 'ㅐ', 'ㅑ', 'ㅒ', 'ㅓ',
	'ㅔ', 'ㅕ', 'ㅖ', 'ㅗ', 'ㅘ', 'ㅙ',
	'ㅚ', 'ㅛ', 'ㅜ', 'ㅝ', 'ㅞ', 'ㅟ',
	'ㅠ', 'ㅡ', 'ㅢ', 'ㅣ' );

	var font_jong = Array(
	'', 'ㄱ', 'ㄲ', 'ㄳ', 'ㄴ', 'ㄵ', 'ㄶ', 'ㄷ', 'ㄹ',
	'ㄺ', 'ㄻ', 'ㄼ', 'ㄽ', 'ㄾ', 'ㄿ', 'ㅀ', 'ㅁ',
	'ㅂ', 'ㅄ', 'ㅅ', 'ㅆ', 'ㅇ', 'ㅈ', 'ㅊ', 'ㅋ', 'ㅌ', 'ㅍ', 'ㅎ' );

	var retVal = "";

	for(var i=0; i<kor.length; i++)
	{
		var kor_char = kor.charAt(i);

		var CompleteCode = kor_char.charCodeAt(0);
		var UniValue = CompleteCode - 0xAC00;

		var Jong = UniValue % 28;
		var Jung = ( ( UniValue - Jong ) / 28 ) % 21;
		var Cho = parseInt (( ( UniValue - Jong ) / 28 ) / 21);

		if(UniValue >= 0)
		{
			retVal += font_cho[Cho] + splitKoreanJung(font_jung[Jung]) + splitKoreanJong(font_jong[Jong]);
		}
		else
		{
			retVal += kor_char;
		}
	}

	return retVal;
}

////////////////////////
// 중성 예외처리 함수 //
////////////////////////
function splitKoreanJung(jung)
{
	if(jung == "ㅘ") return "ㅗㅏ";
	else if(jung == "ㅙ") return "ㅗㅐ";
	else if(jung == "ㅚ") return "ㅗㅣ";
	else if(jung == "ㅝ") return "ㅜㅓ";
	else if(jung == "ㅞ") return "ㅜㅔ";
	else if(jung == "ㅟ") return "ㅜㅣ";
	else if(jung == "ㅢ") return "ㅡㅣ";
	else 
		return jung;
}

////////////////////////
// 종성 예외처리 함수 //
////////////////////////
function splitKoreanJong(jong)
{
	if(jong == "ㄳ") return "ㄱㅅ";
	else if(jong == "ㄵ") return "ㄴㅈ";
	else if(jong == "ㄶ") return "ㄴㅎ";
	else if(jong == "ㄺ") return "ㄹㄱ";
	else if(jong == "ㄻ") return "ㄹㅁ";
	else if(jong == "ㄼ") return "ㄹㅂ";
	else if(jong == "ㄽ") return "ㄹㅅ";
	else if(jong == "ㄾ") return "ㄹㅌ";
	else if(jong == "ㄿ") return "ㄹㅍ";
	else if(jong == "ㅀ") return "ㄹㅎ";
	else if(jong == "ㅄ") return "ㅂㅅ";
	else
		return jong;
}