﻿var Custom = {
	init: function() {
		var inputs = document.getElementsByTagName("input"), span = Array(), textnode, option, active;
		for(a = 0; a < inputs.length; a++) {
			if((inputs[a].type == "checkbox" || inputs[a].type == "radio") && inputs[a].className == "styled" && document.getElementById(inputs[a].type + inputs[a].id) == null) {
				span[a] = document.createElement("span");
				span[a].className = inputs[a].type;
				span[a].id = inputs[a].type + inputs[a].id;

				if(inputs[a].checked == true) {
					span[a].style.backgroundPosition = "right top";
				}
				inputs[a].parentNode.insertBefore(span[a], inputs[a]);
				inputs[a].onchange = Custom.clear;
				span[a].onmousedown = Custom.pushed;
				span[a].onmouseup = Custom.check;
				document.onmouseup = Custom.clear;
			}
		}
		inputs = document.getElementsByTagName("select");
		for(a = 0; a < inputs.length; a++) {
			if(inputs[a].className == "styled" && document.getElementById("select" + inputs[a].id) == null) {
				$(inputs[a]).opacity(0);

				option = inputs[a].getElementsByTagName("option");
				active = option[0].childNodes[0].nodeValue;
				textnode = document.createTextNode(active);
				for(b = 0; b < option.length; b++) {
					if(option[b].selected == true) {
						textnode = document.createTextNode(option[b].childNodes[0].nodeValue);
					}
				}
				span[a] = document.createElement("span");
				span[a].className = "select";
				span[a].id = "select" + inputs[a].id;
				var rightSpan = document.createElement("span");
				var rightDiv = document.createElement("div");
				rightDiv.appendChild(textnode);
				rightSpan.appendChild(rightDiv);
				span[a].appendChild(rightSpan);
				
				inputs[a].parentNode.insertBefore(span[a], inputs[a]);
				$(inputs[a]).change(Custom.choose);
				
				$(inputs[a]).css('width', 'auto');
				$(inputs[a]).css('top', $(span[a]).position().top + 1);
				if ($.browser.msie) {
					if ($(inputs[a]).width() < $(span[a]).width()) {
						$(inputs[a]).css('width', ($(span[a]).width() + 2) + 'px');
					}
					//alert($(span[a]).position().left + '' + ($(span[a]).width() - $(inputs[a]).width() - 4));
					$(inputs[a]).css('left', $(span[a]).position().left + ($(span[a]).width() - $(inputs[a]).width() - 4));
				}
				else {
					if ($(inputs[a]).width() < $(span[a]).width()) {
						$(inputs[a]).css('width', ($(span[a]).width() + 2) + 'px');

						//alert($(span[a]).position().left + '' + ($(span[a]).width() - $(inputs[a]).width() - 4));
						$(inputs[a]).css('left', $(span[a]).position().left + ($(span[a]).width() - $(inputs[a]).width() - 4));
					} else {
						//alert($(span[a]).position().left + '' + ($(span[a]).width() - $(inputs[a]).width() - 4));
						$(inputs[a]).css('left', $(span[a]).position().left + ($(span[a]).width() - $(inputs[a]).width() - 4));
					}
				}

//				$(inputs[a]).hover(
//					function () {
//						var span = $(this).prevAll("span:first");

//						$(this).css('width', 'auto');
//						if ($.browser.msie) {
//							if ($(this).width() < span.width()) {
//								$(this).css('width', (span.width() + 2) + 'px');
//							}
//							$(this).css('left', (span.width() - $(this).width() - 4) + 'px');
//						}
//						else {
//							if ($(this).width() < span.width()) {
//								$(this).css('width', (span.width() + 2) + 'px');
//								$(this).css('left', (span.width() - $(this).width() - 4) + 'px');
//							} else {
//								$(this).css('left', (span.width() - $(this).width() - 4) + 'px');
//							}
//						}
//					},
//					function () { /* nothing */ }
//				);
//				$(inputs[a]).change(
//					function () {
//						alert('select');
//						var span = $(this).prevAll("span:first");
//						$(this).css('width', span.width() + 'px');
//						$(this).css('left', '0');
//					}
//				);
//				$(inputs[a]).blur(
//					function () {
//						alert('select');
//						var span = $(this).prevAll("span:first");
//						$(this).css('width', span.width() + 'px');
//						$(this).css('left', '0');
//					}
//				);
			}
		}
	},
	pushed: function() {
		element = this.nextSibling;
		if(element.checked == true) {
			this.style.backgroundPosition = "left top";
		} else {
			this.style.backgroundPosition = "right top";
		}
	},
	check: function() {
		element = this.nextSibling;
		if(element.checked == true && element.type == "checkbox") {
			this.style.backgroundPosition = "left top";
			element.checked = false;
		} else {
			if(element.type == "checkbox") {
				this.style.backgroundPosition = "right top";
			} else {
				this.style.backgroundPosition = "right top";
				group = this.nextSibling.name;
				inputs = document.getElementsByTagName("input");
				for(a = 0; a < inputs.length; a++) {
					if(inputs[a].name == group && inputs[a] != this.nextSibling) {
						inputs[a].previousSibling.style.backgroundPosition = "0 0";
					}
				}
			}
			element.checked = true;
		}
	},
	clear: function() {
		inputs = document.getElementsByTagName("input");
		for(var b = 0; b < inputs.length; b++) {
			if(inputs[b].checked == true && inputs[b].className == "styled") {
				inputs[b].previousSibling.style.backgroundPosition = "right top";
			} else if(inputs[b].className == "styled") {
				inputs[b].previousSibling.style.backgroundPosition = "left top";
			}
		}
	},
	choose: function() {
		option = this.getElementsByTagName("option");
		for(d = 0; d < option.length; d++) {
			if(option[d].selected == true) {
				document.getElementById("select" + this.id).childNodes[0].childNodes[0].childNodes[0].nodeValue = option[d].childNodes[0].nodeValue;
			}
		}
	}
}

//$(document).ready(function(){ if (!($.browser.msie && $.browser.version.substr(0,1) == '6')) { Custom.init(); } });