﻿var fireOn = window.ie ? 'load' : 'domready';
window.addEvent(fireOn, function(){

    var navigation = $$('ul#navigation li');
    var FxDuration = '400';
    var FxTransition = 'sine:out';
    var listItemHeight = 24;

    navigation.each(function(el){
        var submenu = el.getElement('ul');
        var myEffect = new Fx.Morph(submenu, {duration: FxDuration, transition: FxTransition});

        // Check if the element has a submenu..
        if(submenu){
            submenu.setStyle('height','0');
            var OuterLink = el.getElement('a');
            // org 
            // var height = (listItemHeight * submenu.getElements('li').length);
            var height = (listItemHeight * submenu.getElements('li').length)+150; // rowi: added for cut-off submenu

            // Attach some events to the first anchor
            OuterLink.addEvent('mouseover', function(e){
                if(!this.hasClass('active')){
                    this.addClass('active');

                    submenu.setStyle('display','block');

                    myEffect.cancel();
                    myEffect.start({
                        'height': [0, height]
                    });
                }
            });

            // Attach some events to the submenu
            el.addEvent('mouseleave', function(e){
                myEffect.cancel();
                myEffect.start({
                    'height': [myEffect.subject.style.height, 0]
                });
            });

            myEffect.addEvent('complete', function() {
                if(myEffect.subject.getStyle('height') == "0px"){
                    submenu.setStyle('display','none');
                    OuterLink.removeClass('active');
                }
            });
        }
    });
});

