var buttonArray1 = new Array;
var buttonArray2 = new Array;
var buttonArray3 = new Array;
var myCurrentPopupWindow = null;

$(function()
{
    buildNav("#nav-2 img", "activeNav");
    buildTopLeft("#top-nav-left img", "activeNav2");
    buildTopRight("#top-nav-right img", "activeNav3");
});

var buildNav = function(area, active)
{
    $(area).each(function(i)
    {
        if ($(this).attr("id") != active)
        {
            buttonArray1[i] = $(this).attr("src").substring(0, $(this).attr("src").lastIndexOf(".gif"));
            $(this).hover(
                    function()
                    {
                        $(this).attr("src", buttonArray1[i] + "-active.gif");
                    },
                    function()
                    {
                        $(this).attr("src", buttonArray1[i] + ".gif");
                    }
                    );
        }
    });
};

var  buildTopLeft = function(area, active)
{
    $(area).each(function(i)
    {
        if ($(this).attr("id") != active)
        {
            buttonArray2[i] = $(this).attr("src").substring(0, $(this).attr("src").lastIndexOf(".gif"));
            $(this).hover(
                    function()
                    {
                        $(this).attr("src", buttonArray2[i] + "-active.gif");
                    },
                    function()
                    {
                        $(this).attr("src", buttonArray2[i] + ".gif");
                    }
                    );
        }
    });
};

var  buildTopRight = function(area, active)
{
    $(area).each(function(i)
    {
        if ($(this).attr("id") != active)
        {
            buttonArray3[i] = $(this).attr("src").substring(0, $(this).attr("src").lastIndexOf(".gif"));
            $(this).hover(
                    function()
                    {
                        $(this).attr("src", buttonArray3[i] + "-active.gif");
                    },
                    function()
                    {
                        $(this).attr("src", buttonArray3[i] + ".gif");
                    }
                    );
        }
    });
};


// function for popup windows
var popupWindow = function(obj, windowName, options)
{
    var url = $(obj).attr("href");
    myCurrentPopupWindow = window.open(url, windowName, options);
};

var openExternalPopup = function(page, id)
{

    if ($("#" + id).size() == 0)
    {
        $.ajax({
            type: "GET",
            url: page,
            dataType: "html",
            success: function(msg)
            {
                // append new divs in correct location
                $("body").append(msg);

                // show it
                setTimeout(function()
                {
                    $("#" + id).vCenter();
                    $("#" + id).css("left", (($("body").width() / 2) - ($("#" + id).width() / 2) + "px"));
                    $("#" + id).show();

                    if ($("#" + id).css("top").split("px")[0] <= 0)
                    {
                        $("#" + id).css("top", "10px");
                    }
                }, 1);
            }
        });
    }
    else
    {
        $("#" + id).vCenter();
        $("#" + id).css("left", (($("body").width() / 2) - ($("#" + id).width() / 2) + "px"));
        $("#" + id).show();

        if ($("#" + id).css("top").split("px")[0] <= 0)
        {
            $("#" + id).css("top", "10px");
        }
    }

    //hide select boxes for IE6&7
    //could make this heavy duty with a version detect for just IE6
    if ($.browser.msie)
    {
        if (typeof document.body.style.maxHeight != "undefined")
        {
        }
        else
        {
            // IE6, older browsers
            $("select").css("visibility", "hidden");
        }
    }

    window.focus();

};

var closeExternalPopup = function(id)
{
    $("#" + id).hide();

    //hide select boxes for IE6&7
    //could make this heavy duty with a version detect for just IE6
    if ($.browser.msie)
    {
        if (typeof document.body.style.maxHeight != "undefined")
        {
        }
        else
        {
            // IE6, older browsers
            $("select").css("visibility", "visible");
        }
    }

    //if popup window open, put focus back on popup window
    if (myCurrentPopupWindow != null)
    {
        myCurrentPopupWindow.focus();
    }
};

/* Function(s) for More Colors QuickView */
function loadMoreColorsQuickView(context, obj, ev)
{
    closeMoreColorsQuickView();

    html = '<div id="quickview-layer">' +
           '  <div id="qv-top" class="widget-ie6png"><!--  --></div>' +
           '  <div id="qv-content" class="widget-ie6png">' +
           '    <div id="qv-header">' +
           '	   <h2>Quick View</h2>' +
           '	   <a id="qv-close" href="javascript:closeQuickView();">Close</a>' +
           '    </div>' +
           '    <div id="qv-body">' +
           '	   <img src="/assets/ws/images/outfitter/ajax-loader.gif" style="display: block; margin: 20px auto 0 auto;" alt="loading" />' +
           '    </div>' +
           '  </div>' +
           '  <div id="qv-bottom" class="widget-ie6png"><!--  --></div>' +
           '</div>';

    $("body").append(html);

    x = getMouseCoord(ev)[0] - 50;
    y = getMouseCoord(ev)[1] - 190;
    //x = getMouseCoord(ev)[0] + 60;
    //y = getMouseCoord(ev)[1] - 10;

    //alert( parseInt($("#quickview-layer").css("width")) );
    // if this is off the screen right, or bottom, move the popup onto the screen.
    $("#quickview-layer").css("left", x);
    $("#quickview-layer").css("top", y);
    $("#quickview-layer").show();
    /**
    if ((x + $("#quickview-layer").width()) > $("body").width())
    {
        x = x - 20 - ((x + $("#quickview-layer").width()) - $("body").width());
    }

    $("#quickview-layer").css("left", x);
    $("#quickview-layer").css("top", y);
    $("#quickview-layer").show();

    // if this thing is showing partly below the fold, then we need to move this into the viewport.
    vPosition = $.ViewportPosition();
    vSize = $.ViewportSize();
    if ((vPosition[1] + vSize[1]) <= (parseInt($("#quickview-layer").css("top")) + $("#quickview-layer").height()))
    {
        moveUpThisMuch = (parseInt($("#quickview-layer").css("top")) + $("#quickview-layer").height()) - ( vPosition[1] + vSize[1] - 50 );
        $("#quickview-layer").css("top", parseInt($("#quickview-layer").css("top")) - moveUpThisMuch + "px");
    }
     **/

    // hide the quickview icon.
    $("#quickview-icon").hide();
    $("quickview-layer").unbind("mouseover").mouseover(function()
    {
        $("#quickview-icon").hide();
    });

    params = "productId=" + $(obj).parent().attr("id");
    ajaxQuickView(context + "/catalog/quickview.jsp", params);

};

function closeMoreColorsQuickView()
{
    $("#quickview-layer").remove();
};

/* Function(s) for QuickView */
function loadQuickView(context, obj, ev)
{
    closeQuickView();

    html = '<div id="quickview-layer">' +
           '  <div id="qv-top" class="widget-ie6png"><!--  --></div>' +
           '  <div id="qv-content" class="widget-ie6png">' +
           '    <div id="qv-header">' +
           '	   <h2>Quick View</h2>' +
           '	   <a id="qv-close" href="javascript:closeQuickView();">Close</a>' +
           '    </div>' +
           '    <div id="qv-body">' +
           '	   <img src="/assets/ws/images/outfitter/ajax-loader.gif" style="display: block; margin: 20px auto 0 auto;" alt="loading" />' +
           '    </div>' +
           '  </div>' +
           '  <div id="qv-bottom" class="widget-ie6png"><!--  --></div>' +
           '</div>';

    $("body").append(html);

    x = getMouseCoord(ev)[0] - 60;
    y = getMouseCoord(ev)[1] - 160;
    //x = getMouseCoord(ev)[0] + 60;
    //y = getMouseCoord(ev)[1] - 10;

    //alert( parseInt($("#quickview-layer").css("width")) );
    // if this is off the screen right, or bottom, move the popup onto the screen.
    if ((x + $("#quickview-layer").width()) > $("body").width())
    {
        x = x - 20 - ((x + $("#quickview-layer").width()) - $("body").width());
    }

    $("#quickview-layer").css("left", x);
    $("#quickview-layer").css("top", y);
    $("#quickview-layer").show();

    // if this thing is showing partly below the fold, then we need to move this into the viewport.
    vPosition = $.ViewportPosition();
    vSize = $.ViewportSize();
    if ((vPosition[1] + vSize[1]) <= (parseInt($("#quickview-layer").css("top")) + $("#quickview-layer").height()))
    {
        moveUpThisMuch = (parseInt($("#quickview-layer").css("top")) + $("#quickview-layer").height()) - ( vPosition[1] + vSize[1] - 50 );
        $("#quickview-layer").css("top", parseInt($("#quickview-layer").css("top")) - moveUpThisMuch + "px");
    }

    // hide the quickview icon.
    $("#quickview-icon").hide();
    $("quickview-layer").unbind("mouseover").mouseover(function()
    {
        $("#quickview-icon").hide();
    });

    params = "productId=" + $(obj).parent().attr("id");
    ajaxQuickView(context + "/catalog/quickview.jsp", params);

}
;

function closeQuickView()
{
    $("#quickview-layer").remove();
}
;

function ajaxQuickView(page, params)
{
    params = "rId=" + new Date().getTime() + "&" + params;
    $.ajax({
        type: "GET",
        url: page,
        data: params,
        dataType: "html",
        success: function(msg)
        {
            $("#quickview-layer *").remove();
            $("#quickview-layer").html("");
            $("#quickview-layer").append(msg);

            // if this thing is showing partly below the fold, then we need to move this into the viewport.

            vSize = $.ViewportSize();
            vPosition = $.ViewportPosition();

            if ((vPosition[1] + vSize[1]) <= (parseInt($("#quickview-layer").css("top")) + $("#quickview-layer").height()))
            {
                moveUpThisMuch = (parseInt($("#quickview-layer").css("top")) + $("#quickview-layer").height()) - ( vPosition[1] + vSize[1] - 50 );
                $("#quickview-layer").css("top", parseInt($("#quickview-layer").css("top")) + "px");
            }
        }
    });
}
;

function addFromQuickView(page, params)
{
    params = params + "&hasSize=" + $("#hasSize").val() + "&hasColor=" + $("#hasColor").val() + "&hasLength=" + $("#hasLenght").val() + "&productVariantId=" + $("#productVariantId").val() + "&quantity=" + $("#quantity").val();
    $("#quickview-layer select").each(function()
    {
        params = params + "&" + $(this).attr("name") + "=" + $(this).val();
    });
    $("#quickview-layer *").remove();

    html = '  <div id="qv-top" class="widget-ie6png"><!--  --></div>' +
           '  <div id="qv-content" class="widget-ie6png">' +
           '    <div id="qv-header">' +
           '	   <h2>Quick View</h2>' +
           '	   <a id="qv-close" href="javascript:closeQuickView();">Close</a>' +
           '    </div>' +
           '    <div id="qv-body">' +
           '	   <img src="/assets/ws/images/outfitter/ajax-loader.gif" style="display: block; margin: 20px auto 0 auto;" alt="loading" />' +
           '    </div>' +
           '  </div>' +
           '  <div id="qv-bottom" class="widget-ie6png"><!--  --></div>';

    $("#quickview-layer").html(html);
    ajaxQuickView(page, params);
}
;


/* ---------------------- */

var doc = function()
{
    if (self.innerHeight)
    {
        doc.pageYOffset = self.pageYOffset;
        doc.pageXOffset = self.pageXOffset;
        doc.innerHeight = self.innerHeight;
        doc.innerWidth = self.innerWidth;
    }
    else if (document.documentElement && document.documentElement.clientHeight)
    {
        doc.pageYOffset = document.documentElement.scrollTop;
        doc.pageXOffset = document.documentElement.scrollLeft;
        doc.innerHeight = document.documentElement.clientHeight;
        doc.innerWidth = document.documentElement.clientWidth;
    }
    else if (document.body)
        {
            doc.pageYOffset = document.body.scrollTop;
            doc.pageXOffset = document.body.scrollLeft;
            doc.innerHeight = document.body.clientHeight;
            doc.innerWidth = document.body.clientWidth;
        }

    return doc;
};

function getMouseCoord(e)
{
    (!e) ? e = window.event : e = e;
    objDoc = new doc();
    (e.pageX) ? objDoc.pageX = e.pageX : objDoc.pageX = e.clientX + objDoc.scrollLeft;
    (e.pageY) ? objDoc.pageY = e.pageY : objDoc.pageY = e.clientY + objDoc.scrollTop;
    return [e.pageX,e.pageY];
}

/* Widget for getting Screen Position in Viewport */
(function()
{
    jQuery.ViewportPosition = function(ev)
    {
        if (typeof( window.pageYOffset ) == 'number')
        {
            //Netscape compliant
            return [ window.pageXOffset, window.pageYOffset ];
        }
        else if (document.body && ( document.body.scrollLeft || document.body.scrollTop ))
        {
            //DOM compliant
            return [ document.body.scrollLeft, document.body.scrollTop ];
        }
        else if (document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ))
            {
                //IE6 standards compliant mode
                return [ document.documentElement.scrollLeft, document.documentElement.scrollTop ];
            }
            else
            {
                return [ 0, 0 ];
            }
    };
})(jQuery);
/* ----------------------- */

/* Widget for getting the Browser Viewport Size */
(function()
{
    jQuery.ViewportSize = function()
    {
        if (typeof window.innerWidth != 'undefined')
        {
            return [  window.innerWidth, window.innerHeight];
        }
        else if (typeof document.documentElement != 'undefined' && typeof document.documentElement.clientWidth != 'undefined' && document.documentElement.clientWidth != 0)
        {
            return [  document.documentElement.clientWidth, document.documentElement.clientHeight];
        }
        else
        {
            return [  document.getElementsByTagName('body')[0].clientWidth, document.getElementsByTagName('body')[0].clientHeight];
        }
    };
})(jQuery);
/* ----------------------------------- */