﻿var currentList = null;

    //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 (currentList != dropdown && currentList != null)
        {
            if (!Element.hasClassName(currentList, 'hide-dropdown')) 
            {
                Element.addClassName(currentList, 'hide-dropdown');
            }
        }
        currentList = dropdown;
        
        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);
       
       if (option.parentNode.tagName != "LI")
       {
           option = option.parentNode.parentNode.childNodes[0];
       }
       var value = option.childNodes[0].nodeValue;
       var itemid = option.getAttribute('value');
       //var img = option.childNodes[0].src;
       
       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);
    }
    
    //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.className == 'dd-opener') { 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);