/**
 * Select boxes replacer
 * by ZeT, http://zet.od.ua
 *
 * based on http://www.easy-designs.net/articles/replaceSelect2/
 */

function Sbr (id) {
	if (id && (form = document.getElementById(id))) {
		this.s = form.getElementsByTagName('select');
	} else {
		this.s = document.getElementsByTagName('select');
	}
	for (var i=0; i<this.s.length; i++) {
		if (!this.s[i].id) {
			this.s[i].id = 'select_'+i;
		}
		this.init(this.s[i], i);
	}
}

Sbr.prototype.init = function(obj, counter) {
	
	// building faux select structure
	var fauxSel = document.createElement('dl');
	fauxSel.className = obj.className ? obj.className + ' sbrWrap' : 'sbrWrap';
	fauxSel.onclick = function() {
		if (this.childNodes[0].className == '') {
			this.nextSibling.focus();
		}
		this.childNodes[1].className = this.childNodes[1].className == 'sbrOptsCol' ? 'sbrOptsExp' : 'sbrOptsCol';
	}
	
	var curOpt = document.createElement('dt');
	curOpt.className = '';
	fauxSel.appendChild(curOpt);
	var optsWrap = document.createElement('dd');
	optsWrap.className = 'sbrOptsCol';
	fauxSel.appendChild(optsWrap);
	var optsList = document.createElement('ul');
	optsWrap.appendChild(optsList);
	optsList.style.zIndex = fauxSel.style.zIndex = 1000-counter;
	
	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() {
			mySbr.selectMe(this); // below should be: mySbr = new Sbr();
		}
		if (i == selectedOpt) {
			li.className = 'sbrSelected';
			curOpt.appendChild(txt.cloneNode(false));
		}
		if (window.attachEvent) {
			li.onmouseover = function() {
				this.className += ' hover';
			}
			li.onmouseout = function() {
				this.className = this.className.replace(new RegExp(" hover\\b"), '');
			}
		}
		optsList.appendChild(li);
	}
	obj.onfocus = function() {
		this.previousSibling.childNodes[0].className = 'sbrFocused';
	}
	obj.onblur = function() {
		this.previousSibling.childNodes[0].className = '';
	}
	obj.onchange = function() {
		var idx = this.selectedIndex;
		var ul = this.previousSibling.childNodes[1].childNodes[0];
		mySbr.selectMe(ul.childNodes[idx]);
	}
	obj.onkeypress = obj.onchange;
	
	obj.className += ' selReplaced'; // for hiding select box
	obj.parentNode.insertBefore(fauxSel,obj);
}

Sbr.prototype.selectMe = function(liObj) {
	var lis = liObj.parentNode.getElementsByTagName('li');
	for (var i=0; i<lis.length; i++) {
		if (lis[i] != liObj) {
			lis[i].className = '';
			lis[i].onclick = function() {
				mySbr.selectMe(this); // below should be: mySbr = new Sbr();
			}
		} else {
			this.setVal(liObj.selectID, liObj.selIndex);
			liObj.className = 'sbrSelected';
			var curOpt = liObj.parentNode.parentNode.parentNode.childNodes[0];
			curOpt.removeChild(curOpt.childNodes[0]);
			curOpt.appendChild(liObj.childNodes[0].cloneNode(false));
		}
	}
}

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

/*	//initialize:
		window.onload = function() {mySbr = (document.all && !window.print) ? null : new Sbr();};
*/