/* 
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */

var leftNavInterval = 625;
var leftNavItemHeight = 26;

/*
 * To make life easier, we're quickly going to put in a new jQuery method to determine if one element is the child of another
 */
jQuery.fn.isChildOf = function(b){
    return (this.parents(b).length > 0);
};

$(document).ready(function() {

    $('div#leftnavmenu > ul > li').mouseenter(

        function() {

            $this = $(this);

            $('div#leftnavmenu > ul > li').each(function() {

                if ($(this)!=$this) $(this).removeClass('hover');

            });

            $this.addClass('toShow').removeClass('toHide');

            if (!$this.hasClass('over'))
            {
                $this.addClass('over');

                window.setTimeout(function() {


                    $this.parent().parent().find('li ul').each(function() {

                        $subthis = $(this);

                        if ($subthis.isChildOf('#leftnavmenu'))
                        {
                            if (!$subthis.hasClass('over')&&($subthis.parent().attr('id')!='leftnavmenu'))
                            {
                                $subthis.css('display', 'none');
                            }
                        }

                    });

                    $this.parent().parent().removeClass('over');

                    $ul = $this.find('> ul');

                    if (($ul.length > 0)&&($this.hasClass('toShow')))
                    {
                        $ul.css('display', 'block');

                        moveUlIntoViewport($ul);
                    }

                }, leftNavInterval);
            }
        }

    ).mouseleave(

        function() {

            $this = $(this);

            $this.addClass('toHide').removeClass('toShow');

            //if (hiding.indexOf($this)!= -1) hiding.push ($this);

            if ($this.hasClass('over'))
            {
                $this.removeClass('over');

                window.setTimeout(function() {

                    $this.find('> ul').each(function() {

                        $subthis = $(this);

                        if ($subthis.isChildOf('#leftnavmenu'))
                        {
                            if (!$subthis.parent().hasClass('over')&&($this.hasClass('toHide'))&&($subthis.parent().attr('id')!='leftnavmenu'))
                            {
                                $subthis.css('display', 'none');
                            }
                        }
                    });

                    //var idx = hiding.indexOf($this);

                    //if (idx != -1)
                    //{
                        //hiding.splice(idx, 1);
                    //}

                }, leftNavInterval);
            }
        }

    );

    /*
    $('div#leftnavmenu > ul > li > ul').mouseleave(

        function() {

            $this = $(this);

            if ((!$this.find('.over'))&&(!$this.parent().hasClass('over')))
            {
                window.setTimeout(function() {

                    $this.css('display', 'none');

                }, leftNavInterval);
            }
        }
    );
    */
    
    $('div#leftnavmenu > ul > li > ul > li').mouseenter(

        function() {

            //alert('entered');
            //$('div#leftnavmenu > ul > li').removeClass('over');
            //$(this).find('> ul').show();
            $this = $(this);

            if (!$this.hasClass('over'))
            {
                window.setTimeout(function() {

                    $this.parent().parent().find('li ul').each(function () {

                        $subthis = $(this);

                        if ($subthis.isChildOf('#leftnavmenu'))
                        {
                            if (!$subthis.parent().hasClass(':hover')&&($subthis.parent().attr('id')!='leftnavmenu'))
                            {
                                $subthis.css('display', 'none');
                            }
                        }
                    });

                    $this.parent().parent().removeClass('over');

                    $ul = $this.find('> ul');

                    if ($ul.length > 0)
                    {
                        $ul.css('display', 'block');
                        
                        moveUlIntoViewport($ul);
                    }

                    $this.addClass('over');

                }, leftNavInterval);
            }
        }
    ).mouseleave(

        function() {

            $this = $(this);

            if ($this.hasClass('over'))
            {
                $this.removeClass('over');

                window.setTimeout(function() {

                    if ($this.parent().attr('id') !== 'leftnavmenu')
                    {
                        $this.find('> ul').each(function() {

                            $subthis = $(this);

                            if ($subthis.isChildOf('#leftnavmenu'))
                            {
                                if (!$subthis.parent().hasClass('over')&&($subthis.parent().attr('id')!='leftnavmenu'))
                                {
                                    $subthis.css('display', 'none');
                                }
                            }

                        });
                    }

                }, leftNavInterval);
            }
        }
    );

    $('div#leftnavmenu > ul > li > ul > li > ul > li').mouseenter(

        function() {

            //alert('entered');
            //$('div#leftnavmenu > ul > li').removeClass('over');
            //$(this).find('> ul').show();
            $this = $(this);

            if (!$this.hasClass('over'))
            {
                window.setTimeout(function() {

                    $this.parent().parent().find('li ul').each(function () {

                        $subthis = $(this);

                        if ($subthis.isChildOf('#leftnavmenu'))
                        {
                            if (!$subthis.parent().hasClass(':hover')&&($subthis.parent().attr('id')!='leftnavmenu'))
                            {
                                $subthis.css('display', 'none');
                            }
                        }
                    });

                    $this.parent().parent().removeClass('over');

                    $ul = $this.find('> ul');

                    if ($ul.length > 0)
                    {
                        $ul.css('display', 'block');

                        moveUlIntoViewport($ul);
                    }

                    $this.addClass('over');

                }, leftNavInterval);
            }
        }
    ).mouseleave(

        function() {

            $this = $(this);

            if ($this.hasClass('over'))
            {
                $this.removeClass('over');

                window.setTimeout(function() {

                    if ($this.parent().attr('id') !== 'leftnavmenu')
                    {
                        $this.find('> ul').each(function() {

                            $subthis = $(this);

                            if ($subthis.isChildOf('#leftnavmenu'))
                            {
                                if (!$subthis.parent().hasClass('over')&&($subthis.parent().attr('id')!='leftnavmenu'))
                                {
                                    $subthis.css('display', 'none');
                                }
                            }

                        });
                    }

                }, leftNavInterval);
            }
        }
    );

    $('div#leftnavmenu').mouseleave(

        function() {

            $this = $(this);

            window.setTimeout(function() {

                $this.find('> ul > li.over').removeClass('.over');
                $this.find('> ul > li > ul').each(function()
                {
                    $subthis = $(this);
                    if ($subthis.css('display') == 'block') $subthis.css('display', 'none');
                });

            }, leftNavInterval * 2);

        }
    );

    $('body').removeClass('noJQuery');
})

/*
 * Moves a ul so that as much as possible is within the viewport
 *
 * @param $ul Should be a jquery reference to the ul being moved
 */
function moveUlIntoViewport($ul)
{
    /*
     * We don't ever want it to move the main menu so we're going quit it straigh away if it tries to
     */
    if ($ul.parent().attr('id') == 'leftnavmenu') return false;

    /*
     * Before we make the sub item visible, we need to reposition it so that as much as possible is visible
     * This means that if the bottom is going to be cut off, we need to move it up, but only until it starts cutting off the top
     */

    var ulHeight = $ul.height();

    var windowTop = $(window).scrollTop();
    var windowBottom = windowTop + $(window).height();

    var ulTop = $ul.offset().top;
    var ulBottom = ulTop + ulHeight;

    if (ulTop < windowTop)
    //if we're cutting off the top
    {
        var amountToMove = ulTop - windowTop;

        /*
         * Finally we're just gonna tweak the amount so that it looks neat with the size of our menu items
         */
        amountToMove = Math.floor(amountToMove / leftNavItemHeight) * leftNavItemHeight;

        $ul.css('margin-top', (parseInt($ul.css('margin-top')) - amountToMove) + 'px')
    }
    else if (ulBottom > windowBottom)
    //if we're cutting off the bottom
    {
        var maxCanMove = ulTop - windowTop;
        var amountOffTheBottom = ulBottom - windowBottom;

        var amountToMove = Math.min(maxCanMove, amountOffTheBottom);

        /*
         * Finally we're just gonna tweak the amount so that it looks neat with the size of our menu items
         */
        amountToMove = Math.ceil(amountToMove / leftNavItemHeight) * leftNavItemHeight;

        if (amountToMove > maxCanMove) amountToMove -= leftNavItemHeight;

        $ul.css('margin-top', (parseInt($ul.css('margin-top')) - amountToMove) + 'px')
        //while (($ul.offset().top + ulHeight) > windowBottom) $ul.css('margin-top', (parseInt($ul.css('margin-top') - leftNavItemHeight) + 'px' ))
    }
}