$(document).ready(function() {

    // default-value behavior for username and password
    $('div#login input.default-value').focus(function() {
        if($(this).attr('id') == 'password') {
            $(this).replaceWith('<input type="password" id="password" name="Password" value="" />');
            $('div#login input#password').focus();
        }
        $(this).val('');
        $(this).css({color : '#000000'});
    });

    // if username is blank and unfocused, put "Username" back in
    $('div#login input#username').blur(function() {
        if($(this).val() == '') {
            $(this).css({color : '#cccccc'});
            if($(this).attr('id') == 'username') {
                $(this).val('Username');
            }
        }
    });

    // check if both username and password are entered
    $('div#login input#submit').click(function() {
        var username = $('div#login input#username').val();
        var password = $('div#login input#password').val();

        if ((username == '') || (username == 'Username') || (password == '') || (password == 'Password')) {
            alert('Both Username and Password must be entered.');
            return false;
        } 
        else {
            return true;
        }
    });

});