﻿

var currentTab = "1";
var defaultTab = "1";
var totatlTabs = 0;
var currentVideo = "";
var trackName = "";

var timeoutTab = 5000;
var tabs = 0;


$(document).ready(function() {

    //AV
    var container = $("#container");
    var avContainer = $("#av-container");
    var mcf = new mcFramework(container, avContainer);
    mcf.mcSetSiteCode('mlite');
    mcf.mcSetCallbackFunction(function() { document.cookie = "site=" + document.domain.replace(/\./, "") + "av; path=/"; if (window.location.href != 'http://millerlite.com/default.aspx?zip') { window.location.href = 'http://millerlite.com/default.aspx?zip'; } positionTab(); } );
    mcf.mcSetAVFailTag(avfailtag);

    //set initial selected tab
    var selectedTabId = "tab-" + currentTab + "-selected";
    var selectedTab = document.getElementById(selectedTabId);
    var cTab = document.getElementById("tab-" + currentTab);

    //get tab name for tracking
    trackName = $(selectedTab).children(".buttonText").text();

    //position selected state of selected tab
    var position = $(cTab).position();
    var moveAmount = position.top - 3;

    $(selectedTab).css("top", moveAmount);
    $(selectedTab).show();
    $(cTab).css("visibility", "hidden");

    var module = "module-" + currentTab;
    var showModule = document.getElementById(module);

    $(showModule).show();

    var title = "title-" + currentTab;
    var showTitle = document.getElementById(title);

    $(showTitle).show();

    //add tab rollover states
    $(".tab-target").mouseover(function() {

        var tab = $(this).attr("id");
        var tabSplit = tab.split("-");
        var tabName = "tab-" + tabSplit[1];
        var tabMoused = document.getElementById(tabName);
        $(tabMoused).children(".buttonImage").children(".image-over").show();
        $(tabMoused).children(".buttonText").addClass("roll-text");

    });

    $(".tab-target").mouseout(function() {
        var tab = $(this).attr("id");
        var tabSplit = tab.split("-");
        var tabName = "tab-" + tabSplit[1];
        var tabMoused = document.getElementById(tabName);
        $(tabMoused).children(".buttonImage").children(".image-over").hide();
        $(tabMoused).children(".buttonText").removeClass("roll-text");
    });


    //add tab click functionality
    $(".tab-target").click(function() {
        stopTabTimer();
        var tab = $(this).attr("id");
        var tabSplit = tab.split("-");
        var tabName = tabSplit[1];
        if (tabName != currentTab) {
            //video positioning fix
            var videoSRC = $(currentVideo).attr("src");
            $("#video-display").attr("src", videoSRC);

            //hide previous tab
            selectedTabId = "tab-" + currentTab + "-selected";
            selectedTab = document.getElementById(selectedTabId);
            cTab = document.getElementById("tab-" + currentTab);

            $(cTab).css("visibility", "visible");
            $(selectedTab).hide();

            module = "module-" + currentTab;
            showModule = document.getElementById(module);

            $(showModule).hide();

            title = "title-" + currentTab;
            showTitle = document.getElementById(title);

            $(showTitle).hide();

            //show current tab
            currentTab = tabName;

            selectedTabId = "tab-" + currentTab + "-selected";
            selectedTab = document.getElementById(selectedTabId);

            //get tab name for tracking
            trackName = $(selectedTab).children(".buttonText").text();
            trackTab(trackName);

            cTab = document.getElementById("tab-" + currentTab);

            position = $(cTab).position();
            moveAmount = position.top - 3;

            $(selectedTab).css("top", moveAmount);
            $(selectedTab).show();
            $(cTab).css("visibility", "hidden");

            module = "module-" + currentTab;
            showModule = document.getElementById(module);

            $(showModule).show();

            title = "title-" + currentTab;
            showTitle = document.getElementById(title);

            $(showTitle).show();



        }
    });

    //add link to module container
    $(".module-container").click(function() {
        var link = $(this).attr("link");

        if (link != undefined) {
            trackPage('pagename=MillerLite Homepage: ' + trackName + ',channel=MillerLite Homepage');
            window.open(link);
        }
    });

    //add video module functionality
    currentVideo = $(".video-name").first().parent();
    var videoTitle = $(currentVideo).children(".video-name").text();

    $("#video-title").text(videoTitle.toUpperCase());

    $(currentVideo).children(".video-thumb-selected").show();
    $(currentVideo).children(".video-thumb").hide();

    $(currentVideo).css("width", "100px");
    $(currentVideo).children(".video-name").addClass("selected-text");

    var videoSRC = $(currentVideo).attr("src");
    $("#video-display").attr("src", videoSRC);


    //add video thumb functionality
    $(".video-thumb-container").click(function() {
        if ($(this).children(".video-name").text() != $(currentVideo).children(".video-name").text()) {

            //deselected current video
            $(currentVideo).children(".video-thumb-selected").hide();
            $(currentVideo).css("width", "77px");
            $(currentVideo).children(".video-name").removeClass("selected-text");
            $(currentVideo).children(".video-thumb").show();

            //set new video
            currentVideo = $(this);
            videoTitle = $(currentVideo).children(".video-name").text();

            $("#video-title").text(videoTitle.toUpperCase());

            $(currentVideo).children(".video-thumb-selected").show();
            $(currentVideo).children(".video-thumb").hide();

            $(currentVideo).css("width", "100px");
            $(currentVideo).children(".video-name").addClass("selected-text");

            $(this).children(".video-thumb-over").hide();

            videoSRC = $(currentVideo).attr("src");
            $("#video-display").attr("src", videoSRC);
        }
    });

    $(".video-thumb-container").mouseover(function() {
        if ($(this).children(".video-name").text() != $(currentVideo).children(".video-name").text()) {
            $(this).children(".video-thumb-over").show();

        }
    });

    $(".video-thumb-container").mouseout(function() {
        if ($(this).children(".video-name").text() != $(currentVideo).children(".video-name").text()) {
            $(this).children(".video-thumb-over").hide();
        }
    });

    //add view all functionality
    $("#view-all-target").modalPanel();
    $("#view-all-target").click(function() {
        trackPage('pagename=MillerLite Homepage: View All,channel=MillerLite Homepage');
    });


    //rotate home tabs

    //get total tabs
    totalTabs = $(".tab-target").length
    tabs = window.setTimeout(switchTab, timeoutTab);

});
function switchTab() {
    
    //video positioning fix
    var videoSRC = $(currentVideo).attr("src");
    $("#video-display").attr("src", videoSRC);
    
    //hide previous tab
    selectedTabId = "tab-" + currentTab + "-selected";
    selectedTab = document.getElementById(selectedTabId);
    cTab = document.getElementById("tab-" + currentTab);

    $(cTab).css("visibility", "visible");
    $(selectedTab).hide();

    module = "module-" + currentTab;
    showModule = document.getElementById(module);

    $(showModule).hide();

    title = "title-" + currentTab;
    showTitle = document.getElementById(title);

    $(showTitle).hide();
   
    if (currentTab != totalTabs) {
        currentTab++;
    }
    
    //show next tab
    selectedTabId = "tab-" + currentTab + "-selected";
    selectedTab = document.getElementById(selectedTabId);
    cTab = document.getElementById("tab-" + currentTab);

    //get tab name for tracking
    trackName = $(selectedTab).children(".buttonText").text();

    position = $(cTab).position();
    moveAmount = position.top - 3;

    $(selectedTab).css("top", moveAmount);
    $(selectedTab).show();
    $(cTab).css("visibility", "hidden");

    module = "module-" + currentTab;
    showModule = document.getElementById(module);

    $(showModule).show();

    title = "title-" + currentTab;
    showTitle = document.getElementById(title);

    $(showTitle).show();

    if (currentTab == 4) {
        stopTabTimer();
    }
    else {
        
        resetTabTimer();
    }
}

function stopTabTimer() {
    
    window.clearTimeout(tabs);
    tabs = null;
}

function resetTabTimer() {
    if (tabs) {
        window.clearTimeout(tabs);
        tabs = null;
        tabs = window.setTimeout(switchTab, timeoutTab);
    }
}

//position selected tab on AV show //av callback
function positionTab() {
    //trackHome
    trackView();
    var selectedTabId = "tab-" + currentTab + "-selected";
    var selectedTab = document.getElementById(selectedTabId);
    var cTab = document.getElementById("tab-" + currentTab);

    var position = $(cTab).position();
    var moveAmount = position.top - 3;

    $(selectedTab).css("top", moveAmount);

    //set background

    $('body').css("background-image", "url('/images/home/main-background.jpg')");

    //video positioning fix
    
    var videoSRC = $(currentVideo).attr("src");
    $("#video-display").attr("src", videoSRC);

    selectedTabId = "tab-" + currentTab + "-selected";
    selectedTab = document.getElementById(selectedTabId);
    cTab = document.getElementById("tab-" + currentTab);

    $(cTab).css("visibility", "visible");
    $(selectedTab).hide();

    module = "module-" + currentTab;
    showModule = document.getElementById(module);

    $(showModule).hide();

    title = "title-" + currentTab;
    showTitle = document.getElementById(title);

    $(showTitle).hide();

    currentTab = defaultTab;

    selectedTabId = "tab-" + currentTab + "-selected";
    selectedTab = document.getElementById(selectedTabId);
    cTab = document.getElementById("tab-" + currentTab);

    position = $(cTab).position();
    moveAmount = position.top - 3;

    $(selectedTab).css("top", moveAmount);
    $(selectedTab).show();
    $(cTab).css("visibility", "hidden");

    module = "module-" + currentTab;
    showModule = document.getElementById(module);

    $(showModule).show();

    title = "title-" + currentTab;
    showTitle = document.getElementById(title);

    $(showTitle).show();

    if (tabs) {
        window.clearTimeout(tabs);
        tabs = null;
        tabs = window.setTimeout(switchTab, timeoutTab);
    }
    else {
        tabs = window.setTimeout(switchTab, timeoutTab);
    }
}

//overlay window for view all

(function($) {
    $.fn.extend({
        modalPanel: function() {

            //Our function for hiding the modalbox
            function modalHide() {
                $(document).unbind("keydown", handleEscape);
                var remove = function() { $(this).remove(); };
                overlay.fadeOut(remove);
                modalWindow
					.fadeOut(remove)
					.empty();
            }

            //Our function that listens for escape key.
            function handleEscape(e) {
                if (e.keyCode == 27) {
                    modalHide();
                }
            }

            //Create our overlay object
            var overlay = $("<div id='modal-overlay'></div>");
            //Create our modal window
            var modalWindow = $("<div id='modal-window'></div>");

            return this.each(function() {
                //Listen for clicks on objects passed to the plugin
                $(this).click(function(e) {

                    if (typeof document.body.style.maxHeight === "undefined") { //if IE 6
                        $("body", "html").css({ height: "100%", width: "100%" });
                    }

                    //Append the overlay to the document body
                    $("body").append(overlay.click(function() { modalHide(); }));
                    //Add a loader to our page
                    $("body").append("<div id='modal-load'></div>");

                    //Set the css and fade in our overlay
                    overlay.css("opacity", 0.8);
                    overlay.show();

                    //Prevent the anchor link from loading
                    e.preventDefault();

                    //Activate a listener
                    $(document).keydown(handleEscape);

                    //load tab panels
                    $("#modal-load").remove();
                    var windowHtml = "<div class='modal-image'>" + $("#viewAll").html() + "</div>";
                    modalWindow.append(windowHtml);

                    $("body").append(modalWindow);
                    var wwidth = $(".modal-image").width() / 2;
                    //totalTabs = $(".tab-target").length;
                    //var totalRows = totalTabs / 3;
                    //totalRows = Math.floor(totalRows);

                    var wheight = 180;


                    modalWindow.css({
                        "margin-left": -wwidth,
                        "margin-top": -wheight
                    });
                    modalWindow.fadeIn(50);


                    //Load the image
                    /*var img = new Image();
                    $(img).load(function() {
                    var imageWidth = img.width / 2;
                    var imageHeight = img.height / 2;
                    modalWindow.css({
                    "margin-left": -imageWidth,
                    "margin-top": -imageHeight
                    });
                    $("#modal-load").remove();
                    modalWindow.append(img);
                    $(this).addClass("modal-image");
                    $("body").append(modalWindow);
                    modalWindow.fadeIn(50);
                    })
                    .attr({ src: this.href }).click(function() {
                    modalHide();
                    });*/
                });
            });
        }
    });
})(jQuery);

//Tracking
function avfailtag() {
    trackPage('pagename=MillerLite AV: AV Fail,channel=MillerLite AV');
}

function trackView() {
    trackPage('pagename=MillerLite Homepage: Home,channel=MillerLite Homepage');
}

function trackTab(tabName) {
    trackPage('pagename=MillerLite Homepage: Tab ' + tabName + ',channel=MillerLite Homepage');
}

//show AV
function showAV() {
    $('#av-container').show();
    $('#container').hide();
    $('body').css('background-image', 'url(/images/av/av-background.jpg)');
    trackPage('pagename=MillerLite AV: AV,channel=MillerLite AV');
}


