// on page load 
    $(document).ready(function() { 
         
        $('input.inputfield').clearFieldOnFocus(); 

		$("#config").click(function () {
			$("#edit_accounts").slideToggle("slow");
			$("#about").hide("slow");
			$("#config").hide("slow");
			$("#add").show("slow");		
			$("#help").show("slow");
			$("#home").show("slow");			
			
		});
		$("#add").click(function () {
			$("#helpcontent").hide("slow");
		});		
		$("#home_link").click(function () {
			$("#config").show("slow");
			$("#home").hide("slow");
			$("#edit_accounts").hide("slow");
			$("#about").show("slow");	
			$("#help").hide("slow");	
			$("#add").hide("slow");	
			$("#statsview").hide("slow");	
		});		
		$("#config_link").click(function () {
			$("#edit_accounts").slideToggle("slow");
			$("#statsview").slideToggle("slow");
			$("#helpcontent").hide("slow");			
		});			
		$("#view").click(function () {
			$("#statsview").slideToggle("slow");
			$("#edit_accounts").slideToggle("slow");
			$("#helpcontent").slideToggle("slow");			
		});	
		$("#help").click(function () {
			$("#helpcontent").slideToggle("slow");
		});	
			


 	});
 
// clear field on focus, restore on blur 
    jQuery.fn.extend({ 
        clearFieldOnFocus: function() { 
            return this.each(function() { 
                if($(this).attr('rel') == undefined) $(this).attr('rel', $(this).attr('value')); 
                $(this).focus(function() { if($(this).attr('value') == $(this).attr('rel')) $(this).attr('value', ''); }); 
                $(this).blur(function() { if($(this).attr('value') == '') $(this).attr('value', $(this).attr('rel')); }); 
            }); 
        } 
    });