$(function()
{
    // Highlight the currently selected team member on the sidebar menu
    $('ul#team > li').each(
        function(index)
        {
            var liID = $(this).attr('id');
            if ($('body[class$=' + liID + ']').length != 0)
            {
                $(this).addClass('current');
            }
        }
    );
    
    // Remove default scrollbars from team list
    $('div#team_list_wrapper').css('overflow', 'hidden');
        
    // If list height is greater than list viewport window
    if ($('ul#team').height() > $('div#team_list_wrapper').height())
    {
        // Add custom scrollbars to team list
        $('div#team_list_wrapper')
            .append('<div class="scrollUp"></div>')
            .append('<div class="scrollBar"></div>')
            .append('<div class="scrollDown"></div>');
            
        // Calculate size and position of scrollBar div
        var listViewPort = $('div#team_list_wrapper').height();
        var scrollBarPlane = listViewPort - $('div.scrollUp').height() - $('div.scrollDown').height();
        var scrollRatio = listViewPort / $('ul#team').height();
        var scrollBarHeight = (scrollBarPlane * scrollRatio);
        var scrollBarInitialTop = listViewPort - scrollBarPlane;
        $('div.scrollBar').css({'height': scrollBarHeight - 22, 'top': scrollBarInitialTop});
        
        // Calculate how far the scrollBar css 'top' property can move
        var scrollBarMaxMove = scrollBarPlane - scrollBarHeight;
            
        // Add hover scroll functionality to custom scroll arrows
        $('div.scrollUp').hover(startScrollUp, stopScroll);
        $('div.scrollDown').hover(startScrollDown, stopScroll);
        
        // Add click & drag functionality to scrollbar
        var x = $('div.scrollBar').position().left;
        var y1 = scrollBarInitialTop + 92;
        var y2 = scrollBarInitialTop + scrollBarMaxMove + 92;
        
        $('div.scrollBar')
            .hover(scrollBarHover, scrollBarUnHover)
            .draggable({
                axis: 'y',
                containment: [x, y1, x, y2],
                cursor: 'pointer',
                drag: onScrollDrag});
    }
    
    function onScrollDrag()
    {
        var currScrollOffset = $('div.scrollBar').position().top - scrollBarInitialTop;
        var scrollRatio = (scrollBarMaxMove - currScrollOffset) / scrollBarMaxMove;
        scrollRatio--;
        scrollRatio = -scrollRatio;
        var newListOffset = ($('ul#team').height() - listViewPort) * scrollRatio;
        var newListPos = -newListOffset;
        $('ul#team').css('top', newListPos);
    }
    
    function startScrollUp()
    {
        $(this).css('cursor', 'pointer');
        
        var projList = $('ul#team');
        
        projList.everyTime(65, function()
        {
            if (projList.position().top < 0)
            {
                var currListOffset = projList.position().top;
                var newListPos = currListOffset + 10;
                $(this).animate(
                    {top: newListPos},
                    50,
                    'linear'
                );
                
                // Move the scrollBar
                var listMaxScroll = projList.height() - listViewPort;
                var scrollRatio = (listMaxScroll + newListPos) / listMaxScroll;
                scrollRatio--;
                scrollRatio = -scrollRatio;
                var newScrollOffset = scrollBarMaxMove * scrollRatio;
                var newScrollPos = scrollBarInitialTop + newScrollOffset;
                
                $('div.scrollBar').animate(
                    {top: newScrollPos},
                    50,
                    'linear'
                );
            }
        }, 0);
    }
    
    function startScrollDown()
    {
        $(this).css('cursor', 'pointer');
        var teamList = $('ul#team');
        var maxHeight = teamList.height() - $(this).parent().parent().height() + 20;
        
        teamList.everyTime(65, function()
        {
            if (teamList.position().top > -(maxHeight))
            {
                // Move the list
                var currListOffset = teamList.position().top;
                var newListPos = currListOffset - 10;
                $(this).animate(
                    {top: newListPos},
                    50,
                    'linear'
                );
                
                // Move the scrollBar
                var listMaxScroll = teamList.height() - listViewPort;
                var scrollRatio = (listMaxScroll + newListPos) / listMaxScroll;
                scrollRatio--;
                scrollRatio = -scrollRatio;
                var newScrollOffset = scrollBarMaxMove * scrollRatio;
                var newScrollPos = scrollBarInitialTop + newScrollOffset;
                
                $('div.scrollBar').animate(
                    {top: newScrollPos},
                    50,
                    'linear'
                );
            }
        }, 0);
    }
        
    function stopScroll()
    {
        $('ul#team').stopTime();
        $('div.scrollBar').stopTime();
    }
    
    function scrollBarHover()
    {
        $(this).css('cursor', 'pointer');
    }
    
    function scrollBarUnHover()
    {
        $(this).css('cursor', 'auto');
    }
});