$(function () {
    InitNavItems();
    GenNav();
});

var navItems = [];
var selFirstLevelIndex = -1;
var nav1 = 0;
var nav2 = 0;
var nav1Timeout;
var nav2Timeout;

function InitNavItems() {
    var selectedItems = $('.s4-tn > div > ul > li > ul > li > a[class~="selected"]');
    if (selectedItems.length == 0) return;

    var homeItem = { title: 'Home'/*selectedItems.eq(0).find('.menu-item-text').text()*/, href: selectedItems[0].href, selected: true, children: [], desc: '' };
    navItems[0] = homeItem;
    navItems = navItems.concat(GetNavItemChildren(selectedItems.eq(0)));
    //navItems = GetNavItemChildren(selectedItems.eq(0));
}

function GetNavItemChildren(pNode) {
    var nodes = [];
    if (pNode) {
        var subItems = pNode.parent().find('> ul > li > a');
        for (var i = 0; i < subItems.length; i++) {
            nodes[i] = { title: subItems.eq(i).find('.menu-item-text').text(), href: subItems[i].href, selected: false, children: [], desc: subItems[i].title };
            nodes[i].children = GetNavItemChildren(subItems.eq(i));
            if (nodes[i].children.length > 0) {
                // if it's a site node, then check that if the current page belong to
                if (isCurrentPageUnderSite(nodes[i].href)) {
                    nodes[i].selected = true;
                    navItems[0].selected = false;
                }
            }
            else {
                // if it's page node, then check that if the page path is the same
                if (document.location.href.split('?')[0].toLowerCase() == nodes[i].href.split('?')[0].toLowerCase()) {
                    nodes[i].selected = true;
                    navItems[0].selected = false;
                }
            }
        }
    }
    return nodes;
}

function GenNav() {
    if (navItems.length == 0) return;

    var html = '<div id="topNav" class="topNav"></div>';
    html += '<div id="subNavWrapper" class="subNavWrapper"></div>';
    $('#navArea').append(html);

    BuildStaticNav();
}

function BuildStaticNav() {
    var html = '<ul>';
    for (var i = 0; i < navItems.length; i++) {
        html += '<li pos="' + i + '" class="';
        if (navItems[i].selected) {
            html += 'selected';
            selFirstLevelIndex = i;
        }

        html += '"><a href="';
        html += navItems[i].href;
        html += '"><span>';
        html += navItems[i].title.toUpperCase();
        html += '</span></a></li>';
    }
    html += '</ul>';
    $('#topNav').html(html);

    // binding event
    $('#topNav li').hover(
        function () {
            if (nav1 == 0) {
                if (nav1Timeout != null) clearTimeout(nav1Timeout);
                if (nav2Timeout != null) clearTimeout(nav2Timeout);

                var index = $(this).attr('pos');
                // index is not a valid number
                if (!index) {
                    return;
                }

                $('#topNav li').removeClass('hovered hoveredEmpty');
                if (navItems[index].children.length > 0) {
                    $(this).addClass('hovered');

                    BuildSubNav(index);
                }
                else {
                    $(this).addClass('hoveredEmpty');

                    $('#subNavWrapper').hide();
                }
            }
            nav1++;
        },
        function () {
            nav1--;
            if (nav1 == 0) {
                nav1Timeout = setTimeout(function () {
                    $('#subNavWrapper').slideUp(300);

                    $('#topNav li').removeClass('hovered hoveredEmpty');
                }, 500);
            }
        }
    );

    var itemWidth = Math.floor(($('#topNav').width() - navItems.length - 1) / navItems.length);
    var navLeftMargin = Math.floor(($('#topNav').width() - (itemWidth + 1) * navItems.length) / 2);
    $('#topNav li').css('width', itemWidth + 'px');
    $('#topNav').css('margin-left', navLeftMargin + 'px');
}

function BuildSubNav(index) {
    var html = '';
    var subNavs = navItems[index].children;

    html = '<ul id="subNav" class="subNav">';
    for (var i = 0; i < subNavs.length; i++) {
        if (subNavs[i].selected) {
            html += '<li class="selected"><span>';
            html += subNavs[i].title;
            html += '</span></li>';
        }
        else {
            html += '<li>';
            html += '<a href="' + subNavs[i].href + '"><span>' + subNavs[i].title + '</span></a>';
            html += '</li>';
        }
    }
    html += '</ul>';

    $('#subNavWrapper').html(html);

    //bind events
    $('#subNavWrapper').hover(
        function () {
            if (nav2 == 0) {
                if (nav1Timeout != null) clearTimeout(nav1Timeout);
                if (nav2Timeout != null) clearTimeout(nav2Timeout);

            }
            nav2++;
        },
        function () {
            nav2--;
            if (nav2 == 0) {
                nav2Timeout = setTimeout(function () {
                    $('#subNavWrapper').slideUp(300);

                    //$(this).removeClass('hovered');
                    $('#topNav li').removeClass('hovered hoveredEmpty');
                }, 500);
            }
        }
    );

    var parentNav = $('#topNav li[pos=' + index + ']');
    var pos = getPos(parentNav[0]);
    var top = pos.top + parentNav.height();
    var left;

    if (index < navItems.length / 2) {
        left = pos.left;
    }
    else {
        // 2 is the totally border width of the sub nav
        left = pos.left + parentNav.width() - $('#subNavWrapper').width() - 2;
    }

    $('#subNavWrapper').css('top', top);
    $('#subNavWrapper').css('left', left);

    $('#subNavWrapper').slideDown(300);
}

function getPos(obj) {
    var output = new Object();
    var mytop = 0, myleft = 0;
    while (obj) {
        mytop += obj.offsetTop;
        myleft += obj.offsetLeft;
        obj = obj.offsetParent;
    }
    output.left = myleft;
    output.top = mytop;
    return output;
}

function isCurrentPageUnderSite(siteHomePageUrl) {
    var siteUrl = getSiteFromPageUrl(siteHomePageUrl).toLowerCase();
    var currentPageUrl = document.location.href.split('?')[0];
    return currentPageUrl.toLowerCase().indexOf(siteUrl) != -1;
}

function getSiteFromPageUrl(pageUrl) {
    var regNormalPagePath = new RegExp('^(https?://([^/]+/)+)pages/.+$', 'i');
    var regFormPagePath = new RegExp('^(https?://([^/]+/)+)[^/]+/forms/.+$', 'i');

    var match = regNormalPagePath.exec(pageUrl);
    if (match != null) {
        return match[1];
    }
    else {
        match = regFormPagePath.exec(pageUrl);
        if (match != null) {
            return match[1];
        }
    }

    return pageUrl;
}

function isSamePage(url1, url2) {
    var regPagePath = new RegExp('^(https?://[^/]+)?(/[^?]+\\.aspx).*$', 'i');

    var match1 = regPagePath.exec(url1);
    if (match1 != null) {
        var match2 = regPagePath.exec(url2);
        if (match2 != null) {
            return match1[2].toLowerCase() == match[2].toLowerCase();
        }
    }

    return false;
}