//Function to add dhtml functionality to the tabs on the website
$(document).ready(
    function addTabListeners(){
        var activeTab = 'tabItemDefault';
        $(".tabItem").hover(
            //hover over action
            function(){
                if ($(this).attr("id") == activeTab)                       //This is the active tab
                {
                    //We don't need to hover the active tab
                }
                else                                            //This is not the active tab
                {
                    $(this).find(".tabImageOff").hide();        //Hide the non-hover image
                    $(this).find(".tabImageHover").show();      //Show the hover image
                }  
            },
            //hover out action
            function(){
                if ($(this).attr("id") == activeTab)                       //This is the active tab
                {
                    //We don't need to un-hover the active tab
                }
                else                                            //This is not the active tab
                {
                    $(this).find(".tabImageHover").hide();      //Hide the hover image
                    $(this).find(".tabImageOff").show();        //Show the non-hover image
                }
            }
        );
        $(".tabItem").click(
            function(){
                if ($(this).attr("id") == activeTab)                       //This is the active tab
                {
                    //We don't need to fire a click event for an already active tab
                }
                else                                            //This is not the active tab
                {                 
                    $("#" + activeTab).find(".tabImageOn").hide();                      //Hide the on-state for the currently active tab
                    $("#" + activeTab).find(".tabImageHover").hide();                   //Hide the hover-state for the currently active tab
                    $("#" + activeTab).find(".tabImageOff").show();                     //Show the off-state for the currently active tab
                    activeTab = $(this).attr("id");                                     //Make the clicked tab the active tab
                    $(this).find("tabImageHover").hide();                               //Hide the hover image
                    $(this).find("tabImageOff").hide();                                 //Hide the off image
                    $(this).find("tabImageOn").show();                                  //Show the hover image
                    $(this).find("a").blur();                                           //Remove unwanted anchor focus
                    
                    $(".tabContentHolder").html("<img src='/images/global960/loadingAnimation.gif' class='loadingImage' width=208 height=13 border=0>");                                    //Empty the tab content holder
                    var tabPage = $(this).find("a").attr("rel");                        //Find the ajax link from the rel attribute
                    tabPage = tabPage + "&t=" + Math.random().toString();
                    if ($(".tabList").attr("id") == "productPageTabList")               //Product page needs to call the thickbox code initializer on ajax load
                    {
                        $(".tabContentHolder").load(tabPage, 
                            function() { 
                                tb_init('a.thickbox, area.thickbox, input.thickbox');
                            }
                        ); //Load the tab page via ajax into the content holder     
                    }
                    else                                                                //Other pages do not need a post ajax javascript call
                    {
                        $(".tabContentHolder").load(tabPage);                                                       //Load the tab page via ajax into the content holder
                    }
                }
                return false; 
            }
        );
    }
);