$(document).ready(function() {
	$("#jobtitle").charCounter(120, {
		container: "#countjobtitle"
	});

	$("#business_card_text").charCounter(120, {
		container: "#countbusiness_card_text"
	});

	$("#description").charCounter(1000, {
		container: "#countdescription"
	});

	// select sex
	$('li#sex a').click(function(){
		$('#sexval').val($(this).attr('title'));
		renderFace();

		return false;
	});

	// select skin
	$('li#skin a').click(function(){
		$('#skinval').val($(this).attr('title'));
		renderFace();

		return false;
	});

	// select color
	$('li#colour a').click(function(){
		$('#colourval').val($(this).attr('title'));
		renderFace();

		return false;
	});

	// reset face
	$('#reset').click(function(){
		$('li#bod div a').removeClass();
		$('li#bod div a').addClass('face f_0_0_0');
	});

	// help bubbles
	$('.withhelp .helpbubble').next().children('input, textarea').focus(function(){
		$(this).parent('p').prev().fadeIn();
		var fieldType = $(this).attr('type');
		if ( fieldType == 'text' || fieldType == 'TEXT' || fieldType == 'password' || fieldType == 'PASSWORD' ) {
			$(this).parent('p').prev().children('.rounded').children('.innerbub').css('background-position','left 16px');
		}
		$(this).blur(function(){ $(this).parent('p').prev().fadeOut(); });
	});
});

// redraw face
renderFace = function(){
	$('li#bod div a').removeClass();
	$('li#bod div a').addClass('face f_' + $('#sexval').val() + '_' + $('#skinval').val() + '_' + $('#colourval').val());
};
