﻿function Flyouts()
{
    //Wire-up the internal functions, otherwise a method not defined error will be thrown.
    this.initialize = initialize;
    this.close = close;
    this.show = show;
    this.hide = hide;
    this.stop = stop;
    this.checkin = checkin;
    this.checkout = checkout;
    this.animateComplete = animateComplete;
    
    this.items = []; //Menu items.
    
    var active = false;
    var animating = false; //Set to true while menu is in transition; False once complete.
    var current = null; //The curernt menu that has focus.
    var flyoutOpacity = 0.85;
    var _this = this; //Variable to get a reference to "this" when out of context, i.e. while in an event function.

    //Initialize
    function initialize() {
 
        this.items = $("ul.navBottomCorporate li a.flyout");
        
        this.items.each(function (item) {
                
            var parent = $(_this.items[item]).parent();
        
            parent.bind("mouseenter", function(e){
                _this.show($(this).find("div"));
            });
            
            parent.delay({
                delay: 500,
                event: 'mouseleave',
                fn: function(e){
                    _this.hide($(parent).find("div"));
                }
            }); //end: parent.delay
            
            parent.find("div").bind("mouseover", function(e){
                _this.checkin($(this));
            });
            
            parent.find("div").bind("mouseleave", function(e){
                _this.checkout($(this));
            });            
        
        }); //end: this.items.each  
             
    } //end: initialize()
    
    
    //Show the flyout item that has the focus. 
    //Stop all others that may be currently animating.
    function show(navItem)
    {
        if(animating)
        {
            if(current && (navItem.attr('id') == current.attr('id')))
                return;
                
            this.stop();
        }
        
        if((current && (navItem.attr('id') == current.attr('id'))) && navItem.is(':visible'))
        {
          return;
        }       
    
        current = navItem;
        animating = true;
        
        $(navItem).css("-moz-opacity",flyoutOpacity);
        var ieOpacity = "alpha(opacity=" + (100*flyoutOpacity) + ")";
        $(navItem).css("filter",ieOpacity);
        

        $(navItem).fadeIn("def", function() {
          _this.animateComplete();  
        });
    }
    
    //Hide the flyout item that had focus. 
    //Stop all others that may be currently animating.
    function hide(navItem)
    {        
        if(active && (current && (navItem.attr("id") == current.attr("id"))))
        {
            return;
        }
            
        if(animating){
            var i=0;
            do{
                i++;
                if(i > 5000)
                {
                    break;
                }
            }while(animating);
            
            this.stop();
        }
        
        current = navItem;
        animating = true;
        
        $(navItem).fadeOut("def", function() {
          _this.animateComplete();  
        });
    }
    
    function checkin(navItem)
    {
        active = true;
    }
    
    function checkout(navItem)
    {
        active = false;
    }
    
    //Stop all animations on the current item and return to original styles.
    function stop()
    {
       $(current).stop(true, true); 
    }
    
    //Animation is complete.
    function animateComplete()
    {
        animating = false;
    }

}

(function($){
    /**
     * jQuery delayed event execution.
     */
    $.fn.delay = function(options) {
        
        var timer;
        var delayImpl = function(eventObj) {
            if (timer != null) {
                clearTimeout(timer);
            }
            var newFn = function() {
                options.fn(eventObj);
            };
            timer = setTimeout(newFn, options.delay);
        }
       
        return this.each(function() {
            var obj = $(this);
            
            obj.bind(options.event, function(eventObj) {
                 delayImpl(eventObj);  
            });
        });
    };
})(jQuery);

$(document).ready(function(){
    flyouts = new Flyouts();
    flyouts.initialize();
});


