/**
 * 關鍵字自動完成
 * Last Update:2010-11-24
 */
var SuggestInput;
 (function(){
	var suggestInputConfig = {
		text_id:"inputSelect",
		box_width:"0",
		suggestDivId:"suggest_item_",
		offsetX:0,
		offsetY:0
	}
	var cache={};

	SuggestInput=function(config) {
		config = config || {};

		for(var prop in suggestInputConfig) {
			if(config[prop]==null) {
				config[prop]=suggestInputConfig[prop];
			}
		}

		var SUGGEST_SERVLET_URL = '/search/auto/keywordautoservlet.jsp';
		var SUGGEST_ITEM_PREFIX = "suggest_item_" + config.suggestDivId;

		var INPUT_ID = config.text_id;
		var BOX_WIDTH = config.box_width;

		var inputText  = null; //the main input text element
		var suggestDiv = null; //a visible pendant to select box
		var suggestIframe = null;

		var scripting=false;
		var inputword='';

		var selectIndex = -1;
		var suggestList = null;

		var sendRequestTimer;

		init();
		//entrance point
		function init(){
			jobcn.ready(suggestRunner);
			if (window.addEventListener) {
				//window.addEventListener('load', suggestRunner, false);
				document.addEventListener("click", hideSuggest, false);
			}else	if (window.attachEvent) {
				//window.attachEvent('onload', suggestRunner);
				document.attachEvent("onclick", hideSuggest);
			}
		}


		//main function of suggest
		function suggestRunner() {
			if (document.createElement("DIV") && document.getElementById(INPUT_ID)!=null) { //otherwise nothing happens
				scripting=true;

				inputText = document.getElementById(INPUT_ID);

				inputText.setAttribute("autocomplete","OFF");
				inputText.onkeydown=function(e){
					e = e||window.event;
					showSelection(this,e);
				}

				suggestDiv = document.createElement("DIV");
				suggestDiv.id = "suggestDiv" + config.suggestDivId;
				suggestDiv.className="suggestBoxContainer"
				suggestDiv.style.display="none"
				suggestDiv.style.zIndex = 500;

				//use iframe to hide the html select element
				suggestIframe = document.createElement('IFRAME');
				suggestIframe.frameBorder = 0;
				suggestIframe.scrolling = "no";
				suggestIframe.style.display="none"
				suggestIframe.style.zIndex = suggestDiv.style.zIndex;
				document.body.appendChild(suggestIframe);
				document.body.appendChild(suggestDiv)
				setTimeout(positionSugguestDiv,100);


				//when use form submit, hide suggestBox first
				var form = inputText.parentNode;
				while(!!form){
					if(form.tagName=="FORM") break;
					else form = form.parentNode;
				}
				/*
				if(!!form && !!suggestDiv){
					form._submit = form.submit;
					form.submit = function(){
						hideSuggest();
						form._submit();
					}
				}
				*/

				if (window.addEventListener) {
					if(!!form && !!suggestDiv)
						form.addEventListener('submit', hideSuggest, false);
					window.addEventListener('scroll', positionSugguestDiv, false);
					window.addEventListener('resize', positionSugguestDiv, false);
				}else if(window.attachEvent) {
					if(!!form && !!suggestDiv)
						form.attachEvent('onsubmit', hideSuggest);
					window.attachEvent('onscroll', positionSugguestDiv);
					window.attachEvent('onresize', positionSugguestDiv);
				}
			}
		}

		function hideSuggest(){
			if(!!suggestDiv && !!suggestDiv.style)
				suggestDiv.style.display="none";
			if(!!suggestIframe && !!suggestIframe.style)
				suggestIframe.style.display="none";
		}

		function showSuggest(){
			if(!!suggestDiv && !!suggestDiv.style)
				suggestDiv.style.display="block";
			if(!!suggestIframe && !!suggestIframe.style)
				positionSugguestIframe();
		}


		//find coords where the suggest div will appear
		function positionSugguestDiv(){
				//find coords where the suggest div will appear
			var pos2=findPos(inputText);
			pos2.push(inputText.offsetHeight);
			pos2.push(inputText.offsetWidth)

			suggestDiv.style.top=(pos2[1]+pos2[2])+'px';
			suggestDiv.style.left=pos2[0]+'px';
			suggestDiv.style.width= (BOX_WIDTH!=0 ?BOX_WIDTH: pos2[3])+'px';

			positionSugguestIframe();
		}


		function positionSugguestIframe(){
			if (!suggestDiv || !suggestIframe) return;

			//suggestIframe.style.zIndex = suggestDiv.style.zIndex - 1;
			suggestIframe.style.top = suggestDiv.style.top;
			suggestIframe.style.left = suggestDiv.style.left;
			suggestIframe.style.width = suggestDiv.offsetWidth;
			suggestIframe.style.height = suggestDiv.offsetHeight;
			suggestIframe.style.position = "absolute";
			suggestIframe.style.display = "block";
		}

		//關鍵字高亮
		function highlight(value, term) {
			return value.replace(new RegExp("(?![^&;]+;)(?!<[^<>]*)(" + term.replace(/([\^\$\(\)\[\]\{\}\*\.\+\?\|\\])/gi, "\\$1") + ")(?![^<>]*>)(?![^&;]+;)", "gi"), "<strong>$1</strong>");
		}
		//獲取位置
		function findPos(elem) {
			var curleft = curtop = 0;
			if (elem.offsetParent) {
				curleft = elem.offsetLeft
				curtop = elem.offsetTop
				while (elem = elem.offsetParent) {
					curleft += elem.offsetLeft;
					curtop += elem.offsetTop;
				}
			}
			return [curleft+config.offsetX,curtop+config.offsetY];
		}

		//build suggest box div
		function buildDiv() {
			selectIndex = -1;

			var html = '';
			for(i=0;i<suggestList.length;i++) {
				html += '<div class="suggestBox" style="width:100%;font-size:0.8em;" id="'+ SUGGEST_ITEM_PREFIX + i + '" ';
				html += 'onmouseover="this.className=\'mouse_over\';" ';
				html += 'onmouseout="this.className=\'suggestBox\';" ';
				html += 'onclick="document.getElementById(\'' + INPUT_ID + '\').value=\''+suggestList[i]+'\'; document.getElementById(\'' + suggestDiv.id + '\').style.display=\'none\';" >';
				html += highlight(suggestList[i],inputword);
				html += '</div>';
			}

			suggestDiv.innerHTML = html;
		}

		//move select index
		function moveIndex(ev) {
			if (!scripting) return;

			var len = (!suggestList)?0:suggestList.length;
			if(len==0) return;
			switch(ev.keyCode){
				case 40:
					selectIndex++;
					break;
				case 38:
					 selectIndex--;
					break;
			}
			if(selectIndex<0) selectIndex=0;
			if(selectIndex+1>len) selectIndex=len-1;

			for(var i=0;i<len;i++){
				if(selectIndex==i) {
					document.getElementById(SUGGEST_ITEM_PREFIX+i).className="mouse_over";
				} else {
					document.getElementById(SUGGEST_ITEM_PREFIX + i).className="suggestBox";
				}
			}
		}

		//create and show suggest box div
		function showSelection(input,ev) {
			if (!scripting) return;

			if(suggestDiv.style.display!="none") {
				switch(ev.keyCode){
					case 40:
					case 38:
						moveIndex(ev);
						return;
					case 27:
						hideSuggest();
						return;
					case 13:
						if(selectIndex>-1&&selectIndex+1<suggestList.length)inputText.value =suggestList[selectIndex];
						hideSuggest();
						if(ev.preventDefault){
							ev.preventDefault();
						}else ev.returnValue = false;
						return;
				}
			}
			clearTimeout(sendRequestTimer);
			sendRequestTimer=setTimeout(function(){
				inputword=input.value;
				if (inputword==""){hideSuggest();return;}
				var v=cache[inputword];
				if(v)
				{
					//log("SuggestInput","find from cache");
					suggestList=v;
					buildDiv();
					showSuggest();
					return;
				}

				var param = {
					params:'word='+ encodeURIComponent(inputword),
					onComplete: function(transport){
						try {
							suggestList =  eval('(' +(transport.responseText)+ ')');
						}catch(err) {
							suggestList==null;
						}
						if(suggestList==null || typeof suggestList!='object' ||
						 suggestList.constructor!=Array || suggestList.length==0){
							hideSuggest();
							return;
						} else {
							cache[inputword]=suggestList;
							buildDiv();
							showSuggest();
						}
					}
				}
				Ajax.dispatch(SUGGEST_SERVLET_URL, param);
			},100);

		}


	};
})();

//util functions
function $(element) {
  if (typeof element == 'string'){
    element = document.getElementById(element);
  }
  return element;
}


