/*********************************************************
최초 개발자 : 우상윤
최초 개발일 : 2008.04.11
최종 수정자 : 우상윤
최종 수정일 : 2007.04.11
상세 설명 : select 태그에 스타일 주는 스크립트
	contain : 셀렉트 박스 위치 설정을 위한 기준 레이어
	tagId : 실제 동작되는 셀렉트박스 아이디
	width : 화면에 보여질 셀렉트박스 넓이
	height : 화면에 보여질 셀렉트박스 높이
	top : 셀렉트된 아이템이 보여질 레이어의 contain으로 부터 세로 위치 값
	left : 셀렉트된 아이템이 보여질 레이어의 contain으로 부터 가로 위치 값
	itemWidth : 셀렉트박스 아이템 리스트 레이어의 넓이
	itemHeight : 셀렉트박스 아이템 리스트 레이어의 높이
	itemTop : 셀렉트박스 아이템 리스트 레이어의 contain으로 부터 세로 위치 값
	itemLeft : 셀렉트박스 아이템 리스트 레이어의 contain으로 부터 가로 위치 값
	cssName : 생성되는 셀렉트박스의 스타일시트 클래스
	overBack : 셀렉트박스 아이템 리스트에 마우스 오버될 경우 배경색
	overFont : 셀렉트박스 아이템 리스트에 마우스 오버될 경우 글자색
	outBack : 셀렉트박스 아이템 리스트에 마우스 아웃될 경우 배경색
	outFont : 셀렉트박스 아이템 리스트에 마우스 아웃될 경우 글자색
**********************************************************/
selectStyle = function(objName, contain, tagId, width, height, top, left, itemWidth, itemHeight, itemTop, itemLeft, cssName, overBack, overFont, outBack, outFont){
	this.objName = objName;

	//style setting
	this.width = width;			//layer width
	this.height = height;			//layer height
	this.top = top;			//layer top
	this.left = left;			//layer left
	this.itemWidth = itemWidth;			//layer items width
	this.itemHeight = itemHeight;			//layer items one height
	this.itemTop = itemTop;			//layer items top
	this.itemLeft = itemLeft;			//layer items left
	this.overBgcolor = overBack;	//items onmouseover background color
	this.overFontcolor = overFont;		//items onmouseover font color
	this.outBgcolor = outBack;	//items onmouseover background color
	this.outFontcolor = outFont;		//items onmouseover font color

	this.Contain = document.getElementById(contain);
	this.tagId = document.getElementById(tagId);
	this.selectItemView = "N";
	this.cssName = cssName;

	//셀렉트 박스를 대신할 레이어들을 생성
	this.newSelect = this.Contain.appendChild(document.createElement("Div"));
	this.newSelectItems = this.Contain.appendChild(document.createElement("Div"));
	this.selectItemsNum = this.tagId.options.length;
	this.viewItemsDiv = new Array();
	this.viewItemsTxt = new Array();
	for(i=0;i<this.selectItemsNum;i++){
		this.viewItemsDiv[i] = this.newSelectItems.appendChild(document.createElement("Div"));
		this.viewItemsTxt[i] = document.createTextNode(this.tagId.options[i].text);
		this.viewItemsDiv[i].appendChild(this.viewItemsTxt[i]);
		this.viewItemsDiv[i].style.display = "none";
		this.viewItemsDiv[i].className = this.cssName+"List";
		this.viewItemsDiv[i].id = this.objName + "_" + i;
		//item onmouseover event
		this.viewItemsDiv[i].onmouseover = function(){
			eval(objName+"._mouseOver('"+this.id+"');");
		}

		//item onmouseout event
		this.viewItemsDiv[i].onmouseout = function(){
			//selectStyle._mouseOut(this.id);
			eval(objName+"._mouseOut('"+this.id+"');");
		}

		//item onclick event
		this.viewItemsDiv[i].onclick = function(){
			//selectStyle._mouseClick(this.id);
			eval(objName+"._mouseClick('"+this.id+"');");
		}
	}

	//가려진 태그를 대신할 레이어를 생성
	selectStyle.prototype.makeLayer = function(){
		var _newSelect = this.newSelect;
		var _newSelectItems = this.newSelectItems;
		var _objName = this.objName;

		_newSelect.className = this.cssName+"Selected";
		_newSelect.style.width = this.width+"px";
		_newSelect.style.height = this.height+"px";
		_newSelect.style.top = this.top+"px";
		_newSelect.style.left = this.left+"px";
		_newSelect.id = this.cssName+"sTag";
		newSelectText = document.createTextNode(this.tagId.options[this.tagId.selectedIndex].text);
		_newSelect.appendChild(newSelectText);

		_newSelectItems.style.width = this.itemWidth+"px";
		_newSelectItems.style.height = (this.tagId.options.length * this.itemHeight) + "px";
		_newSelectItems.style.display = "none";
		_newSelectItems.style.top = this.itemTop+"px";
		_newSelectItems.style.left = this.itemLeft+"px";
		_newSelectItems.id = this.cssName+"sTagItems";
		_newSelectItems.className = this.cssName+"Item";

		//셀렉트박스 클릭
		_newSelect.onclick = function(){
			eval(_objName+".selectClick();");
		}
	}

	//셀렉트박스 실행
	selectStyle.prototype.selectClick = function(){
		eval(this.objName+".makeItems();");
	}

	//셀렉트박스 아이템 리스트 생성
	selectStyle.prototype.makeItems = function(){
		var _newSelectItems = this.newSelectItems;
		var _newSelect = this.newSelect;
		var _tagId = this.tagId;

		if(this.selectItemView == "N"){
			_newSelectItems.style.display = "block";
			for(i=0;i<this.selectItemsNum;i++){
				this.viewItemsDiv[i].style.display = "block";
				this.viewItemsDiv[i].style.width = this.itemWidth+"px";
				this.viewItemsDiv[i].style.height = this.itemHeight+"px";
				this.viewItemsDiv[i].style.lineHeight = this.itemHeight+"px";
			}
			this.selectItemView = "S";
		}else{
			_newSelectItems.style.display = "none";
			for(i=0;i<this.selectItemsNum;i++){
				this.viewItemsDiv[i].style.display = "none";
			}
			this.selectItemView = "N";
		}
	}

	//셀렉트 박스 마우스 오버 이벤트
	selectStyle.prototype._mouseOver = function(itemId){
		document.getElementById(itemId).style.backgroundColor = this.overBgcolor;
		document.getElementById(itemId).style.color = this.overFontcolor;
	}

	//셀렉트 박스 마우스 아웃 이벤트
	selectStyle.prototype._mouseOut = function(itemId){
		document.getElementById(itemId).style.backgroundColor = this.outBgcolor;
		document.getElementById(itemId).style.color = this.outFontcolor;
	}

	//셀렉트 박스 마우스 클릭 이벤트
	selectStyle.prototype._mouseClick = function(itemId){
		var itemNum = itemId.split("_");
		var selItemNum = itemNum[(itemNum.length - 1)];
		this.tagId.options[selItemNum].selected = true;
		this.newSelect.innerHTML = this.tagId.options[selItemNum].text;
		//this.newSelectItems.style.display = "none";
		this.selectItemView = "S";
	}

	//셀렉트 박스 바깥쪽 클릭
	selectStyle.prototype._outClick = function(){
		var _newSelectItems = this.newSelectItems;
		var _objName = this.objName;
		if(_newSelectItems.style.display == "block"){
			eval(_objName+".makeItems();");
		}
	}

	//셀렉트 박스 닫기
	document.documentElement.onclick = function(e){
		var e=e?e:window.event;

		var nClickObj;
		var loadObj;

		if (e.srcElement){
			nClickObj=e.srcElement;
		} else if (e.target){
			nClickObj=e.target;
		}

		if(nClickObj.id.indexOf("tsrchBar") != 0){
			selectStyleTop._outClick();
		}
	}
}