sels = new Array();
new_sels = new Array();
buttons = new Array();
new_buttons = new Array();
inputs = new Array();
inputs = document.getElementsByTagName('input');

function replace_checkboxes()
{
	checkboxes = getInputsByType("checkbox");
	for(i=0; i<checkboxes.length; i++)
	{
		new_cb = document.createElement("div");
		new_cb_a = document.createElement("a");
		
		new_class = checkboxes[i].checked ? "checkbox_sel" : "checkbox_unsel";
		new_cb.setAttribute("class", new_class);
		new_cb.setAttribute("className", new_class);
		new_cb.setAttribute("id", "cb_div_"+i);
		new_cb_a.setAttribute("href", "javascript:do_checkbox_a('cb_div_"+i+"')");
		new_cb_a.style.display = "block";
		//new_cb_a.innerHTML = "&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;";
		
		new_cb.appendChild(new_cb_a);
		
		checkboxes[i].parentNode.insertBefore(new_cb, checkboxes[i]);
		checkboxes[i].style.display = "none";
	}
}

function replace_text_inputs()
{
	//get all text inputs
	texts = new Array();
	for(t=0; t<inputs.length; t++)
	{
		if(inputs[t].getAttribute("type") == "text")
		{
			texts.push(inputs[t]);
		}
	}
	
	for(i=0; i<texts.length; i++)
	{
		text = document.createElement('div');
		input = document.createElement('input');
		text_left = document.createElement('div');
		text_right = document.createElement('div');
		
		text.setAttribute("class", "text_input");
		text.setAttribute("className", "text_input");
		text.style.width = texts[i].clientWidth + 16 +"px";
		input.setAttribute("class", "main");
		input.setAttribute("className", "main");
		input.setAttribute("type", "text");
		input.setAttribute("value", texts[i].value);
		input.setAttribute("size", texts[i].getAttribute("size"));
		input.setAttribute("maxlength", texts[i].getAttribute("maxlength"));
		input.setAttribute("name", texts[i].getAttribute("name"));
		text_left.setAttribute("class", "left");
		text_left.setAttribute("className", "left");
		text_right.setAttribute("class", "right");
		text_right.setAttribute("className", "right");
		
		text.appendChild(text_left);
		text.appendChild(input);
		text.appendChild(text_right);
		texts[i].parentNode.insertBefore(text, texts[i]);
		
		texts[i].style.display = "none";
		texts[i].setAttribute("name", "");
	}
}

function replace_buttons()
{
	// get all of our buttons 
	for(b=0; b<inputs.length; b++)
	{
		if(inputs[b].getAttribute("type") == "button" || inputs[b].getAttribute("type") == "submit")
		{
			buttons.push(inputs[b]);
		}
	}
	
	for(i=0; i<buttons.length; i++)
	{
		type = buttons[i].getAttribute("type");
		inp = document.createElement('div');
		inp_a = document.createElement('a');
		inp_left = document.createElement('div');
		inp_main = document.createElement('div');
		inp_right = document.createElement('div');
		
		inp.setAttribute("class", "button");
		inp.setAttribute("className", "button");
		oc = (type == "submit" ? "document.contact_form.submit()" : buttons[i].getAttribute("onclick"));
		
		new_id = buttons[i].id ? "button_"+buttons[i].id : "button_"+i;
		
		inp.setAttribute("id", new_id);
		inp_a.setAttribute("href", "javascript:"+oc);
		inp_a.setAttribute("onmouseover", "hover_button('"+new_id+"', 'on')");
		inp_a.setAttribute("onmouseout", "hover_button('"+new_id+"', 'off')");
		inp_left.setAttribute("class", "left");
		inp_left.setAttribute("className", "left");
		inp_main.setAttribute("class", "main");
		inp_main.setAttribute("className", "main");
		inp_right.setAttribute("class", "right");
		inp_right.setAttribute("className", "right");
		
		inp_main.innerHTML = buttons[i].value;
		inp.appendChild(inp_a);
		inp_a.appendChild(inp_left);
		inp_a.appendChild(inp_main);
		inp_a.appendChild(inp_right);
		buttons[i].parentNode.insertBefore(inp, buttons[i]);
		new_buttons.push(inp);
		buttons[i].style.display = "none";
	}
}

function replace_selects()
{
	sels = document.getElementsByTagName('select');
	for(i=0; i<sels.length; i++)
	{
		sel_input = document.createElement('div');
		sel_left = document.createElement('div');
		sel_main = document.createElement('div');
		sel_right = document.createElement('div');
		
		sel_input.setAttribute("class", "select_input");
		sel_input.setAttribute("className", "select_input");
		sel_left.setAttribute("class", "selLeft");
		sel_left.setAttribute("className", "selLeft");
		sel_main.setAttribute("class", "selMain");
		sel_main.setAttribute("className", "selMain");
		sel_main.setAttribute("id", "sel_main_"+i);
		sel_right.setAttribute("class", "selRight");
		sel_right.setAttribute("className", "selRight");
		
		button = document.createElement("a");
		button.href="javascript:show_opts('optionBlock_"+i+"')";
		button.style.display = "block";
		button.style.width="100%";
		button.style.height="100%";
		sel_right.appendChild(button);
		
		text = document.createTextNode(sels[i].options[sels[i].selectedIndex].text);
		
		sel_main.appendChild(text);
		sel_input.appendChild(sel_left);
		sel_input.appendChild(sel_main);
		sel_input.appendChild(sel_right);
		
		sels[i].parentNode.insertBefore(sel_input, sels[i]);
		
		// build options block
		op_block = document.createElement('div');
		op_block.setAttribute("class", "optionBlock");
		op_block.setAttribute("className", "optionBlock");
		largest = 0;
		for(op=0; op<sels[i].options.length; op++)
		{
			p = document.createElement('p');
			a = document.createElement('a');
			a.innerHTML = sels[i].options[op].text;
			a.href = "javascript:select_option("+i+", "+op+")";
			a.setAttribute("onmouseover", "window.status = ''; return true;");
			p.appendChild(a);
			op_block.appendChild(p);
		}
		op_block.style.left = findPosX(sel_input) + "px";
		op_block.style.top = findPosY(sel_input) + 20 + "px";
		op_block.style.width = sels[i].clientWidth + "px";
		op_block.style.display = "none";
		op_block.setAttribute("id", "optionBlock_"+i);
		document.getElementsByTagName("body")[0].appendChild(op_block);
		sel_main.style.width = sels[i].clientWidth - 25 + "px";
		sels[i].style.display = "none";
		new_sels.push(sel_input);
	}
}

function hover_button(div_id, dir)
{
	div = document.getElementById(div_id);
	a = div.childNodes[0];
	sup_class = dir == "on" ? "_sel" : "";
	
	a.childNodes[0].setAttribute("class", "left"+sup_class);
	a.childNodes[0].setAttribute("className", "left"+sup_class);
	
	a.childNodes[1].setAttribute("class", "main"+sup_class);
	a.childNodes[1].setAttribute("className", "main"+sup_class);
	
	a.childNodes[2].setAttribute("class", "right"+sup_class);
	a.childNodes[2].setAttribute("className", "right"+sup_class);
}

function select_option(sel_id, op_id)
{
	opts = document.getElementById(sel_id);
	//sels = document.getElementsByTagName('select');
	sel_main = document.getElementById("sel_main_"+sel_id);
	
	new_text = sels[sel_id].options[op_id].text;
	new_val = sels[sel_id].options[op_id].value;
	sels[sel_id].value = new_val;
	sel_main.innerHTML = new_text;
	show_opts("optionBlock_"+sel_id)
}

function show_opts(id)
{
	sel = document.getElementById(id);
	if(sel.style.display == "none")
	{
		sel.style.display = "block";
	}
	else
	{
		sel.style.display = "none";
	}
}

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;
}

function getInputsByType(type)
{
	typed_inputs = new Array();
	for(i=0; i<inputs.length; i++)
	{
		if(inputs[i].type == type) typed_inputs.push(inputs[i]);
	}
	return typed_inputs;
}

function do_checkbox_a(cb_div_id)
{
	div = document.getElementById(cb_div_id);
	cb = div.nextSibling;
	cb.click();
	
	if(cb.checked)
	{
		div.setAttribute("class", "checkbox_sel");
		div.setAttribute("className", "checkbox_sel");
	}
	else
	{
		div.setAttribute("class", "checkbox_unsel");
		div.setAttribute("className", "checkbox_unsel");
	}
}

function convert_page()
{
	replace_buttons();
	replace_text_inputs();
	replace_checkboxes();
	replace_selects();
}
