//initialize dropdowns
var hideDropDowns = function() {
   var dropdowns = document.getElementsByClassName('select');
   for (var i = 0; i < dropdowns.length; i++) {
	   dropdown = dropdowns[i];
	   Element.addClassName(dropdown, 'hide-dropdown');
   }

}

Event.observe(window, 'load', hideDropDowns, false);

//observe dropdown opener
var observeOpener = function(opener) {
	var dropdown = opener.parentNode;
	
	if (Element.hasClassName(dropdown, 'hide-dropdown')) {
		Element.removeClassName(dropdown, 'hide-dropdown');    
	} else {
		Element.addClassName(dropdown, 'hide-dropdown');
	}
	return false;
}

//observing dropdown option
var observeOption = function(event) {
   var option = Event.element(event);
   var value = option.childNodes[0].nodeValue;
   //var itemid = option.getAttribute('value');
   
   var selectbox = Event.findElement(event, 'ul');
   
   //setDDValue(selectbox.parentNode, itemid, value);
   
   Element.addClassName(selectbox.parentNode, 'hide-dropdown');    
   
   Event.stop(event);
}

//observing dropdown options
var observeDropDownOptions = function(event) {
   var selects = document.getElementsByClassName('selectbox');
   for (var i = 0; i < selects.length; i++) {
	   select = selects[i];
	   var options = select.getElementsByTagName('A');
	   for (var j = 0; j < options.length; j++) {
		   option = options[j];
		   Event.observe(option, 'click', (observeOption), false);
	   }
   }  
   
   Event.stop(event);
}

Event.observe(window, 'load', (observeDropDownOptions), true);

//setting dropdown value into hiddne field
function setDDValue(dropdown, itemid, value) {
   var a = dropdown.getElementsByTagName('A')[0];
   var input = dropdown.getElementsByTagName('INPUT')[0];
   
   Element.update(a, value);
   
   if (input) {
	 input.value = itemid;
   }
}

//closing dropdown by ESC
var onKeyPress = function(event) {
	switch(event.keyCode) {
	 case Event.KEY_ESC:
	   hideDropDowns(event);
	   Event.stop(event);
	   return;
	 }
}

Event.observe(document, "keypress", (onKeyPress), true);

//closing dropdown by click out of it
var hideDropDownsOnClick = function(event) {
   var a = Event.element(event);
   if (a.tagName == 'A') { return false; }
			
   var dropdowns = document.getElementsByClassName('select');
   for (var i = 0; i < dropdowns.length; i++) {
	   dropdown = dropdowns[i];
	   Element.addClassName(dropdown, 'hide-dropdown');
   }
}

Event.observe(document, "click", (hideDropDownsOnClick), true);