var selectedItem = '';
var pictureAnimate = '';

$(document).ready(function(e) {
    setTimeout(initNav, 300);
});

function initNav() {
    $('.bp-nav-c').each(function() {
        var $currentElem = $(this);
        var $picturesList = $currentElem.find('img');
        var $menuItemList = $currentElem.find('.bp-nav-item');
        var $currentItem = $currentElem.find('.bp-nav-item-current');
        var $menuItem = $currentElem.find('ul');
        var $menuWidth = 0;

        $picturesList.css('display', 'block');
        $picturesList.css('opacity', '0');

        if ($currentItem.length === 0) {
            setMenuItemAsSelected($menuItemList, $($menuItemList[0]));
        }
        else {
            setMenuItemAsSelected($menuItemList, $currentItem);
        }

        $menuItem.animate({
            opacity: 1
        }, 1000);

        $menuItemList.each(function() {
            var $currentMenuItem = $(this);
            if ($.browser.msie && $.browser.version === '6.0') {
                var $currentMenuItemBG = $currentMenuItem.find('.bp-nav-item-bg');
                var $currentMenuItemLink = $currentMenuItem.find('a');

                $currentMenuItemBG.width($currentMenuItemLink.outerWidth() + parseInt($currentMenuItemLink.css('marginLeft')) + parseInt($currentMenuItemLink.css('marginLeft')));
            }
            $menuWidth += Math.round($currentMenuItem.width());

            $currentMenuItem.mouseenter(function() {
                setMenuItemAsSelected($menuItemList, $currentMenuItem);
            });

            $currentMenuItem.mouseleave(function() { unselectNoHoverMenu() });
        });

        $menuItem.css('width', $menuWidth);
        $menuItem.css('margin-left', -Math.round($menuWidth / 2));
    });
}

function setMenuItemAsSelected($list, $currentItem) {
    var itemToShow = '';
    var itemToHide = '';

    $list.each(function() {
        var $item = $(this);

        if ($item.attr('id') === $currentItem.attr('id')) {
            itemToShow = $item.attr('id');
        }
        else if ($item.attr('id') === selectedItem) {
            itemToHide = $item.attr('id');
        }
    });

    selectedItem = itemToShow;


    if (itemToShow != '' && itemToHide === '') {
        var $item = $('#' + itemToShow);
        var $itemPicture = $item.parent().parent().find('.' + $item.find('a').attr('rel'));

        $item.addClass('bp-nav-item-hover');

        pictureAnimate = $itemPicture.animate({
            opacity: 1
        }, 500);
    }
    else if (itemToShow != '' && itemToHide != '') {
        var $item = $('#' + itemToShow);
        var $itemPicture = $item.parent().parent().find('.' + $item.find('a').attr('rel'));
        var $itemsButtonToHide = $item.parent().find('li').not('#' + itemToShow);
        var $itemsPicturesToHide = $item.parent().parent().find('img').not('.' + $item.find('a').attr('rel'))

        $itemPicture.css('z-index', 600);
        $itemsPicturesToHide.css('z-index', 500);

        $item.addClass('bp-nav-item-hover');
        $itemsButtonToHide.removeClass('bp-nav-item-hover');

        pictureAnimate = $itemPicture.animate({
            opacity: 1
        }, 500, function() {
            $itemsPicturesToHide.css('opacity', 0);
        });
    }
}

function unselectNoHoverMenu() {
    var m = $.query.get('ind');
    if (m !== '') {
        defaultItem = "bp-nav-item-" + $.query.get('ind');
        var $item = $('#' + defaultItem);
        var $itemPicture = $item.parent().parent().find('.' + $item.find('a').attr('rel'));
        var $itemsButtonToHide = $item.parent().find('li').not('#' + defaultItem);
        var $itemsPicturesToHide = $item.parent().parent().find('img').not('.' + $item.find('a').attr('rel'))

        $itemPicture.css('z-index', 600);
        $itemsPicturesToHide.css('z-index', 500);

        $item.addClass('bp-nav-item-hover');
        $itemsButtonToHide.removeClass('bp-nav-item-hover');

        pictureAnimate = $itemPicture.animate({
            opacity: 1
        }, 500, function() {
            $itemsPicturesToHide.css('opacity', 0);
        });

        selectedItem = defaultItem;
    }

}
