// Run delayed code.
jQuery(document).ready(function () {

    var uagent = navigator.userAgent.toLowerCase();
    var bbIndex = uagent.indexOf("blackberry");
    var adIndex = uagent.indexOf("android");
    var ipIndex = uagent.indexOf("iphone");
    var iPadIndex = uagent.indexOf("ipad");
    if ((bbIndex == -1) && (adIndex == -1) && (ipIndex == -1) && (iPadIndex == -1)) {
        // bind hover for fatnav
        jQuery("ul.root > li.static").hover(onTabHoverIn, onTabHoverOut);

        // register touch event logic for fatnav 
        jQuery("ul.root > li.static > a").live("touchstart", onTouchStart);
        jQuery("ul.root").live("touchstart", function (event) { event.stopPropagation(); });
        jQuery("#body-wrapper").live("touchstart", onTouchOutsideStart);
    }
});

// the element that is being hovered over
var hoveredElement = 0;
// reference to the timer delay before showing the fatnav
var hoverTimer = 0;

/* Callaback for jQuery.hover(in).
* This function manages displaying dropdowns and activating the first tab li.
*/
function onTabHoverIn(event) {
    hoveredElement = jQuery(this);
    hoverTimer = setTimeout("doShowNav()", 300);
}

/* Timer callback to actually show the fatnav dropdown.
*/
function doShowNav() {

    if (hoveredElement.find("a.menu-item")[0].href == $(".menu-item:first-child")[0].href) {
        return;
    }
    // show the hovered dropbox
    // activate the first tab inside the dropbox and show it's contents
    hoveredElement.find(".tabBox:first").show();

    /*hoveredElement.parent().append($("#FlyoutMenu"));*/
    var menuLink = hoveredElement.find("a.menu-item");
    menuLink.append($("#FlyoutMenu"));
    var menuHref = menuLink[0].href;
    $.ajax({
        url: "/_Layouts/Sylvania.Web.Master/MenuHandler.ashx?l1=" + menuHref,
        cache: true,
        error: function () { },
        success: function (html) {
            if (html != "") {
                if (String(html).indexOf("not found in") != -1) {
                    html = "<div class='tabsContainer' style='height: 100px;'>Menu page is missing</div>";
                }
                $("#FlyoutMenu").html(html);
                loadMenuEvents();
                addOnClickEvents(menuHref);
                $("#FlyoutMenu").toggle(true);
            }
            else
                $("#FlyoutMenu").toggle(false);
        }
    });

    //Add WebTrends onclick to main menu item
    addSectionClick(menuLink, menuHref);

    hoveredElement.find("ul.tabs").hide();
    hoveredElement.find(".drop").show();
}

function addOnClickEvents(menuHref) {
    //Process all links
    $('#FlyoutMenu a').each(function () {
        //Do not hook up ones where the ref starts with #
        if ($(this).attr("href").indexOf('#') == -1) {
            addSectionClick($(this), menuHref);
        }
    })
}

function addSectionClick(link, menuHref) {
    link
        .unbind('click.wt')
        .bind('click.wt', function (event) {
            event.stopPropagation();
            wtCallMultiTrack(wtGetSection(menuHref));
        });
}

function wtHeaderLink(sectionName) {
    wtCallMultiTrack('Header');
}

function wtFooterLink(sectionName) {
    wtCallMultiTrack('Footer');
}

function wtCallMultiTrack(sectionName) {
    //console.log('Called with section :' + sectionName);
    dcsMultiTrack('DCSext.waNavMethod', sectionName);
}

function wtGetSection(menuHref) {
    //Parse URL to determine Section
    var parts = menuHref.split('/');
    var Section = parts[4];
    var sectionName = Section + ' Tab';

    switch (Section) {
        case 'applications':
            sectionName = 'Applications Tab';
            break;
        case 'services':
            sectionName = 'Services Tab';
            break;
        case 'innovation':
            sectionName = 'Innovation Tab';
            break;
        case 'products':
            sectionName = 'Product Tab';
            break;
        case 'mysylvania':
            sectionName = 'MySylvania Tab';
            break;
        case 'tools-and-resources':
            sectionName = 'Tools and Resources Tab';
            break;
    }
    return (sectionName);
}

function loadMenuEvents() {
    $(".tabBox").hide(); //Hide all tab content
    var activeTab = "#tab1"; //Find the href attribute value to identify the active tab + content
    $(activeTab).show(); //Fade in the active ID content

    //On Click Event
    $("ul.tabs li").click(function () {
        $("ul.tabs li").removeClass("active"); //Remove any "active" class
        $(this).addClass("active"); //Add "active" class to selected tab
        $(".tabBox").hide(); //Hide all tab content

        var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content
        newValue = activeTab.substr(activeTab.indexOf("#"));

        $(newValue).show(); //Fade in the active ID content
        return false;
    });
}
/* Callback for jQuery.hover(out).
* This function manages hiding the dropdown menu.
*/
function onTabHoverOut(event) {
    // clear the timer if one was set
    if (hoverTimer) {
        clearTimeout(hoverTimer);
        hoverTimer = 0;
    }
    // remove active tab and hide it's tabbox
    jQuery(".tabBox").hide();
    jQuery("ul.tabs li").removeClass("active");

    var elm = jQuery(this);
    jQuery(elm).find(".drop").hide();
    $("#FlyoutMenu").toggle(false);
}

// the element that was touched
var touchedElement = 0;

/* Callback for jQuery.live(touchstart).
* This function handles the touch events for the fatnav.
*/
function onTouchStart(event) {
    event.preventDefault();

    if (touchedElement) {
        touchedElement.trigger("mouseleave");
    }
    touchedElement = jQuery(this);

    jQuery(this).trigger("mouseenter");
}

/* Callback for jQuery.live(touchstart) on wrapper element.
* This function listens for touchstart evnets outside the fatnav area.
*/
function onTouchOutsideStart(event) {
    touchedElement.trigger("mouseleave");
}


