function allButtonsOff() {

    $(".buttonContainer").filter(".on").children(".buttonBG").animate({
        opacity: .7
    }, 500);
    $(".buttonContainer").filter(".on").children(".buttonContent").children("a").animate({
        color: "#1144a4"
    }, 500);
    
    $(".buttonContainer").removeClass("on");

}

$(document).ready(function() {

    //load the main page into the content frame on load
    $("#contentDiv").load("htmlcontent/mainPage.html");
    
    //make buttons actually link to files indicated in
    //their ids
    $(".buttonContainer a").click(function() {
    
        //make button target from anchor id
        var buttonTarget = $(this).attr("id").substr(7)+".html";
        
        //load that target into the main content frame
        $("#contentDiv").empty().load("htmlcontent/"+buttonTarget);
        
        //kill all subpanes
        $(".subButtonContainer").filter(":visible").fadeOut(800);
        
    });
    
    //reposition subpanes to match their parent buttons
    $(".subButtonContainer").each(function() {
        var idNum = $(this).attr("id").substr(3);
        var num = parseInt(idNum);
        var newFromTopVal = (20+(num*28)).toString();
        $("#sub"+idNum).css({ top: newFromTopVal+"px" });
    });
    
    //make links in subpanes work
    $(".subButtonContainer a").click(function() {
    
        //make button target from anchor id
        var buttonTarget = $(this).attr("id")+".html";
        
        //load that target into the main content frame
        $("#contentDiv").empty().load("htmlcontent/"+buttonTarget);
        
        //kill all buttons and subpanes
        allButtonsOff();
        $(".subButtonContainer").filter(":visible").fadeOut(800);
        
    });
    
    //attach a rollover to each sidebar button
    $(".buttonContainer").hover(
    
        //mouse in
        function() {
        
            $(".subButtonContainer").filter(":visible").fadeOut(800);
            allButtonsOff();
    
            $(this).children(".buttonBG").animate({
                opacity: 1
            },500);
            $(this).children(".buttonContent").children("a").animate({
                color: "#ffffff"
            },500);
            
            var idNum = $(this).attr("id").substr(9);
            $("#sub"+idNum).show("blind", { direction: "horizontal" }, 800);
            
            $(this).addClass("on");
    
        },
        //mouse out
        function() { }
        
    );
    
    //kill sub container when the mouse leaves it
    $(".subButtonContainer").mouseleave(function() {
        allButtonsOff();
        $(".subButtonContainer").filter(":visible").fadeOut(800);
    });
    
    //contigency
    //kills all buttons and submenus if the mouse enters the main content area
    $("#contentDiv").mouseenter(function() {
        allButtonsOff();
        $(".subButtonContainer").filter(":visible").fadeOut(800);
    });

});