<!--
/*##############################################################################
#-------------------------------------------------------------------------------
# 검색단어 자동완성(autoComplete keyword) made by Dd on 200090914
#-------------------------------------------------------------------------------
# 검색창 및 레이어 ID는 자주 사용됨으로 전역변수화로 사용하였음 
# 따라서 문서가 로딩된 이후인 하단 부분에 이 스크립트를 사용해야 함.
#-------------------------------------------------------------------------------
# Have to use this script after HTML(Form and Matching List Layer)
##############################################################################*/
/*----------------------------------------------------------------------------*/
/* Keyword DATA */
/*----------------------------------------------------------------------------*/
/* keywords.js 파일 참조 */
/*----------------------------------------------------------------------------*/

/*----------------------------------------------------------------------------*/
/* 초기 변수 설정(Defalut Setup) */
/*----------------------------------------------------------------------------*/
var ACinputID = 'search_word';	// 검색창 ID 정의
var AClayerID = 'kwd_box';		// 레이어 ID 정의
var ACListID = 'kwd_box';		// 매칭리스트 ID 정의
var ACListMax = 10;				//Matching List 최대 수
var ACopts = '^';//시작글자로 검색 시 ACopts = '^' / 중간글자도 검색시 ACopts = ''
/*----------------------------------------------------------------------------*/

var kwd_cnt;
var ACposition = -1;
var ACtargetObj = document.getElementById(ACinputID);
var ACtargetDiv = document.getElementById(AClayerID);

// make Matching List
function autoComplete(val,evt) {
	if((evt.keyCode==38 || evt.keyCode==40) && (ACtargetDiv.style.visibility == 'visible')){
		UpDown(val,evt);
	}
	else{
		if(val && val.length > 0) {
			var boxContents = ''; // 박스 내용 정의 및 초기화
			kwd_cnt = 0;
			// 특수문자 escape -.-
			val = val.replace(/([~`@#$%^&*()|\+=-_;:\-\,\.\'\"\\t\\n\\r<>!?/])/g, '\\$1');
			// 배열만큼 노가다;
			for(i = 0; i < kwd_array.length; i++)
			{
				// 일치하는 글자가 있으면
				//if(kwd_array[i].match(eval('/^' + val + '{1,}/')))
				if(kwd_array[i].match(eval('/' + ACopts + val + '{1,}/')))
				{
					// 일치하는 항목 보여주고 글자 하나하나를 이쁘게(?) 강조
					match_kwd = kwd_array[i].replace(eval('/(' + val + '){1,1}/gi'), '<font color="#FF6600">$1</font>');
					boxContents = boxContents;
					boxContents += '<tr id="trid['+i+']" height="22" title="' + kwd_array[i] + '" onKeyUp="UpDown(this.event)" onMouseOver=\'this.style.backgroundColor="#F0F0F0"\' onMouseOut=\'this.style.backgroundColor=""\' onClick=\'clickList(this.getAttribute("title"))\' style="cursor:pointer;">';
					boxContents += '<td id="'+ACListID+'" style="padding-left:5px;" nowrap>';
					boxContents += match_kwd;
					boxContents += '</td></tr>\n';
					kwd_cnt++;
				}
				if(kwd_cnt<ACListMax) continue;
				else break;
			}

			// 노가다 끝낸 결과가 하나 이상 있으면 show
			if(kwd_cnt)
			{
				// 스크롤바 조절용 DIV 높이 계산
				divH = (kwd_cnt > ACListMax) ? (ACListMax*22) : (kwd_cnt*22);

				var boxHead = '<table width="100%" bgcolor="#FFFFFF" cellpadding="0" cellspacing="0" style="border:1px solid #555555;">';
				//boxHead += '<tr height="21" bgcolor="#666666"><td name="_slb"><font color="#FFFFFF"><b name="_slb">Matching List</b></font></td></tr><tr height="2" bgcolor="#000000"><td></td></tr>';
				boxHead += '<tr><td><div name="_slb" style="width:100%;height:' + divH + 'px;overflow-x:hidden;overflow-y:hidden;">';
				boxHead += '<table id="MachingList" width="100%" border="0" cellpadding="0" cellspacing="0">';
				var boxFoot = '</table></div></td></tr></table>';

				ACtargetDiv.innerHTML = boxHead + boxContents + boxFoot;
				ACtargetDiv.style.visibility = 'visible';
				ACtargetObj.focus();
			}
			// 아님 들어가 있어~~~
			else hideList();
		}
		else{
			hideList();
		}
	}
}

// Matching List Hide
function hideList(tar){
	ACposition = -1;
	ACtargetDiv.innerHTML = '';
	ACtargetDiv.style.visibility = 'hidden';
	if(!tar) ACtargetObj.focus();
}

// Matching List Visibility Check
function visibilityCheck(val,evt){
	if(ACtargetDiv.style.visibility == 'hidden'){
		autoComplete(val,evt);
	}
	else{
		hideList();
	}
}

// Matching List Click
function clickList(val){
	ACposition = -1;
	ACtargetObj.value = val;
	hideList();
	ACtargetObj.focus();
	fSend(ACtargetObj);
}

// Up and Down key(↑↓) on Matching List
function UpDown(val,evt)
{
	if(ACtargetDiv.style.visibility == 'visible'){

		var obj_parent = document.getElementById('MachingList');
		var obj_child = obj_parent.getElementsByTagName("tr");

		if(obj_child.length > 0){

			switch(evt.keyCode){
				case 38:
					//alert("위로");
					if(ACposition > 0) ACposition--;
					break;
				case 40:
					//alert("아래로");
					//if(ACposition < obj_child.length) ACposition++;
					if(ACposition < kwd_cnt-1) ACposition++;
					break;
			}

			//alert(ACposition)
			for(i=0;i<obj_child.length;i++){
				if(ACposition==i){
					obj_child[i].style.backgroundColor="#F0F0F0";
					ACtargetObj.value = obj_child[i].getAttribute("title");
				}
				else{
					obj_child[i].style.backgroundColor="";
				}
			}

		}
	}
	else{
		autoComplete(val,evt)
	}

}

function fSend(obj){
	obj.form.submit();
}

// 다른 곳 클릭하면 레이어 안보이게...
function hide_ctrl(e)
{
	if(!e) var e = window.event;
	var srcEle = (IE) ? event.srcElement : e.target;
	if((!srcEle.id || srcEle.id!=ACinputID) && srcEle.id!=ACListID) hideList(true);
}

// IE와 FF 구분해서 이벤트 첨부
var IE = (navigator.userAgent.indexOf('MSIE') != -1) ? true : false;// IE 체크
if(IE) document.body.attachEvent('onmousedown', hide_ctrl);
else document.body.addEventListener('mousedown', hide_ctrl, false);
/*##############################################################################
#-------------------------------------------------------------------------------
# 검색단어 자동완성(autoComplete keyword) made by Dd on 200090914
#-------------------------------------------------------------------------------
##############################################################################*/
//-->
