$(document).ready(function() { // do stuff when DOM is ready
    // flag: inputfield with focus
    flagInputField = '';
    // events: show/hide tooltip
    $('#fieldFullname').bind('mouseover', function(event) { $('#tooltipFullname').show(); });
    $('#fieldFullname').bind('mouseout', function(event) { checkMouseOut('fullname'); });
    $('#labelFullname').bind('mouseover', function(event) { $('#tooltipFullname').show(); });
    $('#labelFullname').bind('mouseout', function(event) { checkMouseOut('fullname'); });
    $('#inputFullname').bind('focus', function(event) { setActiveField('fullname'); });
    $('#fieldEmail').bind('mouseover', function(event) { $('#tooltipEmail').show(); });
    $('#fieldEmail').bind('mouseout', function(event) { checkMouseOut('email'); });
    $('#labelEmail').bind('mouseover', function(event) { $('#tooltipEmail').show(); });
    $('#labelEmail').bind('mouseout', function(event) { checkMouseOut('email'); });
    $('#inputEmail').bind('focus', function(event) { setActiveField('email'); });
    $('#fieldPurpose').bind('mouseover', function(event) { $('#tooltipPurpose').show(); });
    $('#fieldPurpose').bind('mouseout', function(event) { checkMouseOut('purpose'); });
    $('#labelPurpose').bind('mouseover', function(event) { $('#tooltipPurpose').show(); });
    $('#labelPurpose').bind('mouseout', function(event) { checkMouseOut('purpose'); });
    $('#inputPurpose').bind('focus', function(event) { setActiveField('purpose'); });
	$('#fieldMessage').bind('mouseover', function(event) { $('#tooltipMessage').show(); });
    $('#fieldMessage').bind('mouseout', function(event) { checkMouseOut('message'); });
    $('#labelMessage').bind('mouseover', function(event) { $('#tooltipMessage').show(); });
    $('#labelMessage').bind('mouseout', function(event) { checkMouseOut('message'); });
    $('#inputMessage').bind('focus', function(event) { setActiveField('message'); });
    // events: tooltip alternative texts
    $('#inputEmail').bind('keyup', function(event) { showEmailVerify(); });
    // show the tooltip for the active field (hide others)
    function setActiveField(field) {
        flagInputField = field;
        if (field == 'fullname') {
            $('#tooltipFullname').show();
            $('#tooltipEmail').hide();
            $('#tooltipPurpose').hide();
			$('#tooltipMessage').hide();
        }
        if (field == 'email') {
            $('#tooltipFullname').hide();
            $('#tooltipEmail').show();
            $('#tooltipPurpose').hide();
			$('#tooltipMessage').hide();
        }
        if (field == 'purpose') {
            $('#tooltipFullname').hide();
            $('#tooltipEmail').hide();
            $('#tooltipPurpose').show();
			$('#tooltipMessage').hide();
        }
		if (field == 'message') {
            $('#tooltipFullname').hide();
            $('#tooltipEmail').hide();
            $('#tooltipPurpose').hide();
			$('#tooltipMessage').show();
        }
    }
    // check if mouseout may hide tooltip (negative if still in focus)
    function checkMouseOut(field) {
        if (flagInputField != field) {
            if (field == 'fullname')
                $('#tooltipFullname').hide();
            if (field == 'email')
                $('#tooltipEmail').hide();
            if (field == 'purpose')
                $('#tooltipPurpose').hide();
			if (field == 'message')
                $('#tooltipMessage').hide();
        }
    }
    // tooltip update: email verification
    function showEmailVerify() {
        var email = $('#inputEmail').val();
        if (email.length > 0) {
            if (email.length > 3) {
                $('#tooltipEmail').html('email address valid');
                $('#tooltipEmail').removeClass('tooltipblue');
				$('#tooltipEmail').removeClass('tooltipgreen');
                $('#tooltipEmail').removeClass('tooltipred');
                $('#tooltipEmail').addClass('tooltipgreen');
            }
            else {
                $('#tooltipEmail').html('not a valid email address');
                $('#tooltipEmail').removeClass('tooltipblue');
				$('#tooltipEmail').removeClass('tooltipgreen');
                $('#tooltipEmail').removeClass('tooltipred');
                $('#tooltipEmail').addClass('tooltipred');
            }
        }
        else {
            $('#tooltipEmail').html('where we respond to');
            $('#tooltipEmail').removeClass('tooltipblue');
			$('#tooltipEmail').removeClass('tooltipgreen');
            $('#tooltipEmail').removeClass('tooltipred');
            $('#tooltipEmail').addClass('tooltipblue');
        }
    }
});