/*
Form Design: Accessible & Pretty forms elements (all of them) with css/javascript
Author: Steven Moye
*/

function styleForm(container)
{
	//Check for Primary Argument
	if(!container){ var container = [".styleText",".styleCheck",".styleRadio",".styleFile",".styleSelect",".styleSubmit"]; }
	
	//create array describing the kind of elements being mirrored; ex: ["text","checkbox","radio","file","select-one","submit"]
	var types = new Array(); 
	for(x in container){
		var obj = $(container[x]+" input, "+container[x]+" select, "+container[x]+" textarea")[0];
		var val = ' ';
		if(obj){val += obj.type.toString();}
		types.push(val);
	}
	
	//Add span mirrors
	var cList =container[0];
	var cList2 =container[0]+" input";
	for(i=0;i<container.length;i++){ //Looping through the container array	
		if(i>0){
			cList += ", "+container[i];
			cList2 += ", "+container[i]+" input";
		}
		createReplacements(container[i]+" input",i,types[i]);
		createReplacements(container[i]+" select",i,types[i]);
		
		$(container[i]+" input").click(function(){ 	
			var cn = getUname(this.className);
			var num=cn.substring(4,5);
			var num2= parseInt(cn.substring(7),10);
			
			//get the span related to said input button
			var selector = container[parseInt(cn.substring(7),10)]+" span."+cn;

			if(types[num2]){
				if(types[num2].match("radio")){
					$(container[num2]+" span").removeClass("selected");
					$(selector)[0].className += " selected";
				}
				if(types[num2].match("checkbox")){
					if($(selector)[0].className.match("selected")){
						$(selector)[0].className=$(selector)[0].className.replace(/selected/,"");	
					}
					else{
						$(selector)[0].className+=" selected";
					}
				}
			}
			//return true;
		});

		$(container[i]+" input,"+ container[i]+" select").bind("mouseenter",function(){ 
			$("."+getUname(this.className)).addClass("hover");
		});
		$(container[i]+" input,"+ container[i]+" select").bind("mouseleave",function(){ 
			$("."+getUname(this.className)).removeClass("hover");
		});
	}
	
	$(cList).addClass("jsStyle");	
	
	//Apply preset "checked"/"selected" status on span tags
	for(i=0;i<$(cList2).length;i++)
	{
		//If 'checked'
		if($(cList2)[i].checked==true){
			var cn = getUname($(cList2)[i].className);
			$(".jsStyle span."+cn).addClass("selected");
		}
	}	
	
	//send 'focus' state to span mirrors
	$("input, textarea, select").bind("focus", function(){
		$(".jsStyle *").removeClass("focused");
		if(this.className.match("cRad")){
			$("."+getUname(this.className)).addClass("focused");
		}
   	 });
	$("#searchBox").css({'display':'block'});
	
	function createReplacements(selector,num,type) 
	{ 
		for(var i=0;i<$(selector).length;i++){
			var Cname = "cRad"+i+"in"+num;
			$(selector+":eq("+i+")").addClass(Cname+" origElem");
			$(selector+":eq("+i+")").after("<span class='"+Cname+"'> &nbsp;</span>");
		}
		if(type.match('file')){
			if($("input."+Cname)[0]){
				$("span."+Cname)[0].innerHTML = $("input."+Cname)[0].value;
			}
			$("input."+Cname).bind("change", function(){
				$("span."+Cname)[0].innerHTML = this.value;
			});
		}
		if(type.match('select-one')){
			if($("select."+Cname)[0]){
				$("span."+Cname)[0].innerHTML = "Any";//$("select."+Cname)[0].value;
			}
			$("select."+Cname).bind("change", function(){
				$("span."+Cname)[0].innerHTML = this.value;
				$("select."+Cname+" option").each(function(){
					if(this.value == $("span."+Cname)[0].innerHTML){
						$("span."+Cname)[0].innerHTML = this.text;	
					}
				});
				$("#go").addClass("focus");
				$("#go")[0].focus();
			});
		}
	}
	
	function getUname(c)
	{	
		//make "cRad..." the first value in the string
		var c = c.substr(c.indexOf("cRad"));
		
		//Strip any additional classnames after "cRad..." out and return the only one left.
		var daNum = c.length;
		if(c.indexOf(" ")>=0){ 
			daNum = c.indexOf(" "); 
		}
		return c.substr(0,daNum);
	}
}