// JavaScript Document


YAHOO.util.Event.onDOMReady(reskinFormElements);
var file_img = "";
function initSelect() {
	
	var pos = Array();
	var selects = 	YAHOO.util.Dom.getElementsBy(function(){return true;}, "select");
	
	for(var i=0; i<selects.length; i++){
		
		if (navigator.appVersion.match("MSIE") == "MSIE"){
			selects[i].style.width = YAHOO.util.Dom.getRegion(selects[i]).right - YAHOO.util.Dom.getRegion(selects[i]).left + 15 +"px";
		
		}
		else {
			selects[i].style.width = YAHOO.util.Dom.getRegion(selects[i]).right - YAHOO.util.Dom.getRegion(selects[i]).left + 8 +"px";
		}
		pos[i] = YAHOO.util.Dom.getXY(selects[i]);
		
	}
	for(var i=0; i<selects.length; i++){
		
		setUpSelect(selects[i], pos[i]);	
	}
}
function setUpSelect(sel, pos){
	if (sel.id=="quicklinks")
		return;
	/*var input_replacement = document.createElement("input");
	input_replacement.type = "hidden";
	input_replacement.name = sel.name;
	input_replacement.id= sel.id;
	input_replacement.value=sel.value;
	 var input_replacement = sel;
	*/
	
	
	var selectOptions = sel.options; // get options for select box
	
	var selectContainer = document.createElement("div");
	selectContainer.style.visibility="hidden";
	selectContainer.className = "select_container";
	
	var first_item = document.createElement("div");
	first_item.className = "first_item";
	
	first_item.innerHTML = selectOptions[0].innerHTML;
		
	selectContainer.appendChild(first_item);
	var img = document.createElement("img");
	img.src="../common/images/forms/struc_pulldown_arrow.gif";
	img.className="arrow";
	var img_left = document.createElement("img");
	img_left.src="../common/images/forms/left_cap.gif";
	if(sel.className == "file_list"){
		img_left.src="../common/images/interface/forms/form_dropdown_report_left.gif";
	}
	img_left.className="left";
	
	var img_right = document.createElement("img");
	/*img_right.src="/common/images/interface/forms/form_dropdown_right.png";
	img_right.style.position="absolute"
	img_right.style.right="0";*/
	//selectContainer.appendChild(img_left);
	selectContainer.appendChild(img);
	
	
	var list_div = document.createElement('div');
	list_div.className="list_container";
	/*list_div.style.overflow='auto';
	list_div.style.height='100px';
	list_div.style.padding="0px";
	list_div.style.border="1px solid red;";
	*/
	selectContainer.appendChild(list_div);
	
	// add file icon to list
	if(sel.className == "file_list"){
		file_img = "<div style=\"display:block;float:left;width:10px; border:none; padding:0px; height:12px; margin:5px 5px 0px 5px; background:url(../../common/images/interface/forms/dropdown_file.png) no-repeat;\"></div>";
	}
	
	// create remaining quick links
	for (var i=0; i<selectOptions.length; i++){
		
		
		
		
		var list_item = document.createElement("div");
		if(i == (selectOptions.length - 1)){
			list_item.className = "last_item";
		}
		
		list_item.style.paddingLeft="2px";
		list_item.style.whiteSpace="nowrap";
		list_item.innerHTML = file_img + selectOptions[i].innerHTML;

		//selectContainer.appendChild(list_item);
		
		list_div.appendChild(list_item);
		
		if (selectOptions[i].selected){
			YAHOO.util.Dom.addClass(list_item, "selected");
			first_item.innerHTML = file_img + selectOptions[i].innerHTML;
		}
		
		//YAHOO.util.Event.addListener(list_item, "click", sel.onchange);
		
		if (navigator.appVersion.match("MSIE") == "MSIE"){
			YAHOO.util.Event.addListener(list_item, "click", sel.onchange);
			YAHOO.util.Event.addListener(list_item, "click", updateValue,{option:selectOptions[i], input:sel, first_item:first_item, container:selectContainer},true );
		
			
		}
		else{
			
			YAHOO.util.Event.addListener(list_item, "click", updateValue,{option:selectOptions[i], input:sel, first_item:first_item, container:selectContainer},true );	
			YAHOO.util.Event.addListener(list_item, "click", sel.onchange);
		}
		YAHOO.util.Event.addListener(list_item, "mouseover",function(){YAHOO.util.Dom.addClass(this, "select_highlight");}, list_item, true);
		YAHOO.util.Event.addListener(list_item, "mouseout",function(){YAHOO.util.Dom.removeClass(this, "select_highlight");}, list_item, true);
		
	}
	/* temp removal
	selectContainer.appendChild(input_replacement);
	*/
	var div = document.createElement("span");
	//var xy = YAHOO.util.Dom.getXY(sel);
	
	//div.style = sel.style;
	div.appendChild(img_left);
	div.appendChild(selectContainer);
	//div.appendChild(img_right);
	
	
	//sel.parentNode.replaceChild(div, sel);
	
	//sel.parentNode.appendChild(div);
	YAHOO.util.Dom.setStyle(sel, "visibility", "hidden");
	YAHOO.util.Dom.insertAfter(div, sel);
	
	
	//alert(maxHeight);
	//alert(YAHOO.util.Dom.getRegion(selectContainer).bottom - YAHOO.util.Dom.getRegion(selectContainer).top);
	
	
	
	selectContainer.setAttribute("maxHeight", YAHOO.util.Dom.getRegion(selectContainer).bottom - YAHOO.util.Dom.getRegion(selectContainer).top);
	selectContainer.setAttribute("maxWidth", YAHOO.util.Dom.getRegion(first_item).right - YAHOO.util.Dom.getRegion(first_item).left -2);// -2 account for the border
	
	
	selectContainer.setAttribute("minHeight", parseInt(selectContainer.getAttribute("maxHeight")/((sel.options.length) +1)));
	
	var maxHeight = ((YAHOO.util.Dom.getRegion(first_item).bottom - YAHOO.util.Dom.getRegion(first_item).top) *10);
	if (maxHeight < YAHOO.util.Dom.getRegion(selectContainer).bottom - YAHOO.util.Dom.getRegion(selectContainer).top)
	selectContainer.setAttribute("maxHeight", maxHeight); 
	
	
	var width_offset = 12;
	
	var div_width = YAHOO.util.Dom.getRegion(selectContainer).right - YAHOO.util.Dom.getRegion(selectContainer).left;
	div_width += width_offset;
	div.style.display="inline-block";
	div.style.position="absolute";
	//div.style.border='1px solid red';
	div.style.zIndex=100000;
	
	hideSelect(selectContainer);
	
	
	
	
	div.style.width=div_width+"px";
	
	YAHOO.util.Event.addListener([img, first_item], "click", toggleSelect, selectContainer, true);
	
	
	
	YAHOO.util.Dom.setXY(div, [pos[0], pos[1]-2]);
	//alert(YAHOO.util.Dom.getXY(div) +" -- " + YAHOO.util.Dom.getXY(sel) +" -- " +pos);
	
	
	/*if(navigator.userAgent.indexOf("Firefox/3"))
		YAHOO.util.Event.addListener(document, "focus", function(){hideSelect(selectContainer);});
	else*/
		//YAHOO.util.Event.addListener(selectContainer, "blur", function(){hideSelect(selectContainer);});
		
		
		
		
	
}
var updateValue = function(){
		this.input.value=this.option.value;
		this.first_item.innerHTML= file_img + this.option.innerHTML;
		hideSelect(this.container);
	}
function toggleSelect(){
	var height = YAHOO.util.Dom.getRegion(this).bottom - YAHOO.util.Dom.getRegion(this).top;
	
	if (height == this.getAttribute("minHeight")){
		showSelect(this);
	}
	else{// if (height == this.getAttribute("maxHeight")+1){
		hideSelect(this);
	}
	
}
function hideSelect(sel){
	var attributes = { 
		height: { to:sel.getAttribute("minHeight") }
	}; 
	sel.style.borderBottom="0px";
	
	var myAnim = new YAHOO.util.Anim(sel, attributes,.2, YAHOO.util.Easing.easeOutStrong); 
	//myAnim.onStart.subscribe(moveToBottom, this, true);
	myAnim.onComplete.subscribe(function(){this.style.visibility="visible";YAHOO.util.Dom.getElementsByClassName("list_container", "div", sel, function(){this.style.height='0px';this.style.width= sel.getAttribute("maxWidth")+"px";});}, sel, true);
	myAnim.animate(); 	
	
	
}
//var maxHeight = ((YAHOO.util.Dom.getRegion(first_item).bottom - YAHOO.util.Dom.getRegion(first_item).top) *10);
function showSelect(sel){
	//sel = this;
	
	if (navigator.appVersion.match("MSIE") == "MSIE")
		var offset = 8;
	else
		var offset = 2;
	
	var attributes = { 
		height: { to:sel.getAttribute("maxHeight") }
		//height: { to:200 }
		
		
	}; 
	YAHOO.util.Dom.getElementsByClassName("list_container", "div", sel, function(){this.style.height=sel.getAttribute("maxHeight")-23+'px';
		//	alert((YAHOO.util.Dom.getRegion(sel).right-YAHOO.util.Dom.getRegion(sel).left));
																													  
							} );
	//sel.style.width='58px';
	sel.style.borderBottom="1px solid #ffffff";
	var myAnim = new YAHOO.util.Anim(sel, attributes,.1, YAHOO.util.Easing.easeOut); 
	//myAnim.onStart.subscribe(moveToBottom, this, true);
	//myAnim.onComplete.subscribe(function(){quickLinksOpen=true;});
	myAnim.animate(); 	
	
	
}
function reskinFormElements(){
	initSelect();
	convertInputs(YAHOO.util.Dom.getElementsByClassName("zu_text", "input"));
	convertInputs(YAHOO.util.Dom.getElementsByClassName("zu_textarea", "textarea"));
	convertInputs(YAHOO.util.Dom.getElementsByClassName("button", "input"));
	convertCheckBox(YAHOO.util.Dom.getElementsByClassName("zu_check", "input"));
	convertRadioButton(YAHOO.util.Dom.getElementsByClassName("zu_radio", "input"));

}

function convertCheckBox(inputs){
	
	for (var i=0; i<inputs.length; i++){
		inputs[i].style.display = "none";
		var on_img = new Image();
		on_img.src='../common/images/forms/checkbox_checked.gif';
		
		var off_img = new Image();
		off_img.src='../common/images/forms/struc_checkbox.gif';
		
		YAHOO.util.Event.addListener(on_img, "click", handleCheck, {checkbox:inputs[i], curImg:on_img,newImg:off_img,  checked:'checked'}, true);
		YAHOO.util.Event.addListener(off_img, "click", handleCheck, {checkbox:inputs[i], curImg:off_img,newImg:on_img, checked:''}, true);
		
		if(inputs[i].checked)
			YAHOO.util.Dom.insertAfter(on_img, inputs[i]);
		else
			YAHOO.util.Dom.insertAfter(off_img, inputs[i]);
		
	}
}
function handleCheck(o){
	var input = this.checkbox;
	var curImg = this.curImg;
	var newImg = this.newImg
	var checked = this.checked;
	
	
	curImg.parentNode.replaceChild(newImg, curImg); // replace		
	if(checked == "")
		input.checked='checked';
	else
		input.checked='';
	
}
function convertRadioButton(inputs){
	for (var i=0; i<inputs.length; i++){
		
		inputs[i].style.display = "none";
		
		
		var group = Array();
		for(var j=0; j<inputs.length; j++){
			if(inputs[i].name == inputs[j].name){
				
				group.push({radio:inputs[j]});
				
			}
		}
		var on_img = new Image();
		on_img.src='../common/images/interface/forms/form_radio_on.gif';
		
		var off_img = new Image();
		off_img.src='../common/images/interface/forms/form_radio_off.gif';
		
		
		//YAHOO.util.Event.addListener(off_img, "click",inputs[i].onclick);
		//YAHOO.util.Event.addListener(off_img, "click",inputs[i].onclick);
		
		
		
		
		if(inputs[i].checked){
			if(navigator.userAgent.indexOf("MSIE 7.0") >= 0){
				YAHOO.util.Event.addListener(off_img, "click",inputs[i].onclick);
				YAHOO.util.Event.addListener(on_img, "click", handleRadio, {radio:inputs[i], group:group}, true);
			}
			else {
				YAHOO.util.Event.addListener(on_img, "click", handleRadio, {radio:inputs[i], group:group}, true);
				YAHOO.util.Event.addListener(off_img, "click",inputs[i].onclick);	
			}
			
			YAHOO.util.Dom.insertAfter(on_img, inputs[i]);
		}
		else {
			if(navigator.userAgent.indexOf("MSIE 7.0") >= 0){
				YAHOO.util.Event.addListener(off_img, "click",inputs[i].onclick);
				YAHOO.util.Event.addListener(off_img, "click", handleRadio, {radio:inputs[i], group:group}, true);
			}
			else{
				YAHOO.util.Event.addListener(off_img, "click", handleRadio, {radio:inputs[i], group:group}, true);
				YAHOO.util.Event.addListener(off_img, "click",inputs[i].onclick);
			}
			YAHOO.util.Dom.insertAfter(off_img, inputs[i]);
		}
	}
}
function handleRadio(o){
	var checked;
	var curInput = this.radio;
	
	
	
	
	//	curInput.checked = "checked";
		
	
	
	var group = this.group;
	for(var i=0; i<group.length; i++){
		var myImg = YAHOO.util.Dom.getNextSibling(group[i].radio);
		if (group[i].radio != curInput){
			var off_img = new Image();
			off_img.src='../common/images/interface/forms/form_radio_off.gif';
			
			
			if(navigator.userAgent.indexOf("MSIE 7.0") >= 0){
				YAHOO.util.Event.addListener(off_img, "click",curInput.onclick);
				YAHOO.util.Event.addListener(off_img, "click", handleRadio, {radio:group[i].radio, group:group}, true);
			}
			else{
				YAHOO.util.Event.addListener(off_img, "click", handleRadio, {radio:group[i].radio, group:group}, true);
				YAHOO.util.Event.addListener(off_img, "click",curInput.onclick);
			}

			myImg.parentNode.replaceChild(off_img, myImg); // replace	
			group[i].radio.checked="";
		}
		else {
			var on_img = new Image();
			on_img.src='../common/images/interface/forms/form_radio_on.gif';
			
			if(navigator.userAgent.indexOf("MSIE 7.0") >= 0){
				YAHOO.util.Event.addListener(on_img, "click",curInput.onclick);
				YAHOO.util.Event.addListener(on_img, "click", handleRadio, {radio:group[i].radio, group:group}, true);
			}
			else{
				YAHOO.util.Event.addListener(on_img, "click", handleRadio, {radio:group[i].radio, group:group}, true);
				YAHOO.util.Event.addListener(on_img, "click",curInput.onclick);
			}
			myImg.parentNode.replaceChild(on_img, myImg); // replace	
			group[i].radio.checked="checked";
		}
		

		/*var input = group[i].checkbox;
		var curImg = group[i].curImg;
		var newImg = group[i].newImg
		var checked = group[i].checked;
	
	
		curImg.parentNode.replaceChild(newImg, curImg); // replace		
		if(checked == "")
			input.checked='checked';
		else
			input.checked='';
			
		*/
	}
	
}

function convertInputs(inputs){
	
	
	

	for (var i=0; i<inputs.length; i++){
	//	if((inputs[i].type == "password" || inputs[i].type == "text") && inputs[i].parentNode.className != "input_wrapper"){
			
			inputs[i].style.border="none";
			
		
			var wrapper = document.createElement('div');
			wrapper.className=inputs[i].type+"_wrapper";
			
			
			var top_left = document.createElement('div');
			top_left.className="top_left_wrapper";
			
			
			var top = document.createElement('div');
			top.className="top_wrapper";
			
			var top_right = document.createElement('div');
			top_right.className="top_right_wrapper";
			var left = document.createElement('div');
			left.className="left_wrapper";
			
			var right = document.createElement('div');
			right.className="right_wrapper";
			
			var bottom_left = document.createElement('div');
			bottom_left.className="bottom_left_wrapper";
			var bottom = document.createElement('div');
			bottom.className="bottom_wrapper";
			
			var bottom_right = document.createElement('div');
			bottom_right.className="bottom_right_wrapper";
			
			var newInput = inputs[i].cloneNode(true); // clone node
			
			
			//wrap input
			wrapper.appendChild(top_left);
			wrapper.appendChild(top);
			wrapper.appendChild(top_right);
			wrapper.appendChild(left);
			wrapper.appendChild(newInput);
			wrapper.appendChild(right);
			wrapper.appendChild(bottom_left);
			wrapper.appendChild(bottom);
			wrapper.appendChild(bottom_right);
			
			inputs[i].parentNode.replaceChild(wrapper, inputs[i]); // replace
			
			
			var input_h = YAHOO.util.Dom.getRegion(newInput).bottom - YAHOO.util.Dom.getRegion(newInput).top;
			var input_w = YAHOO.util.Dom.getRegion(newInput).right - YAHOO.util.Dom.getRegion(newInput).left;
			
			wrapper.style.height=parseInt(input_h) +6+"px"; //4
			wrapper.style.width=parseInt(input_w)+12+"px"; //4
			top.style.width=input_w+"px";
			left.style.height=parseInt(input_h) +"px"; // 0
			
			right.style.height=parseInt(input_h) +"px"; // 0
			bottom.style.width=width=input_w+"px";
		//}
	}
		
}
function convertTextareas(inputs){
	var wrapperOffset = 4;
	var spacerHeight = 2;
	var spacerWidth = 0;
	if (navigator.appVersion.match("MSIE") == "MSIE"){
		wrapperOffset = 6;
		spacerHeight = 2;
		spacerWidth = 2;
	}
	///var inputs = document.getElementsByTagName("textarea");
	for (var i=0; i<inputs.length; i++){
		if( inputs[i].parentNode.className != "input_wrapper"){
		
			
			inputs[i].style.border="none";	
			
			var wrapper = document.createElement('div');
			wrapper.className="input_wrapper";
			wrapper.style.height=parseInt(inputs[i].style.height)+wrapperOffset +"px";
			wrapper.style.width=parseInt(inputs[i].style.width)+wrapperOffset +"px";
			var top_left = document.createElement('div');
			top_left.className="top_left_wrapper";
			var top = document.createElement('div');
			top.className="top_wrapper";
			top.style.width=parseInt(inputs[i].style.width)+spacerWidth+"px"; //0
			var top_right = document.createElement('div');
			top_right.className="top_right_wrapper";
			var left = document.createElement('div');
			left.className="left_wrapper";
			left.style.height=parseInt(inputs[i].style.height)+2 +"px";
			var right = document.createElement('div');
			right.className="right_wrapper";
			right.style.height=parseInt(inputs[i].style.height)+2 +"px";
			var bottom_left = document.createElement('div');
			bottom_left.className="bottom_left_wrapper";
			var bottom = document.createElement('div');
			bottom.className="bottom_wrapper";
			bottom.style.width=parseInt(inputs[i].style.width)+spacerWidth+"px"; //0
			var bottom_right = document.createElement('div');
			bottom_right.className="bottom_right_wrapper";
			var newInput = inputs[i].cloneNode(true); // clone node
			
			//wrap input
			wrapper.appendChild(top_left);
			wrapper.appendChild(top);
			wrapper.appendChild(top_right);
			wrapper.appendChild(left);
			wrapper.appendChild(newInput);
			wrapper.appendChild(right);
			wrapper.appendChild(bottom_left);
			wrapper.appendChild(bottom);
			wrapper.appendChild(bottom_right);
			
			inputs[i].parentNode.replaceChild(wrapper, inputs[i]); // replace
		
		}
		
	}
		
}