﻿(function($) {
    var Menu;
    $(window).load(function() {
        var ENABLE_HOVER = false;
        //initialize top menu
        var selectedItemSelector = '.menuItemSelected',
        unselected1 = $('div.menuUnselected1'),
        unselected2 = $('div.menuUnselected2'),
        selected = $('div.menuSelected'),
        initiallySelectedItems = false,
        origWidth = false;


        Menu = {
            EvenlySpace: function() {
                //var w = 980;
                var w = 975;
                var sep = $('.menuSeparator').each(function() {
                    w -= $(this).width();
                });
                var itemsWidth = 0;
                var allItems = $('.menuItem');
                allItems.each(function() {
                    //itemsWidth += $(this).width();
                    w -= $(this).width();
                });
                var extraSpacePerItem = Math.floor((w / allItems.length) / 2);
                /*padding-left: 10px; padding-right:10px; */
                allItems.css({
                    'padding-left': extraSpacePerItem + 'px',
                    'padding-right': extraSpacePerItem + 'px'
                });

            },
            Restore: function() {
                $('.menuItem').removeClass('menuItemSelected');
                initiallySelectedItems.addClass('menuItemSelected');
                Menu.Update();
            },
            /**
            * Initialize the menu
            */
            Init: function() {
                if (origWidth === false) {
                    origWidth = unselected1.width();
                }
                if (selectedItemSelector === false) {
                    unselected1.css({ width: origWidth + 'px', display: 'block' });
                    selected.css('display', 'none');
                    unselected2.css('display', 'none');
                    return;
                }


                if (!initiallySelectedItems) {
                    initiallySelectedItems = $('.menuItemSelected');
                }
                //assign a unique number to all menuitems
                var allItems = $('.menuItem');
                allItems.each(function(i) {
                    $(this).data('menuItemKey', '' + i);
                });
                var allWithoutSelected = allItems.not('.menuItemSelected');

                //do the same for the submenuitems
                var allSubmenus = $('.submenus .submenu').each(function(i) {
                    $(this).data('menuItemKey', '' + i);
                });

                Menu.EvenlySpace();

                //calculate separator heights
                Menu.InitializeSeparators();


                //update menu, position backgrounds etc...
                Menu.Update(allItems);


                /* mainmenu onmouseout timer */
                var moTimeout = false,
                /* submenus onmouseout timer */
                submenuTimeout = [],
                /* submenu close delay */
                submenuDelay = 500;
                //initialize submenuTimeout
                allSubmenus.each(function(i) { submenuTimeout[i] = false; });


                //closes the submenu
                function hideSubmenu(nr, jqObject, delayMultiplier) {
                    if (jqObject.length == 0) { return; }
                    if (!delayMultiplier || delayMultiplier < 0.1) { delayMultiplier = 1; }
                    //start the interval
                    submenuTimeout[nr] = setTimeout(function() {
                        submenuTimeout[nr] = false;
                        jqObject
                        .stop(true, true)
                        .hide('normal');
                    }, Math.ceil(submenuDelay * delayMultiplier));
                }

                /** SUBMENU:  cancel hide interval @onmouseover, start hide interval onmouseout */
                allSubmenus.not('.hiddenSubmenu').hover(function() {
                    var $this = $(this);
                    var nr = $this.data('menuItemKey');
                    //clear timeout
                    if (submenuTimeout[nr] !== false) {
                        clearTimeout(submenuTimeout[nr]);
                        submenuTimeout[nr] = false;
                    }
                }, function() {
                    var $this = $(this);
                    var nr = $this.data('menuItemKey');
                    //only use half of the delay if we move out of the submenu
                    hideSubmenu(nr, $this, 0.5);
                });

                /** main menu hover, change cssclass + show/hide submenu  */
                allItems/*.not('.menuItemSelected')*/.hover(function() {
                    if (moTimeout !== false) { clearTimeout(moTimeout); }
                    var $this = $(this);
                    //normal menu hover
                    if (ENABLE_HOVER) {
                        if (!$this.is('.menuItemSelected')) {
                            $(selectedItemSelector).removeClass('menuItemSelected');
                            $this.addClass('menuItemSelected');

                            Menu.Update();
                        }
                    }
                    //submenu
                    var nr = $this.data('menuItemKey');
                    if (nr < allSubmenus.length) {
                        if (submenuTimeout[nr] !== false) {
                            clearTimeout(submenuTimeout[nr]);
                            submenuTimeout[nr] = false;
                        }
                        var submenu = allSubmenus.eq(nr).not('.hiddenSubmenu');
                        if (submenu.length > 0) {
                            var p = $this.position();

                            //show
                            submenu.stop(true, true)
                            .css({ left: p.left + 'px', top: (p.top + 40) + 'px' })
                            .show('normal');
                        }
                    }
                }, function() {
                    var me = this, $this = $(this);
                    //normal menu hover
                    //if (!$this.is('.menuItemSelected')) {
                    moTimeout = setTimeout(function() {
                        moTimeout = false;
                        //var $this = $(me);
                        if (ENABLE_HOVER) {
                            $(selectedItemSelector).removeClass('menuItemSelected');
                            initiallySelectedItems.addClass('menuItemSelected');

                            Menu.Update();
                            Cufon.refresh('.menuItem');
                        }
                    }, 10);
                    //}
                    //hide submenu
                    var nr = $this.data('menuItemKey');
                    var submenu = allSubmenus.eq(nr).not('.hiddenSubmenu');
                    hideSubmenu(nr, submenu);
                });
            },
            InitializeSeparators: function() {

                //position menuitem separators
                var separators = $('.menuSeparator');
                var circleCenterX = origWidth / 2;
                var circleY = 44;

                //calculate line height
                separators.each(function(i) {
                    var $this = $(this); //.css('display','block');
                    var posX = $this.position().left;


                    //circle radius
                    var r = 15000;

                    //calculate triangle height
                    var a = Math.abs(posX - circleCenterX);
                    var o = Math.sqrt(r * r - a * a);
                    //var o = Math.tan(Math.acos(a / r)) * a;

                    //set line height
                    var h = Math.round(circleY + (r - o));
                    $this.css({ display: 'block', height: h + 'px' });
                });
            },

            /** 
            Updates the menuitems,
            and repositions the background so the selected item is colored
            */
            Update: function(allItems) {

                //var allItems = $('.menuItem');
                if (!allItems) {
                    allItems = $('.menuItem');
                }

                var item = $(selectedItemSelector);
                //if (item.length == 0) throw new Error("Menu item not found " + selectedItemSelector);
                if (item.length > 0 && allItems.length > 0) {
                    var isFirst = allItems.eq(0).data('menuItemKey') === item.data('menuItemKey');
                    var isLast = allItems.eq(allItems.length - 1).data('menuItemKey') === item.data('menuItemKey');
                    //position backgrounds 

                    var parentOffsetX = item.position().left,
                    itemW = item.outerWidth();
                    if (isFirst) {
                        itemW += (parentOffsetX + 32);
                        //parentOffsetX -= 32;
                        parentOffsetX = -32;
                        //itemW += 32;
                    }
                    if (isLast) {
                        itemW = origWidth - parentOffsetX;
                        /*itemW -= parentOffsetX;*/
                    }
                    //var selectedOffsetX = parentOffsetX + (isLast?-32:0);
                    var bgOffsetDelta = -32;
                    var cssSelected = {
                        display: 'block',
                        left: (parentOffsetX + 'px'),
                        'background-position': (isFirst ? 0 : (-1 * parentOffsetX + bgOffsetDelta)) + 'px top',
                        width: itemW + 'px'
                    },
                    cssUnselected1 = {
                        display: isFirst ? 'none' : 'block',
                        width: (parentOffsetX + 32) + 'px'
                    },
                    cssUnselected2 = {
                        display: isLast ? 'none' : 'block',
                        'background-position': (-1 * (parentOffsetX + itemW) + bgOffsetDelta) + 'px top',
                        left: (parentOffsetX + itemW) + 'px',
                        width: (origWidth - (parentOffsetX + itemW)) + 'px'
                    };

                    selected.css(cssSelected);
                    unselected1.css(cssUnselected1);
                    unselected2.css(cssUnselected2);
                }

            },


            InitSubmenus: function() {

            }
        };

        Menu.Init();

    });

})(jQuery);
