//setting dropdown value into hiddne field
function hideLayer(layer) {
	if (document.getElementById) {	
		document.getElementById(layer).style.display = 'none';			
	}
}

function showLayer(layer) {
	if (document.getElementById) {	
		document.getElementById(layer).style.display = '';
	}
}


//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;
   }

	if (document.getElementById) {	
		optionText = value.replace(/[(]/, "");
		optionText = optionText.replace(/[)]/, "");

		if (input.name === 'quantity') {
			
		} else {
			document.getElementById('your-price').innerHTML = optionText;			
			showLayer('quantity-select');
		}
	}

   
}

//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);