// This was the original setup function but was hardcoded with a div name. has been replaced with a call to initialiseDgTabs()
// from the callers additional javascript block and passing in the div out wrapper class name

//$(document).ready(function() {

//    //When page loads...
//    $("div.tabinstance1 .tab_content").hide(); //Hide all content
//    $("div.tabinstance1 ul.tabs li:first").addClass("active").show(); //Activate first tab
//    $("div.tabinstance1 .tab_content:first").show(); //Show first tab content

//    //On Click Event
//    $("div.tabinstance1 ul.tabs li").click(function() {
//        //hello
//        debugger;
//        $("div.tabinstance1 ul.tabs li").removeClass("active"); //Remove any "active" class
//        $(this).addClass("active"); //Add "active" class to selected tab
//        $("div.tabinstance1 .tab_content").hide(); //Hide all tab content

//        var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content
//        $(activeTab).fadeIn(); //Fade in the active ID content
//        return false;
//    });

//});

// --------------------------------------------------------------------------------
// initialiseDgTabs
// --------------------------------------------------------------------------------
// To be called in document ready by developer wanting to intialise a dgtab control
// example in addtional javascript
//
//<script type="text/javascript" language="javascript">
//    $(document).ready(function() {

//        initialiseDgTabs("tabinstance1");
//        initialiseDgTabs("tabinstance2");

//    });
//</script> 
//
function initialiseDgTabs(divTabOuterWrapper, strChangeOnMouseOver) {

    //debugger;
    $("div." + divTabOuterWrapper + " .dgtab_content").hide(); //Hide all content
    $("div." + divTabOuterWrapper + " ul.dgtabs li:first").addClass("active").show(); //Activate first tab
    $("div." + divTabOuterWrapper + " .dgtab_content:first").show(); //Show first tab content

    // How should we navigate, click or hover
    //On Click Event
    if ((strChangeOnMouseOver == undefined) || (strChangeOnMouseOver == 'click')) {
        //On Click Event
        $("div." + divTabOuterWrapper + " ul.dgtabs li").click(function() {
            //debugger;
            $("div." + divTabOuterWrapper + " ul.dgtabs li").removeClass("active"); //Remove any "active" class
            $(this).addClass("active"); //Add "active" class to selected tab
            $("div." + divTabOuterWrapper + " .dgtab_content").hide(); //Hide all tab content

            var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content
            $(activeTab).fadeIn(); //Fade in the active ID content
            return false;
        });
    }
    else {
        $("div." + divTabOuterWrapper + " ul.dgtabs li").mouseover(function() {
            //debugger;
            // If the current active tab is the same as this then do nothing
            // so get the active tab href first.
            var currentTab = $("div." + divTabOuterWrapper + " .active").find("a").attr("href");
            var selectedTab = $(this).find("a").attr("href");
            //dont do anything if its the same tab
            if (selectedTab != currentTab) {
                $("div." + divTabOuterWrapper + " ul.dgtabs li").removeClass("active"); //Remove any "active" class
                $(this).addClass("active"); //Add "active" class to selected tab
                $("div." + divTabOuterWrapper + " .dgtab_content").hide(); //Hide all tab content

                var selectedTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content
                $(selectedTab).fadeIn(); //Fade in the active ID content
            }
            return false;
        });

        // do nothing On Click Event
        $("div." + divTabOuterWrapper + " ul.dgtabs li").click(function() {
            return false;
        });
                
    }
}

// --------------------------------------------------------------------------------
// seekToTab
// --------------------------------------------------------------------------------
//
// Navigate to the specified tab in the specified tab control instance
function seekToTab(relOfTargetTab, divTabOuterWrapper)
{

    //debugger;
    $("div." + divTabOuterWrapper + " ul.dgtabs li").removeClass("active"); //Remove any "active" class

    $("div." + divTabOuterWrapper + " .dgtab_content").hide(); //Hide all tab content

    var activeTab = $("div." + divTabOuterWrapper + " ul.dgtabs").find("a").attr("href");
    
    //Get the requested target
    var x = $("div." + divTabOuterWrapper + " ul.dgtabs li:has(a[rel=" + relOfTargetTab + "])");
    
    //Make it the active tab
    $(x).addClass("active"); //Add "active" class to selected tab
    
    // Get handle to the tab
    var activeTab = $(x).find("a").attr("href");
    
    //Show it.
    $(activeTab ).fadeIn();

}