$(function() {
    var $content = $('body:not(.project)').find('#content'),
        $mainNav = $('#navigation > ul > li'),
        home = false,
        resizeContent = function() {
            $content
                .css({
                    'height':$(window).height() - $content.offset().top - 15
                })
                .jScrollPane({
                    verticalDragMinHeight: 50, // set the minimum height of the scrollbar handle
                    hideFocus: true
                });
        };

    // resize content area and display scrollbar when $content exists
    if ($content.length) {
        $(window).resize(resizeContent);
        resizeContent();
    }

    // create fancybox gallery
    $('a.gallery:not(.video, .swf)').fancybox();
    $('a.swf').each(function() {
        var $this = $(this),
            metadata = $this.metadata(),
            width = metadata.width,
            height = metadata.height;

        $this.fancybox({
            'type': 'swf',
            'swf': {
                'wmode':'transparent',
                'allowfullscreen': true,
                'width': width,
                'height': height
            }
        });
    });
    $('a.video').fancybox({
        'type': 'swf',
        'swf': {
            'wmode':'transparent',
            'allowfullscreen': true
        }
    });

    // when the current page is the homepage, scale all menu items to their maximum size
    if ($(document.body).hasClass('home')) {
        home = true;
        $mainNav
            .removeClass('sel');
    }

    // create click function on each menu item
    $mainNav.each(function() {
        var $this = $(this);

        $this.click(function() {
            if ($this.hasClass('sel')) {
                return false;
            }

            var moveNav = $mainNav,
                moveFirst = null,
                bottom = '-3.6em',
                moveCount = 0,
                animateCount = 0,
                currSel = $mainNav.filter('.sel'),
                moveNext = function() {
                    if (moveCount == -1) {
                        if (animateCount == 1) {
                            // simulate link click
                            window.location = $this.find('a').attr('href');
                        }
                        else {
                            // we're not done yet, proceed to the next animation step
                            animateCount++;
                            moveCount = moveNav.length-1;
                            if (home && moveCount == -1) {
                                moveCount = 1;
                            }
                            moveNext();
                        }
                    }
                    else if (animateCount == 1) {
                        // we're in the final animation step, animate to final position
                        var bottom1 = 0.325,
                            bottom2 = 0.8;

                        if (home) {
                            bottom1 = (moveCount == 0 && moveFirst == null ? 0.65 : 0.325);
                            bottom2 = 1.6;
                        }

                        if (moveFirst !== null) {
                            // when needed animate the first menu item
                            $mainNav.filter(home ? ':nth-child(2)':':last-child').animate({
                                'bottom': bottom1+'em'
                            }, 375);
                            moveFirst.animate({
                                'bottom': bottom2+'em'
                            },
                            375, 
                            function() {
                                moveCount = -1;
                                moveNext();
                            });
                        }
                        else if (home && moveNav.length == 0) {
                            // animate multiple menu items when on the homepage
                            setTimeout(function() {                                
                                $mainNav.filter(':last-child').animate({
                                    'bottom': bottom1+'em'
                                }, 375);
                                $mainNav.eq(moveCount).animate({
                                    'bottom': bottom2+'em'
                                },
                                375,
                                function() {
                                    moveCount--;
                                    moveNext();
                                });
                            }, 150);
                        }
                        else {
                            // nothing to animate, proceed to click action
                            moveCount = -1;
                            moveNext();
                        }
                    }
                    else {
                        // animate to first position
                        if (home) {
                            moveNav.eq(moveCount).animate({
                                'top': bottom
                            }, {
                                duration: 500,
                                queue: true,
                                complete: function() {
                                    moveCount--;
                                    moveNext();
                                }
                            });
                            $this.parent().animate({
                                'margin-top': '11.8em'
                            }, 250);
                        }
                        else {
                            moveNav.eq(moveCount).animate({
                                'bottom': 0
                            }, {
                                duration: 375,
                                queue: true,
                                complete: function() {
                                    moveCount--;
                                    moveNext();
                                }
                            });
                        }
                    }
                };

            // hide the content and remove any click function on menu items
            $('#content').fadeOut('fast');
            $mainNav
                .unbind('click').click(function() {
                    return false;
                })
                .removeClass('sel');

            // enlarge selected menu item and animate menu
            if (home) {
                // determine position of selected menu item and setup variables accordingly
                switch($this.index()) {
                    case 0:
                        moveNav = moveNav.not(':first-child');
                        break;
                    case 1:
                        moveFirst = moveNav.filter(':first-child');
                        moveNav = moveNav.filter(':last-child');
                        break;
                    case 2:
                        moveNav = [];
                        moveCount = -1;
                        break;
                }

                // reduce font size on other menu items than selected one
                $this.addClass('sel');
                $mainNav.not('.sel').animate({
                    'font-size': '4em'
                }, 250);

                setTimeout(function() {
                    // done resizing, animate
                    moveCount = moveNav.length-1;
                    moveNext();
                }, 250);
            }
            else {
                // determine position of selected menu item and setup variables accordingly
                switch($this.index()) {
                    case 0:
                        if (!(currSel.hasClass('work-nl') && $this.hasClass('contact-nl')) &&
                            !(currSel.hasClass('work-en') && $this.hasClass('contact-en'))) {
                            moveNav.filter(':nth-child(2)').appendTo($this.parent());
                            // reset moveNav because of changed indexes
                            moveNav = $('#navigation > ul > li');
                        }
                        break;
                    case 1:
                        if ((currSel.hasClass('contact-nl') && $this.hasClass('work-nl')) ||
                            (currSel.hasClass('contact-en') && $this.hasClass('work-en'))) {
                            moveNav.filter(':first-child').appendTo($this.parent());
                            // reset moveNav because of changed indexes
                            moveNav = $('#navigation > ul > li').not(':first-child');
                        }
                        break;
                    case 2:
                        moveNav = [];
                        break;
                }

                // move selected item down to the last position
                $this.addClass('sel').appendTo($this.parent());

                // make sure we animate from the correct font size
                $mainNav.css({
                    'font-size': '4em'
                });

                // move menu items into position for animation
                if (moveNav.length > 0) {
                    moveNav = moveNav.not('.sel');
                    moveNav.animate({
                        'bottom': bottom
                    }, {
                        duration: 250,
                        queue: true
                    });
                    // wait for all items to be in position before animating again
                    setTimeout(function() {
                        moveCount = moveNav.length-1;
                        moveNext();
                    }, 650);
                }

                //enlarge selected menu item
                $this.animate({
                    'font-size': '10em'
                }, {
                    duration: 250,
                    queue: true
                });
            }

            return false;
        }); // end click function
    });
});
