﻿/// <reference path="jquery-1.3.2-vsdoc.js" />

/*
*
* jQuery IK NavHover
* 
* Description: Sets up navigation carousel and slideshow components for the
*              Index and News pages of the Search Marketing corporate website.
*
* Created by: Wesley Kramer
* Last Modified: 8/12/2010
* 
*/

var isCyclePaused = false;
var isMoreInfoOpen = false;
var numSlides = 0;
var startSlide = 0;
var isMoreInfoOpenInit = false;

function setupCarousel() {
    //Get our elements for faster access and set overlay width
    var navDiv = $("div#contentNav");
    var navDivWrapper = $("div#contentNavWrapper");
    var ul = $("div#contentNav > ul");
    var pageBkg = $("#pageBkg");
    var ulPaddingLeft = 25;
    var divWidth = navDiv.width();

    //Remove scrollbars
    navDiv.css({ overflow: "hidden" });

    var ulWidth = 0;
    ul.children("li").each(function(i) {
        var pLeft = parseInt($(this).css("paddingRight").replace("px", ""));
        var left = parseInt($(this).css("marginLeft").replace("px", ""));
        var right = parseInt($(this).css("marginRight").replace("px", ""));
        ulWidth += $(this).width() + left + right;
        ulPaddingLeft = pLeft;
    });
    ul.css({ width: ulWidth + "px" });

    //Find last image container
    var lastLi = ul.find("li:last-child");
    var isAnimating = false;
    var isCyclePausedLocally = false;

    //When user move mouse over menu
    navDivWrapper.mouseenter(function(e) {
        if (isCyclePaused) return;

        isCyclePausedLocally = true;
        pageBkg.cycle("pause");

        scrollToOffset(lastLi, navDiv, divWidth, e, 100);
    });

    navDivWrapper.mouseleave(function(e) {
        if (!isCyclePausedLocally) return;
        
        isCyclePausedLocally = false;
        pageBkg.cycle("resume");
    });

    navDivWrapper.mousemove(function(e) {
        if (!isAnimating) {
            scrollToOffset(lastLi, navDiv, divWidth, e, 0);
        }
    });

    $("a.imgNavThumb > img").reflect({ height: 0.15, opacity: 0.4 });
}

function scrollToOffset(lastLi, navDiv, divWidth, e, time) {
    var ulWidth = lastLi[0].offsetLeft + lastLi.outerWidth() + 100;
    var left = (e.pageX - navDiv.offset().left - 50) * (ulWidth - divWidth) / divWidth;
    isAnimating = true;

    navDiv.animate({ scrollLeft: left }, time, "linear", function() { isAnimating = false; });
}

function onBefore() {
    var firstDiv = $(this).children("div:first");
    var id = firstDiv.attr("id").replace("background", "");
    //location.href = "#s=" + id;
    
    if (!$("#thumb" + id).children("span:first").is(".selectedItem")) {
        $("span.selectedItem").fadeOut("slow", function() { $(this).removeClass("selectedItem"); });
        $("#thumb" + id).children("span:first").addClass("selectedItem").fadeIn("slow");
    }
}



function setupSlideShow() {
    // Loop through all slide elements and add click handlers
    var token = true;    
    for (var i = 0; token; i++) {

        if ($("div#background" + i).length == 0) {
            token = false;
            break;
        }
        else {
            numSlides++;
        }

        // on click for moreinfo, pause the slide show and jump to selected slide
        $("#moreInfo" + i).click(function() {
            moreInfoClick(this);
        });

        // click on thumbnails in content nav bar
        $("#moreInfo" + i + "t").click(function() {
            moreInfoThumbClick(this);
        });

        // close the new window
        $("#close" + i).click(function() {
            closeClick(this);
        });

        // tooltips
        $("#moreInfo" + i + "t").tooltip({
            track: true,
            delay: 0,
            showURL: false,
            showBody: " - ",
            fade: 250,
            opacity: 1
        });
    }

    // Add span element for currently-selected slide
    $("div#contentNav > ul > li > a").before("<span />");
    
    // Start slideshow cycle
    $("div#pageBkg").cycle({
        fx: "fade",
        timeout: 9000,
        cleartype: 0,
        startingSlide: startSlide,
        before: onBefore
    });

    // Open MoreInfo window if needed
    if (isMoreInfoOpenInit) {
        $("#moreInfo" + startSlide).click();
    }
}


function moreInfoClick(e) {
    isCyclePaused = true;
    isMoreInfoOpen = true;

    var id = parseInt(e.id.replace("moreInfo", ""));
    //location.href = "#s=" + id + "&o=true";

    $("div#pageBkg").cycle("pause");
    $("div#pageBkg").cycle(id);

    if (isMoreInfoOpenInit) {
        $("div#background" + id + " > div.contentSummary").slideUp(0, function() {
            $("div#content" + id).slideDown(0);
        });

        $("div#contentNavWrapper").animate({ top: "640px" }, 0);
        isMoreInfoOpenInit = false;
    }

    else {
        $("div#background" + id + " > div.contentSummary").slideUp("slow", function() {
            $("div#content" + id).slideDown("slow");
        });

        $("div#contentNavWrapper").animate({ top: "640px" }, 1500);
    }

    pageTracker._trackPageview(getEventName(e.href));
}

function moreInfoThumbClick(e) {
    // reset the nav bar, and clear all panels that might already be opened
    var targetSlide = parseInt(e.id.replace("moreInfo", "").replace("t", ""));

    // only cycle to a given slide if it isn't the current selected item
    if (!$("#thumb" + (targetSlide)).children("span:first").is(".selectedItem")) {
        $("#pageBkg").cycle(targetSlide);
        $("#pageBkg").cycle("resume");

        // do closing animation w/ delay only if "more info" is open
        if (isMoreInfoOpen) {
            isMoreInfoOpen = false;
            $("div#contentNavWrapper").animate({ top: "500px" }, 1500, function() {
                $("div.contentSummary").slideDown(1);
            });

            $(".homeContent").slideUp("slow");
        }
    }

    // do closing animation WITHOUT delay only if "more info" is open and it is the current selected item
    else if (isMoreInfoOpen) {
        isMoreInfoOpen = false;
        $("div#contentNavWrapper").animate({ top: "500px" }, 1500);
        $("div#background" + (targetSlide) + " > div.contentSummary").slideDown(1000);
        $(".homeContent").slideUp("slow");
    }

    pageTracker._trackPageview(getEventName(e.href));
}


function closeClick(e) {
    var id = e.id.replace("close", "");

    $("div#content" + id).slideUp("slow", function() {
        isMoreInfoOpen = false;
        isCyclePaused = false;

        // Move nav bar back up, slide summary down, and resume the slideshow
        $("div#contentNavWrapper").animate({ top: "500px" }, 1500);
        $("div#background" + id + " > div.contentSummary").slideDown(1000);
        $("#pageBkg").cycle("resume");
    });

    pageTracker._trackPageview(getEventName(e.href));
}


function parseQueryString() {
    
    var qs = location.hash.substring(1, location.hash.length);
    var queryString = new Array();

    if (qs.length == 0) {
        return;
    }

    var args = qs.split('&');
    for (var i = 0; i < args.length; i++) {
        var pair = args[i].split('=');
        var name = decodeURIComponent(pair[0]);

        var value = (pair.length == 2)
			? decodeURIComponent(pair[1])
			: name;

        queryString[name] = value;
    }

    startSlide = parseInt(queryString["s"]);
    isMoreInfoOpenInit = queryString["o"] != null && queryString["o"] == "true";
}

function getEventName(str) {
    var index = str.indexOf("#");
    if (index == -1) {
        return str;
    }

    var eventName = str.substring(index + 1, str.length);
    return eventName;
}


$(document).ready(function() {
    setupCarousel();
    //parseQueryString();
    setupSlideShow();
});

