var SelectControl = {
	init: function(list) {
		if (list != undefined) {
			for (var i=0; i<list.length; i++)
				if (document.getElementById(list[i] + 'Input').offsetWidth>0) SelectControl.generateById(list[i])
		}
		else {
			el = document.getElementsByTagName('select');
			for (var i=0; i<el.length; i++)
				SelectControl.generateAll(el[i])
		}
	    window.onresize = function() {			
	        SelectControl.closeAll();
	    }
	},
	
	generateById: function(id) {
		
		var select_html = document.getElementById(id);
		var input = document.getElementById(id + 'Input');
		
		var list = document.getElementById(id + '_list');
		if(list != null) {
			list.parentNode.removeChild(list);
			list = null;
		}
		list = document.createElement('div');		
		list.id = id + '_list';
		list.className = 'listbox';
		list.style.display = 'none';
		list.style.top = SelectControl.findPos(input)[1] + input.offsetHeight + 'px'
		list.style.left = SelectControl.findPos(input)[0] + 'px';
		list.style.width = input.offsetWidth - 2 + 'px';

		var frame = document.getElementById(id + '_frame');
		if(frame != null) {
			frame.parentNode.removeChild(frame);
			frame = null;
		}
		frame = document.createElement('iframe');
				
		frame.id = id + '_frame';
		frame.className = 'listbox';
		frame.style.top = list.style.top;
		frame.style.left = list.style.left;
		
		for (var i = 0; i < select_html.length; i++) {
			var option = document.createElement('p');
			var n = i;
			var text = select_html.options[i].text;
			if (text == "") text = "&nbsp";
			option.className = i;
			option.innerHTML = text;
			option.style.width = input.offsetWidth - 6 + 'px';
			list.appendChild(option);
			
			option.onclick = function () {
				SelectControl.changeView(list, frame);
				//отличается от верстки, правил А. Левин
				select_html.selectedIndex = this.className.substr(0, 2); 
				input.value = this.innerHTML;
			};
			option.onmouseover = function() {
				this.className += ' sel_cover';
			};
			option.onmouseout = function() {
				this.className = this.className.slice(0,-10);
			};	
		}
	
		if($.browser.ie) $(frame).appendTo($('#all'));
		$(list).appendTo($('#all'));

		input.onclick = function () {
			if (document.getElementById(input.id.slice(0,-5) + '_list').style.display == 'none') {
				SelectControl.closeAll();
				SelectControl.changeView(list, frame)
			}else {SelectControl.closeAll();}
		}
		
		document.onclick = function(e) {
			var posx = 0;
			var posy = 0;
			if (!e) var e = window.event;
			if (e.pageX || e.pageY) {
				posx = e.pageX;
				posy = e.pageY;
			}
			else if (e.clientX || e.clientY) {
				posx = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
				posy = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
			}
			curleft = SelectControl.findPos(input)[0];
			curtop = SelectControl.findPos(input)[1];
			if (posy > curtop && posy < curtop + input.offsetHeight && posx > curleft && posx < curleft + input.offsetWidth && document.getElementById(input.id.slice(0,-5) + '_list').style.display != 'none') {
				return;
			}
			else {
				SelectControl.closeAll();
			}
		}
		
		$(input).keyup(
			function (e) {
				var result = $('div#' + id + '_list > p.sel_cover')[0];
				switch(e.keyCode) {
					case 38:
						if (result) {
							result.className = result.className.slice(0,-10);
							if (result.className > 0) {
								$('div#' + id + '_list > p')[parseInt(result.className) - 1].className += ' sel_cover';
							}
							else {
								$('div#' + id + '_list > p')[select_html.length - 1].className += ' sel_cover';
							}
						}
						else {
							$('div#' + id + '_list > p')[select_html.length - 1].className += ' sel_cover';
						}
						break;
					case 40:
						if (list.style.display == 'none') {
							SelectControl.changeView(list, frame)
						}
						if (result) {
							result.className = result.className.slice(0,-10);
							if (result.className < select_html.length - 1) {
								$('div#' + id + '_list > p')[parseInt(result.className) + 1].className += ' sel_cover';
							}
							else {
								$('div#' + id + '_list > p')[0].className += ' sel_cover';
							}
						}
						else {
							$('div#' + id + '_list > p')[0].className += ' sel_cover';
						}
						break;
					case 13:
							select_html.selectedIndex = result.className.slice(0,-10);
							input.value = result.innerHTML;
							SelectControl.changeView(list, frame);
						break;
					case 27:
						SelectControl.closeAll();
						break;
				}
			}
		);
			
		var userAgent = navigator.userAgent.toLowerCase();
		if (/msie/.test(userAgent) && !/opera/.test(userAgent)) {
		}
	},
	
	fixPos:	function() {
	    var dropdowns = document.getElementsByTagName('div');
	    for (var i = 0; i < dropdowns.length; i++) {
	        if (dropdowns[i].className == 'listbox') {
	            dropdowns[i].style.left = SelectControl.findPos(document.getElementById(dropdowns[i].id.slice(0, -5) + 'Input'))[0] + 'px';
	        }
	    }
	    var frames = document.getElementsByTagName('iframe');
	    for (var i = 0; i < frames.length; i++) {
	        if (frames[i].className == 'listbox') {
				frames[i].style.left = SelectControl.findPos(document.getElementById(frames[i].id.slice(0, -6) + 'Input'))[0] + 'px';
	        }
	    }
	},
	
	closeAll: function() {
	    var dropdowns = document.getElementsByTagName('div');
	    for (var i = 0; i < dropdowns.length; i++) {
	        if (dropdowns[i].className == 'listbox') {
	            document.getElementById(dropdowns[i].id).style.display = 'none';
	        }
	    }
	    var frames = document.getElementsByTagName('iframe');
	    for (var i = 0; i < frames.length; i++) {
	        if (frames[i].className == 'listbox') {
	            document.getElementById(frames[i].id).style.display = 'none';
	        }
	    }
		SelectControl.fixPos();
	},
	
	changeView: function(list, frame) {
	    $(list).toggle();
	    $(frame).toggle();
		frame.style.height = list.offsetHeight + 'px';
		frame.style.width = list.offsetWidth + 'px';
	},
		
	findPos: function(obj) {
	    var curleft = 0;
	    var curtop = 0;
	    if (obj.offsetParent) {
	        curleft = obj.offsetLeft
	        curtop = obj.offsetTop
	        while (obj = obj.offsetParent) {
	            curleft += obj.offsetLeft
	            curtop += obj.offsetTop
	        }
	    }
	    return [curleft,curtop];
	}
}