var mouseOverMenu = new Hash();
var mouseOverDropDown = new Hash();
var dropDownActive = new Hash();
var hideTimeout = new Array();

function showDropDown(id) {
    $('dropdown_container_'+id).show();
    //Effect.SlideDown('dropdown_container_'+id,{duration:0.8});
}

function cancelHide(id) {
    clearTimeout(hideTimeout[id]);
}

function hideDropDown(id) {
    hideTimeout[id] = setTimeout(function() {
        $('dropdown_container_'+id).hide();
        //Effect.SlideUp('dropdown_container_'+id,{duration:0.3});    
    },50);
}

Event.observe(document,'dom:loaded',function() {
    ($$('#nav_products div.product_cat')).each(function(category) {
        var id_long = category.id;
        var id = id_long.substring(12,id_long.length);
        
        Event.observe(category,'mouseover',function() {
            cancelHide(id);
            showDropDown(id);                
        })
        
        Event.observe(category,'mouseout', function() {
            hideDropDown(id);   
        })
    });
    
    ($$('#nav_products .dropdown')).each(function(dropdown) {
        var id_long = dropdown.id;
        var id = id_long.substring(17,id_long.length);
        Event.observe(dropdown,'mouseover',function() {
            cancelHide(id);
        });
        
        Event.observe(dropdown,'mouseout',function() {
            hideDropDown(id);    
        });
        
        if (dropdown.up().getWidth() < 120) {
			dropdown.setStyle({
				width: '120px'
			});
		} else {
			dropdown.setStyle({
				width: dropdown.up().getWidth() + 'px'
			});
		}
    });
});