var isIE = (/msie/).test( navigator.userAgent.toLowerCase() );
var activeSelect = null;

function doAddEventListenr(el, evname, func)
{
	if(el.attachEvent)
	{
		el.attachEvent("on"+evname,func);
	}
	else if(el.addEventListener)
	{
		el.addEventListener(evname,func,true);
	}
	else
	{
		el["on"+evname]=func;
	}
};

function getClassName(i, length)
{
	if(1 == length)
	{
		return 'first last';
	}

	if(0 == i)
	{
		return 'first';
	}

	if((i+1) == length)
	{
		return 'last';
	}

	return 'center';
}

function closeSelectDD( ul )
{
	ul.className = ul.className.replace(new RegExp(" selectOpen\\b"), '');
	ul.className = ul.className.replace(new RegExp("_select_open\\b"), '_select_closed');
	activeSelect = null;
}

function initSelectedItem(li)
{
	li.className += ' selected';
	li.onclick = function()
	{
		if(activeSelect)
		{
			closeSelectDD( activeSelect );
		}

		activeSelect = li.parentNode;
		this.parentNode.className  = this.parentNode.className.replace(new RegExp("_select_closed\\b"), '_select_open');
		this.parentNode.className += ' selectOpen';
		this.onclick = function()
		{
			selectMe(this);
		};
	};
}

function tryCloseSelectDD( ev )
{
	if( activeSelect )
	{
		var te = ( isIE ) ? window.event.srcElement : ev.target;
		if(te != activeSelect && te.parentNode != activeSelect)
		{
			var lis = activeSelect.parentNode.getElementsByTagName('li');
			for (var i=0; i<lis.length; i++)
			{
				if(! (/ selected/).test(lis[i].className))
				{

					lis[i].className = getClassName(i, lis.length);
					lis[i].onclick   = function()
					{
						selectMe(this);
					};
				}
				else
				{
					setVal(lis[i].selectID, lis[i].selIndex);

					lis[i].className = getClassName(i, lis.length);
					closeSelectDD( activeSelect );
					initSelectedItem( lis[i] );
				}
			}
		}
	}
}

function selectReplacement(obj)
{
	var ul = document.createElement('ul');
	ul.className   = obj.className + ' selectReplacement';
	obj.className += ' replaced';
	obj.onchang    = function()
	{
		alert('change ...');
	}

	var opts = obj.options;
	var selectedOpt = (!obj.selectedIndex) ? 0 : obj.selectedIndex;
	for (var i=0; i<opts.length; i++)
	{
		var li  = document.createElement('li');
		var txt = document.createTextNode(opts[i].text);
		li.appendChild(txt);
		li.selIndex = i;
		li.selectID = obj.id;
		li.onclick = function()
		{
			selectMe(this);
		};

		li.className = getClassName(i, opts.length);

		if(i == selectedOpt)
		{
			initSelectedItem( li );
		}

		if (window.attachEvent)
		{
			li.onmouseover = function()
			{
				this.className += ' hover';
			};

			li.onmouseout = function()
			{
				this.className = this.className.replace(new RegExp(" hover\\b"), '');
			};
		}
		ul.appendChild(li);
	}

	obj.onfocus = function()
	{
		ul.className += ' selectFocused';
	};

	obj.onblur = function()
	{
		ul.className = 'selectReplacement';
	};

	obj.fixUp = function()
	{
		var idx = this.selectedIndex;
		selectMe(ul.childNodes[idx]);
	}

	obj.onkeypress = obj.onchange;
	obj.parentNode.insertBefore(ul,obj);
}

function selectMe(obj)
{
	var lis = obj.parentNode.getElementsByTagName('li');
	for (var i=0; i<lis.length; i++)
	{
		if (lis[i] != obj)
		{
			lis[i].className = getClassName(i, lis.length);
			lis[i].onclick   = function()
			{
				selectMe(this);
			};
		}
		else
		{
			setVal(obj.selectID, obj.selIndex);

			obj.className = getClassName(i, lis.length);
			closeSelectDD( obj.parentNode );
			initSelectedItem( obj );
		}
	}
}

function setVal(objID,val)
{
	var obj = document.getElementById(objID);
	obj.selectedIndex = val;

	if(obj.onchange)
	{
		obj.onchange();
	}
}

function replaceAllSelect()
{
	var s = document.getElementsByTagName('select');
	for (var i=0; i<s.length; i++)
	{
		selectReplacement(s[i]);
	}

	doAddEventListenr(document, "mousedown", tryCloseSelectDD);
}