/**************************************************************
    Name: JamiForm
    Version: 1.0
    LastModified:2009.01.06
    Author: vocalo
    URL: http://jf.jamiwa.com
***************************************************************/

//Global Variables
var ntop_forms = _d.getElementsByTagName('form'); var inputs = new Array(); var labels = new Array(); var radios = new Array(); var radioLabels = new Array(); var checkboxes = new Array(); var checkboxLabels = new Array(); var texts = new Array(); var textareas = new Array(); var selects = new Array(); var selectText = "선택해주세요."; var agt = navigator.userAgent.toLowerCase(); this.ie = ((agt.indexOf("msie") != -1) && (agt.indexOf("opera") == -1)); var hovers = new Array(); var buttons = new Array(); var isMac = new RegExp('(^|)'+'Apple'+'(|$)');

//Theme Variables - edit these to match your theme
var selectRightSideWidth = 21;
var selectLeftSideWidth = 8;
var selectAreaHeight = 21;
var selectAreaOptionsOverlap = 2;
var imagesPath = "/img/form/";

function fnDesignForm() {
	if(!document.getElementById) {return false;}
	preloadImages();
	getElements();
	separateElements();
	replaceRadios();
	replaceCheckboxes();
	replaceSelects();
	if(!isMac.test(navigator.vendor)) {
		buttonHovers();
	}
}

function refreshElements() {
    for (var i=0; i<radios.length ; i++ ){
        if(radios[i].checked){changeRadios(i);}
    }
    for (var i=0; i<selects.length; i++ ){
        if (selects[i].size==1) {
            if ( selects[i].disabled ) {
                $("sarea"+i).style.visibility="hidden";
            } else {
                $("sarea"+i).style.visibility="visible";
                selectMe(selects[i].id,selects[i].selectedIndex,i);
            }
        }
    }
    for (var i=0; i<checkboxes.length; i++) {
        if ( checkboxes[i].checked ){
            checkboxLabels[i].className="chosen";
            checkCheckboxes(i,true);
        } else {
            checkboxLabels[i].className="";
            checkCheckboxes(i,false);
        }
    }
}

//preloading required images
function preloadImages() {
	preloads = new Object();
	preloads[0] = new Image(); preloads[0].src = imagesPath + "button_left_xon.gif";
	preloads[1] = new Image(); preloads[1].src = imagesPath + "button_right_xon.gif";
	preloads[2] = new Image(); preloads[2].src = imagesPath + "input_left_xon.gif";
	preloads[3] = new Image(); preloads[3].src = imagesPath + "input_right_xon.gif";
	preloads[4] = new Image(); preloads[4].src = imagesPath + "txtarea_bl_xon.gif";
	preloads[5] = new Image(); preloads[5].src = imagesPath + "txtarea_br_xon.gif";
	preloads[6] = new Image(); preloads[6].src = imagesPath + "txtarea_cntr_xon.gif";
	preloads[7] = new Image(); preloads[7].src = imagesPath + "txtarea_l_xon.gif";
	preloads[8] = new Image(); preloads[8].src = imagesPath + "txtarea_tl_xon.gif";
	preloads[9] = new Image(); preloads[9].src = imagesPath + "txtarea_tr_xon.gif";
}
//getting all the required elements
function getElements() {
	var re = new RegExp('(^| )'+'ntop_form'+'( |$)');
	for (var nf = 0; nf < _d.getElementsByTagName('form').length; nf++) {
		if(re.test(ntop_forms[nf].className)) {
			for(var nfi = 0; nfi < _d.forms[nf].getElementsByTagName('input').length; nfi++) {inputs.push(_d.forms[nf].getElementsByTagName('input')[nfi]);}
			for(var nfl = 0; nfl < _d.forms[nf].getElementsByTagName('label').length; nfl++) {labels.push(_d.forms[nf].getElementsByTagName('label')[nfl]);}
			for(var nft = 0; nft < _d.forms[nf].getElementsByTagName('textarea').length; nft++) {textareas.push(_d.forms[nf].getElementsByTagName('textarea')[nft]);}
			for(var nfs = 0; nfs < _d.forms[nf].getElementsByTagName('select').length; nfs++) {selects.push(_d.forms[nf].getElementsByTagName('select')[nfs]);}
		}
	}
}
//separating all the elements in their respective arrays
function separateElements() {
	var r = 0; var c = 0; var t = 0; var rl = 0; var cl = 0; var tl = 0; var b = 0;
	for (var q = 0; q < inputs.length; q++) {
		if(inputs[q].type == 'radio') {
			radios[r] = inputs[q]; ++r;
			for(var w = 0; w < labels.length; w++) {if(labels[w].htmlFor == inputs[q].id) {if(inputs[q].checked) {labels[w].className = "chosen";} radioLabels[rl] = labels[w]; ++rl;}}
		}
		if(inputs[q].type == 'checkbox') {
			checkboxes[c] = inputs[q]; ++c;
			for(var w = 0; w < labels.length; w++) {if(labels[w].htmlFor == inputs[q].id) {if(inputs[q].checked) {labels[w].className = "chosen";} checkboxLabels[cl] = labels[w]; ++cl;}}
		}
		if((inputs[q].type == "text") || (inputs[q].type == "password")) {texts[t] = inputs[q]; ++t;}
		if((inputs[q].type == "submit") || (inputs[q].type == "button")) {buttons[b] = inputs[q]; ++b;}
	}

}
function replaceRadios() {
	for (var q = 0; q < radios.length; q++) {
		//move radios out of the way
		radios[q].className = "outtaHere";
		//create div
		var radioArea = _d.createElement('div');
		if(radios[q].checked) {radioArea.className = "radioAreaChecked";} else {radioArea.className = "radioArea";}
		radioArea.style.left = findPosX(radios[q]) + 'px';
		radioArea.style.top = findPosY(radios[q]) + 'px';
		radioArea.style.margin = "1px";
		radioArea.id = "myRadio" + q;
		//insert div
		radios[q].parentNode.insertBefore(radioArea, radios[q]);
		//assign actions
		radioArea.onclick = new Function('rechangeRadios('+q+')');
		radioLabels[q].onclick = new Function('rechangeRadios('+q+')');
		if(!isIE) {radios[q].onfocus = new Function('focusRadios('+q+')'); radios[q].onblur = new Function('blurRadios('+q+')');}
		radios[q].onclick = radioEvent;
	}
	return true;
}
function focusRadios(who) {
	var what = document.getElementById('myRadio'+who);
	what.style.border = "1px dotted #333"; what.style.margin = "0";
	return false;
}
function blurRadios(who) {
	var what = document.getElementById('myRadio'+who);
	what.style.border = "0"; what.style.margin = "1px";
	return false;
}
function checkRadios(who) {
	var what = document.getElementById('myRadio'+who);
	others = _d.getElementsByTagName('div');
	for(var q = 0; q < others.length; q++) {if((others[q].className == "radioAreaChecked")&&(others[q].nextSibling.name == radios[who].name)) {others[q].className = "radioArea";}}
	what.className = "radioAreaChecked";
}
function changeRadios(who) {
	if(radios[who].checked) {
		for(var q = 0; q < radios.length; q++) {if(radios[q].name == radios[who].name) {radios[q].checked = false; radioLabels[q].className = "";}}
		radios[who].checked = true; radioLabels[who].className = "chosen";
		checkRadios(who);
	}
}
function rechangeRadios(who) {
	if(!radios[who].checked) {
		for(var q = 0; q < radios.length; q++) {if(radios[q].name == radios[who].name) {radios[q].checked = false; radioLabels[q].className = "";}}
		radios[who].checked = true; radioLabels[who].className = "chosen";
		checkRadios(who);
	}
    /* onclick 이벤트 추가 */
    var code=radios[who].getAttribute("onchange")+"";
    if (!isBlank(code)) {
        //code=code.replaceAll("this.checked",tester);
        fnEval(code);
    }
}
function radioEvent(e) {
	if (!e) var e = window.event;
	if(e.type == "click") {
        for (var q = 0; q < radios.length; q++) {
            if(this == radios[q]) {
                changeRadios(q);
                break;
            }
        }
    }
}

function replaceCheckboxes() {
	for (var q = 0; q < checkboxes.length; q++) {
		//move checkboxes out of the way
		checkboxes[q].className = "outtaHere";
		//create div
		var checkboxArea = _d.createElement('div');
		if(checkboxes[q].checked) {checkboxArea.className = "checkboxAreaChecked";} else {checkboxArea.className = "checkboxArea";}
		checkboxArea.style.left = findPosX(checkboxes[q]) + 'px';
		checkboxArea.style.top = findPosY(checkboxes[q]) + 'px';
		checkboxArea.style.margin = "1px";
		checkboxArea.id = "myCheckbox" + q;
		//insert div
		checkboxes[q].parentNode.insertBefore(checkboxArea, checkboxes[q]);
		//asign actions
		checkboxArea.onclick = new Function('rechangeCheckboxes('+q+')');
		if(!isMac.test(navigator.vendor)) {checkboxLabels[q].onclick = new Function('changeCheckboxes('+q+')');}
		else {checkboxLabels[q].onclick = new Function('rechangeCheckboxes('+q+')');}
		if(!this.ie) {checkboxes[q].onfocus = new Function('focusCheckboxes('+q+')'); checkboxes[q].onblur = new Function('blurCheckboxes('+q+')');}
		checkboxes[q].onkeydown = checkEvent;
	}
	return true;
}
function focusCheckboxes(who) {
	var what = document.getElementById('myCheckbox'+who);
	what.style.border = "1px dotted #333"; what.style.margin = "0";
	return false;
}
function blurCheckboxes(who) {
	var what = document.getElementById('myCheckbox'+who);
	what.style.border = "0"; what.style.margin = "1px";
	return false;
}
function checkCheckboxes(who, action) {
	var what = document.getElementById('myCheckbox'+who);
	if(action == true) {what.className = "checkboxAreaChecked";}
	if(action == false) {what.className = "checkboxArea";}
}
function changeCheckboxes(who) {
    /*
    if(checkboxes[who].checked) {
		//checkboxes[who].checked = true;
		checkboxLabels[who].className = "";
		checkCheckboxes(who, false);
    } else {
		//checkboxes[who].checked = false;
		checkboxLabels[who].className = "chosen";
		checkCheckboxes(who, true);
    }
*/
	if(checkboxLabels[who].className == "chosen") {
		checkboxes[who].checked = true;
		checkboxLabels[who].className = "";
		checkCheckboxes(who, false);
	}
	else if(checkboxLabels[who].className == "") {
		checkboxes[who].checked = false;
		checkboxLabels[who].className = "chosen";
		checkCheckboxes(who, true);
	}

}
function rechangeCheckboxes(who) {
	var tester = false;
	if(checkboxLabels[who].className == "chosen") {
		tester = false;
		checkboxLabels[who].className = "";
	}
	else if(checkboxLabels[who].className == "") {
		tester = true;
		checkboxLabels[who].className = "chosen";
	}
	checkboxes[who].checked = tester;
	checkCheckboxes(who, tester);

    /* onclick 이벤트 추가 */
    var code=checkboxes[who].getAttribute("onchange")+"";
    if (!isBlank(code)) {
        code=code.replaceAll("this.checked",tester);
        fnEval(code);
    }
}

/* 체크해제 함수 추가 */
function decheckCheckboxes(who) {
    checkboxLabels[who].className="";
    checkCheckboxes(who,false);
}
function fnUICheckAll(bl) {
    for (var i=0;i<checkboxes.length;i++ ) {
        if (bl){

            checkboxes[i].checked=true;
            checkboxLabels[i].className="chosen";
            checkCheckboxes(i,true);
        } else {
            checkboxes[i].checked=false;
            checkboxLabels[i].className="";
            decheckCheckboxes(i,false);
        }
    }
}
/* IE때문에 eval함수 생성 */
function fnEval(func) {

    if (isIE) {
        func=func.replaceAll("function anonymous()","");
        func=func.replaceAll("}","");
        func=func.replaceAll("{","");
        func=func.replaceAll("\n","");
    }
    eval(func);
}

function checkEvent(e) {
	if (!e) var e = window.event;
	if(e.keyCode == 32) {for (var q = 0; q < checkboxes.length; q++) {if(this == checkboxes[q]) {changeCheckboxes(q);}}} //check if space is pressed
}
function replaceSelects() {

    for(var q = 0; q < selects.length; q++) {
        if (selects[q].size==1) {

            //create and build div structure
            var selectArea = _d.createElement('div');
            var left = _d.createElement('div');
            var right = _d.createElement('div');
            var center = _d.createElement('div');
            var button = _d.createElement('a');
            var text = _d.createTextNode(selectText);
            center.id = "mySelectText"+q;
            var selectWidth = parseInt(selects[q].style.width);
            center.style.width = selectWidth - 10 + 'px';
            selectArea.style.width = selectWidth + selectRightSideWidth + selectLeftSideWidth + 'px';
            button.style.width = selectWidth + selectRightSideWidth + selectLeftSideWidth + 'px';
            button.style.marginLeft = - selectWidth - selectLeftSideWidth + 'px';
            button.href = "javascript:showOptions("+q+")";
            button.onkeydown = selectEvent;
            button.className = "selectButton"; //class used to check for mouseover
            selectArea.className = "selectArea";
            selectArea.id = "sarea"+q;
            left.className = "left";
            right.className = "right";
            center.className = "center";
            right.appendChild(button);
            center.appendChild(text);
            selectArea.appendChild(left);
            selectArea.appendChild(right);
            selectArea.appendChild(center);
            //hide the select field
            selects[q].style.display='none';
            //insert select div
            selects[q].parentNode.insertBefore(selectArea, selects[q]);
            //build & place options div
            var optionsDiv = _d.createElement('div');
            optionsDiv.style.width = selectWidth + 19 + 'px';
            optionsDiv.className = "optionsDivInvisible";
            optionsDiv.id = "optionsDiv"+q;
            optionsDiv.style.left = findPosX(selectArea) + 'px';
            optionsDiv.style.top = findPosY(selectArea) + selectAreaHeight - selectAreaOptionsOverlap + 'px';
            //get select's options and add to options div
            for(var w = 0; w < selects[q].options.length; w++) {
                var optionHolder = _d.createElement('p');
                var optionLink = _d.createElement('a');
                var optionTxt = _d.createTextNode(selects[q].options[w].text);
                optionHolder.setAttribute("title",selects[q].options[w].text);
                optionLink.href = "javascript:showOptions("+q+"); selectMe('"+selects[q].id+"',"+w+","+q+");";
                optionLink.appendChild(optionTxt);
                optionHolder.appendChild(optionLink);
                optionsDiv.appendChild(optionHolder);
                //check for pre-selected items
                if(selects[q].options[w].selected) {selectMe(selects[q].id,w,q);}

            }
            //insert options div
            _d.getElementsByTagName("body")[0].appendChild(optionsDiv);
        } else {
            if (isChrome) {
                selects[q].style.height=selects[q].size*13+'px';
                //alert(selects[q].style.height);
            }
        }
    }
}
function showOptions(g) {
    elem = document.getElementById("optionsDiv"+g);
    for (var i=0;i<selects.length;i++ )  {
        if ( selects[i].size==1) {
            if (i==g) {
                if(elem.className=="optionsDivInvisible") {elem.className = "optionsDivVisible";fnHideSelect(true);}
                else if(elem.className=="optionsDivVisible") {elem.className = "optionsDivInvisible";fnHideSelect(false);}
            } else {
                document.getElementById("optionsDiv"+i).className = "optionsDivInvisible"
            }
        }
        elem.onmouseout = hideOptions;
    }
}
function hideOptions(e) { //hiding the options on mouseout
	if (!e) var e = window.event;
	var reltg = (e.relatedTarget) ? e.relatedTarget : e.toElement;
//  onChange이벤트 때문에 제거
	if(((reltg.nodeName != 'A') && (reltg.nodeName != 'DIV')) || ((reltg.nodeName == 'A') && (reltg.className=="selectButton") && (reltg.nodeName != 'DIV'))) {
        this.className = "optionsDivInvisible";
        fnHideSelect(false);
    };
	e.cancelBubble = true;
	if (e.stopPropagation) {
        e.stopPropagation();
    }
}
function selectMe(selectFieldId,linkNo,selectNo) {
	//feed selected option to the actual select field
	selectField = document.getElementById(selectFieldId);
    var oldNo=selectField.selectedIndex;
	for(var k = 0; k < selectField.options.length; k++) {
		if(k==linkNo) {
            selectField.options[k].selected = "selected";
            if (oldNo!=linkNo) {
                //onChange이벤트를 위해서 추가
                var code=selectField.getAttribute('onchange')+"";
                if (!isBlank(code)) {
                    code=code.replace(/this.value/g,"'"+selectField.value+"'");
                    fnEval(code);
                }
            }
        }
		else {selectField.options[k].selected = "";}
	}

	//show selected option
	textVar = document.getElementById("mySelectText"+selectNo);
	var newText = _d.createTextNode(selectField.options[linkNo].text);
	textVar.replaceChild(newText, textVar.childNodes[0]);
}
function selectEvent(e) {

	if (!e) var e = window.event;
	var thecode = e.keyCode;
	switch(thecode){
		case 40: //down
			var fieldId = this.parentNode.parentNode.id.replace(/sarea/g, "");
			var linkNo = 0;
			for(var q = 0; q < selects[fieldId].options.length; q++) {if(selects[fieldId].options[q].selected) {linkNo = q;}}
			++linkNo;
			if(linkNo >= selects[fieldId].options.length) {linkNo = 0;}
			selectMe(selects[fieldId].id, linkNo, fieldId);
			break;
		case 38: //up
			var fieldId = this.parentNode.parentNode.id.replace(/sarea/g, "");
			var linkNo = 0;
			for(var q = 0; q < selects[fieldId].options.length; q++) {if(selects[fieldId].options[q].selected) {linkNo = q;}}
			--linkNo;
			if(linkNo < 0) {linkNo = selects[fieldId].options.length - 1;}
			selectMe(selects[fieldId].id, linkNo, fieldId);
			break;
		default:
			break;
	}
}
/*
function replaceTexts() {
	for(var q = 0; q < texts.length; q++) {
        var size_w=parseInt(texts[q].style.width);
        if (size_w==0||isNaN(size_w)) {size_w=texts[q].size*10;}
		texts[q].style.width = size_w+'px';
		txtLeft = _d.createElement('img'); txtLeft.src = imagesPath + "input_left.gif"; txtLeft.className = "inputCorner";
		txtRight = _d.createElement('img'); txtRight.src = imagesPath + "input_right.gif"; txtRight.className = "inputCorner";
		texts[q].parentNode.insertBefore(txtLeft, texts[q]);
		texts[q].parentNode.insertBefore(txtRight, texts[q].nextSibling);
		texts[q].className = "textinput";
		//create hovers
		texts[q].onfocus = function() {
			this.className = "textinputHovered";
			this.previousSibling.src = imagesPath + "input_left_xon.gif";
			this.nextSibling.src = imagesPath + "input_right_xon.gif";
		}
		texts[q].onblur = function() {
			this.className = "textinput";
			this.previousSibling.src = imagesPath + "input_left.gif";
			this.nextSibling.src = imagesPath + "input_right.gif";
		}
	}
}
function replaceTextareas() {
	for(var q = 0; q < textareas.length; q++) {
		var where = textareas[q].parentNode;
		var where2 = textareas[q].previousSibling;

        var size_w=parseInt(textareas[q].style.width);
        var size_h=parseInt(textareas[q].style.height);
        if(size_w==0||isNaN(size_w)) { size_w = textareas[q].cols * 10 ; }
        if(size_h==0||isNaN(size_h)) { size_h = textareas[q].rows * 10 ; }
        alert(size_h);
        textareas[q].style.width = size_w + 'px';
        textareas[q].style.height = size_h + 'px';

		//create divs
		var container = _d.createElement('div');
		container.className = "txtarea";
		container.style.width =  size_w+20+'px';
		container.style.height = size_h+20+'px';
		var topRight = _d.createElement('div');
		topRight.className = "tr";
		var topLeft = _d.createElement('img');
		topLeft.className = "txt_corner";
		topLeft.src = imagesPath + "txtarea_tl.gif";
		var centerRight = _d.createElement('div');
		centerRight.className = "cntr";
		var centerLeft = _d.createElement('div');
		centerLeft.className = "cntr_l";
		if(!this.ie) {centerLeft.style.height = size_h + 10 + 'px';}
		else {centerLeft.style.height = textareas[q].rows * 10 + 12 + 'px';}
		var bottomRight = _d.createElement('div');
		bottomRight.className = "br";
		var bottomLeft = _d.createElement('img');
		bottomLeft.className = "txt_corner";
		bottomLeft.src = imagesPath + "txtarea_bl.gif";
		//assemble divs
		container.appendChild(topRight);
		topRight.appendChild(topLeft);
		container.appendChild(centerRight);
		centerRight.appendChild(centerLeft);
		centerRight.appendChild(textareas[q]);
		container.appendChild(bottomRight);
		bottomRight.appendChild(bottomLeft);
		//insert structure
		where.insertBefore(container, where2);
		//create hovers
		textareas[q].onfocus = function() {
			this.previousSibling.className = "cntr_l_xon";
			this.parentNode.className = "cntr_xon";
			this.parentNode.previousSibling.className = "tr_xon";
			this.parentNode.previousSibling.getElementsByTagName("img")[0].src = imagesPath + "txtarea_tl_xon.gif";
			this.parentNode.nextSibling.className = "br_xon";
			this.parentNode.nextSibling.getElementsByTagName("img")[0].src = imagesPath + "txtarea_bl_xon.gif";
		}
		textareas[q].onblur = function() {
			this.previousSibling.className = "cntr_l";
			this.parentNode.className = "cntr";
			this.parentNode.previousSibling.className = "tr";
			this.parentNode.previousSibling.getElementsByTagName("img")[0].src = imagesPath + "txtarea_tl.gif";
			this.parentNode.nextSibling.className = "br";
			this.parentNode.nextSibling.getElementsByTagName("img")[0].src = imagesPath + "txtarea_bl.gif";
		}
	}
}
*/
function buttonHovers() {
	for (var i = 0; i < buttons.length; i++) {
		buttons[i].className = "buttonSubmit";
		var buttonLeft = _d.createElement('img');
		buttonLeft.src = imagesPath + "button_left.gif";
		buttonLeft.className = "buttonImg";
		buttons[i].parentNode.insertBefore(buttonLeft, buttons[i]);
		var buttonRight = _d.createElement('img');
		buttonRight.src = imagesPath + "button_right.gif";
		buttonRight.className = "buttonImg";
		if(buttons[i].nextSibling) {buttons[i].parentNode.insertBefore(buttonRight, buttons[i].nextSibling);}
		else {buttons[i].parentNode.appendChild(buttonRight);}
		buttons[i].onmouseover = function() {
			this.className += "Hovered";
			this.previousSibling.src = imagesPath + "button_left_xon.gif";
			this.nextSibling.src = imagesPath + "button_right_xon.gif";
		}
		buttons[i].onmouseout = function() {
			this.className = this.className.replace(/Hovered/g, "");
			this.previousSibling.src = imagesPath + "button_left.gif";
			this.nextSibling.src = imagesPath + "button_right.gif";
		}
	}
}
//Useful functions
function findPosY(obj) {
	var posTop = 0;
	while (obj.offsetParent) {posTop += obj.offsetTop; obj = obj.offsetParent;}
	return posTop;
}
function findPosX(obj) {
	var posLeft = 0;
	while (obj.offsetParent) {posLeft += obj.offsetLeft; obj = obj.offsetParent;}
	return posLeft;
}


