if (document.images) {
    btnJoin = new Image(); btnJoin.src = "images/btnJoin_on.gif";
}

$(document).ready(function() {
    $('a.btn1').click(function(event) {
        event.preventDefault();
        $('.pnl2').hide();
        $('.pnl3').hide();
        $('.pnl1').show('slow');
        return false;
    });
    $('a.btn2').click(function(event) {
        event.preventDefault();
        $('.pnl1').hide();
        $('.pnl3').hide();
        $('.pnl2').show('slow');
        return false;
    });
//    $('a.btn3').click(function(event) {
//        event.preventDefault();
//        $('.pnl1').hide();
//        $('.pnl2').hide();
//        $('.pnl3').show('slow');
//        return false;
//    });
    $("a.closePnl").click(function(event) {
        event.preventDefault();
        $('.pnl1').hide("slow");
        $('.pnl2').hide("slow");
        $('.pnl3').hide("slow");
        disableButs(4);
        return false;
    });
});

function swapBut(imgname, imgswap) {
    imgname.src = "images/" + imgname.name + imgswap;
}
function swapBut2(imgID, imgswap) {
    document.getElementById(imgID).src = "images/" + imgswap;
}
function disableButs(btnID) {
    if (btnID == "1") {
        swapBut2('mainBut1', 'btn1_active.gif');
        swapBut2('mainBut2', 'btn2_off.gif');
        swapBut2('mainBut3', 'btn3_off.gif');
        document.getElementById('mainBut1').setAttribute("onmouseover", "");
        document.getElementById('mainBut1').setAttribute("onmouseout", "");
        document.getElementById('mainBut1').onmouseover = function() { };
        document.getElementById('mainBut1').onmouseout = function() { };
        document.getElementById('mainBut2').setAttribute("onmouseover", swapBut2('mainBut2', 'btn2_on.gif'));
        document.getElementById('mainBut2').setAttribute("onmouseout", swapBut2('mainBut2', 'btn2_off.gif'));
        document.getElementById('mainBut2').onmouseover = function() { swapBut2('mainBut2', 'btn2_on.gif'); };
        document.getElementById('mainBut2').onmouseout = function() { swapBut2('mainBut2', 'btn2_off.gif'); };
        document.getElementById('mainBut3').setAttribute("onmouseover", swapBut2('mainBut3', 'btn3_on.gif'));
        document.getElementById('mainBut3').setAttribute("onmouseout", swapBut2('mainBut3', 'btn3_off.gif'));
        document.getElementById('mainBut3').onmouseover = function() { swapBut2('mainBut3', 'btn3_on.gif'); };
        document.getElementById('mainBut3').onmouseout = function() { swapBut2('mainBut3', 'btn3_off.gif'); };

    }
    else if (btnID == "2") {
        swapBut2('mainBut2', 'btn2_active.gif');
        swapBut2('mainBut1', 'btn1_off.gif');
        swapBut2('mainBut3', 'btn3_off.gif');
        document.getElementById('mainBut2').setAttribute("onmouseover", "");
        document.getElementById('mainBut2').setAttribute("onmouseout", "");
        document.getElementById('mainBut2').onmouseover = function() { };
        document.getElementById('mainBut2').onmouseout = function() { };
        document.getElementById('mainBut1').setAttribute("onmouseover", swapBut2('mainBut1', 'btn1_on.gif'));
        document.getElementById('mainBut1').setAttribute("onmouseout", swapBut2('mainBut1', 'btn1_off.gif'));
        document.getElementById('mainBut1').onmouseover = function() { swapBut2('mainBut1', 'btn1_on.gif'); };
        document.getElementById('mainBut1').onmouseout = function() { swapBut2('mainBut1', 'btn1_off.gif'); };
        document.getElementById('mainBut3').setAttribute("onmouseover", swapBut2('mainBut3', 'btn3_on.gif'));
        document.getElementById('mainBut3').setAttribute("onmouseout", swapBut2('mainBut3', 'btn3_off.gif'));
        document.getElementById('mainBut3').onmouseover = function() { swapBut2('mainBut3', 'btn3_on.gif'); };
        document.getElementById('mainBut3').onmouseout = function() { swapBut2('mainBut3', 'btn3_off.gif'); };
    } else if (btnID == "3") {
        swapBut2('mainBut3', 'btn3_active.gif');
        swapBut2('mainBut1', 'btn1_off.gif');
        swapBut2('mainBut2', 'btn2_off.gif');
        document.getElementById('mainBut3').setAttribute("onmouseover", "");
        document.getElementById('mainBut3').setAttribute("onmouseout", "");
        document.getElementById('mainBut3').onmouseover = function() { };
        document.getElementById('mainBut3').onmouseout = function() { };
        document.getElementById('mainBut1').setAttribute("onmouseover", swapBut2('mainBut1', 'btn1_on.gif'));
        document.getElementById('mainBut1').setAttribute("onmouseout", swapBut2('mainBut1', 'btn1_off.gif'));
        document.getElementById('mainBut1').onmouseover = function() { swapBut2('mainBut1', 'btn1_on.gif'); };
        document.getElementById('mainBut1').onmouseout = function() { swapBut2('mainBut1', 'btn1_off.gif'); };
        document.getElementById('mainBut2').setAttribute("onmouseover", swapBut2('mainBut2', 'btn2_on.gif'));
        document.getElementById('mainBut2').setAttribute("onmouseout", swapBut2('mainBut2', 'btn2_off.gif'));
        document.getElementById('mainBut2').onmouseover = function() { swapBut2('mainBut2', 'btn2_on.gif'); };
        document.getElementById('mainBut2').onmouseout = function() { swapBut2('mainBut2', 'btn2_off.gif'); };
    } else if (btnID == "4") {
        swapBut2('mainBut1', 'btn1_off.gif');
        swapBut2('mainBut2', 'btn2_off.gif');
        swapBut2('mainBut3', 'btn3_off.gif');
        document.getElementById('mainBut1').setAttribute("onmouseover", swapBut2('mainBut1', 'btn1_on.gif'));
        document.getElementById('mainBut1').setAttribute("onmouseout", swapBut2('mainBut1', 'btn1_off.gif'));
        document.getElementById('mainBut1').onmouseover = function() { swapBut2('mainBut1', 'btn1_on.gif'); };
        document.getElementById('mainBut1').onmouseout = function() { swapBut2('mainBut1', 'btn1_off.gif'); };
        document.getElementById('mainBut2').setAttribute("onmouseover", swapBut2('mainBut2', 'btn2_on.gif'));
        document.getElementById('mainBut2').setAttribute("onmouseout", swapBut2('mainBut2', 'btn2_off.gif'));
        document.getElementById('mainBut2').onmouseover = function() { swapBut2('mainBut2', 'btn2_on.gif'); };
        document.getElementById('mainBut2').onmouseout = function() { swapBut2('mainBut2', 'btn2_off.gif'); };
        document.getElementById('mainBut3').setAttribute("onmouseover", swapBut2('mainBut3', 'btn3_on.gif'));
        document.getElementById('mainBut3').setAttribute("onmouseout", swapBut2('mainBut3', 'btn3_off.gif'));
        document.getElementById('mainBut3').onmouseover = function() { swapBut2('mainBut3', 'btn3_on.gif'); };
        document.getElementById('mainBut3').onmouseout = function() { swapBut2('mainBut3', 'btn3_off.gif'); };
    }


}
function hideDiv(id) {
    //safe function to hide an element with a specified id
    if (document.getElementById) { // DOM3 = IE5, NS6
        document.getElementById(id).style.display = 'none';
    }
    else {
        if (document.layers) { // Netscape 4
            document.id.display = 'none';
        }
        else { // IE 4
            document.all.id.style.display = 'none';
        }
    }
}

function showDiv(id) {
    //safe function to show an element with a specified id

    if (document.getElementById) { // DOM3 = IE5, NS6
        document.getElementById(id).style.display = 'block';
    }
    else {
        if (document.layers) { // Netscape 4
            document.id.display = 'block';
        }
        else { // IE 4
            document.all.id.style.display = 'block';
        }
    }
}