/*
	Publishing by.LH
	S-Wed
	Selectbox
*/

function selectThisValue(thisId,thisIndex,thisValue,thisString) {
	var objId = thisId;
	var nowIndex = thisIndex;
	var valueString = thisString;
	var optionLayer = document.getElementById(objId+"selectBoxOptionLayer");
	var sourceObj = document.getElementById(objId);
	var nowSelectedValue = document.getElementById(objId+"SelectBoxOptionValue"+nowIndex).value;
	if (optionLayer) optionLayer.style.display = "none";
	if (sourceObj) sourceObj.value = nowSelectedValue;
	obj = document.getElementById(thisId);
	fireEvent(obj,'change');
	settingValue(objId,valueString);
}

function settingValue(thisId,thisString) {
	var objId = thisId;
	var valueString = thisString;
	var selectedArea = document.getElementById(objId+"selectBoxSelectedValue");
	if (selectedArea) selectedArea.value = valueString;	
}

function viewOptionLayer(thisId) {
	var objId = thisId;
	var optionLayer = document.getElementById(objId+"selectBoxOptionLayer");
	if (optionLayer) optionLayer.style.display = "";
}

function hideOptionLayer(thisId) {
	var objId = thisId;
	var optionLayer = document.getElementById(objId+"selectBoxOptionLayer");
	if (optionLayer) optionLayer.style.display = "none";
}

function makeSelectBox(thisId) {
	var downArrowSrc = "/images/new_common/btn_select.gif";	//¿À¸¥ÂÊ È­»ìÇ¥À̹ÌÁö
	var downArrowSrcWidth = 15;	//¿À¸¥ÂÊ È­»ìÇ¥À̹ÌÁö width
	var objId = thisId;
	var obj = document.getElementById(objId);
	var selectBoxWidth = parseInt(obj.style.width);
	var selectBoxHeight = parseInt(obj.style.height);
	newSelect = "";
	newSelect += "<table id='" + objId + "selectBoxOptionLayer' class='selectBoxOptionLayer'cellpadding='0' cellspacing='0' border='0' style='position:absolute; left:1; top:1; z-index:100; display:none; border:1px solid #DCDCDC;' onMouseOver=\"viewOptionLayer('"+ objId + "')\" onMouseOut=\"hideOptionLayer('"+ objId + "')\">";
	newSelect += "	<tr>";
	newSelect += "		<td height='18'></td>";
	newSelect += "	</tr>";
	newSelect += "	<tr>";
	newSelect += "		<td height='" + selectBoxHeight + "' style='cursor:hand; background-color:#fff;' onclick=\"hideOptionLayer('"+ objId + "')\"></td>";
	newSelect += "	</tr>";
	newSelect += "	<tr>";
	newSelect += "		<td bgcolor='#fff' style='background-color:#fff;'>";
	newSelect += "		<div class='selectBoxOptionInnerLayer' style='width:" + (selectBoxWidth-2) + "px;'>";
	newSelect += "		<table cellpadding='0' cellspacing='0' border='0' width='100%' style='table-layout:fixed; word-break: break-all;'>";
	for (var i=0 ; i < obj.options.length ; i++) {
		var nowValue = obj.options[i].value;
		var nowText = obj.options[i].text;
		newSelect += "			<tr>";
		newSelect += "				<td height='19' class='selectBoxOption' style='font-size:11px;'><a href=\"javascript:selectThisValue('"+ objId + "'," + i + ",'" + nowValue + "','" + nowText + "')\" onfocus='this.blur()'>" + nowText + "</a></td>";
		newSelect += "				<input type='hidden' id='"+ objId + "SelectBoxOptionValue" + i + "' value='" + nowValue + "'>";
		newSelect += "			</tr>";
	}
	newSelect += "		</table>";
	newSelect += "		</div>";
	newSelect += "		</td>";
	newSelect += "	</tr>";
	newSelect += "</table>";
	newSelect += "<table id='"+thisId+"_select' tabindex='0' cellpadding='0' cellspacing='0' border='0' bgcolor='#fff' onclick=\"viewOptionLayer('"+ objId + "')\" onmouseout=\"hideOptionLayer('"+ objId + "')\" style='cursor:hand; border:1px solid #DCDCDC; background-color:#fff;'>";
	newSelect += "	<tr>";
	newSelect += "		<td style='padding: 1px'>";
	newSelect += "		<table cellpadding='0' cellspacing='0' border='0' style='_margin-top:-1px;'>";
	newSelect += "			<tr>";
	newSelect += "				<td><div style='position:relative; width:" + (selectBoxWidth - downArrowSrcWidth - 4) + "px;height:13px; borer:1px solid red;'><input id='" + objId + "selectBoxSelectedValue' type='text' class='selectBoxSelectedArea' style='_height:12px; font-size:11px; border:0; vertical-align:middle;  width:" + (selectBoxWidth - downArrowSrcWidth - 4) + "px;height:" + (selectBoxHeight - 4) + "px;cursor:hand;' readonly='readonly'></div></td>";
	newSelect += "				<td><img src='" + downArrowSrc + "' width='" + downArrowSrcWidth + "' border='0' style='vertical-align:middle;' /></td>";
	newSelect += "			</tr>";
	newSelect += "		</table>";
	newSelect += "		</td>";
	newSelect += "	</tr>";
	newSelect += "</table>";
	
	document.write(newSelect);
	
	var haveSelectedValue = false;
	for (var i=0 ; i < obj.options.length ; i++) {
		if (obj.options[i].selected == true) {
			haveSelectedValue = true;
			settingValue(objId,obj.options[i].text);
		}
	}
	if (!haveSelectedValue) settingValue(objId,obj.options[0].text);
}

function fireEvent(element,event){
    if (document.createEventObject){
        var evt = document.createEventObject();
        return element.fireEvent('on'+event,evt)
    }
    else{
        var evt = document.createEvent("HTMLEvents");
        evt.initEvent(event, true, true ); // event type,bubbling,cancelable
        return !element.dispatchEvent(evt);
    }
}