$(document).ready(function(){
    var usr = $("#loginusername"),
        pwd = $("#loginpassword"),
        allFields = $([]).add(usr).add(pwd),
        tips = $("#validateTips")
    ;
    usr.focus();
    function updateTips(t){
        tips.text(t).effect("highlight",{},1500);
    }
    function checkLength(o,n,min) {
        if (o.val().length < min) {
            o.addClass('ui-state-error');
            updateTips(n + " must be at least " + min + " characters.");
            return false;
        } else {
            return true;
        }
    }
    $("#submit")
        .click(function(){
            var bValid = true;
            allFields.removeClass('ui-state-error');
            bValid = bValid && checkLength(usr,"Username",6);
            bValid = bValid && checkLength(pwd,"Password",8);
            return bValid;
        })
	    .hover(
	        function(){ 
	            $(this).addClass("ui-state-highlight"); 
	        },
	        function(){ 
	            $(this).removeClass("ui-state-highlight"); 
	        }
	    )
    ;
});