function Dropper(id){
	var object = document.getElementById(id);
	var value = null;
	var onChange = function (){;}
	
	for (i in object.childNodes){
		if (object.childNodes[i].className){
			switch (object.childNodes[i].className){
				case 'button':
					var button = object.childNodes[i];
					break;
				case 'dropdown':
					var dropdown = object.childNodes[i];
					break;
				case 'select':
					var select = object.childNodes[i];
					break;
				default: ; break;
			}
		}
	}
	items = dropdown.getElementsByTagName('div')
	var first = true;
	for (i in items){
		if (items[i].className == 'item'){
			items[i].onclick = function (e){
				var event = e || window.event;
				select.innerHTML = this.innerHTML;
				value = this.getAttribute('val');
				
				if (dropdown.style.visibility=='visible'){
					dropdown.style.visibility='hidden';
				} else {
					dropdown.style.visibility='visible';
				}
				
				onChange();
			};
			if (first){
				first = false; value = items[i].getAttribute('val'); select.innerHTML = items[i].innerHTML;
			}
		}
	}
	// private methods
	toggleItems = function(){
		if (dropdown.style.visibility=='visible'){
			dropdown.style.visibility='hidden';
		} else {
			dropdown.style.visibility='visible';
		}
	}
	
	// public methods 
	this.getValue 		= function	(){ return value; }
	this.setOnChange 	= function	( clb ) { onChange = clb; }
	
	// Final assignments
	if (button) button.onclick = toggleItems;
	if (select) select.onclick = toggleItems;
};