$(document).ready(function() {
	INFIELD.setup('findOutMore');
	SELECTBOXES_RELATION.setup('project', 'destination', findOutMoreJSON, ['', 'Undecided']);

	$('#btnSubmit').replaceWith('<a id="findoutmore-submit" class="hidden" href="javascript: void(0);" title="Send">Send</a>')
	$('#findoutmore-submit').click(function (){
		INFIELD.clearInFieldValues();
		$('form#findOutMore').submit();
	});
});

var SELECTBOXES_RELATION = {
	setup	: function(masterSelectboxId, slaveSelectBoxId, relationJSON, noRemoveValues) {
		msBox = $('select[name="' + masterSelectboxId + '"]');
		svBox = $('select[name="' + slaveSelectBoxId + '"]');
		if (!noRemoveValues) {
			noRemoveValues = [];
		}

		if (!msBox.length) {
			return;
		}

		if (!svBox.length) {
			return;
		}

		if (!relationJSON) {
			return;
		}

		msBox.bind('change', {svBox:svBox, noRemoveValues:noRemoveValues, relationJSON:relationJSON}, SELECTBOXES_RELATION.slaveDraw);
		msBox.change();

	},

	slaveDraw	: function(ev) {

			var obj 			= ev.target;
			var svBox 			= ev.data.svBox;
			var noRemoveValues 	= ev.data.noRemoveValues;
			var relationJSON 	= ev.data.relationJSON;

			var selectedVal = $(obj).find('option:selected').val();
			var svSelected 	= $(svBox).find('option:selected').val();

			var removingSelector = '';

			for (var i in noRemoveValues) {
				removingSelector += '[value!="' + noRemoveValues[i] + '"]';
			}

			$(svBox).find('option' + removingSelector).remove();

			svBoxJSONValues = relationJSON[selectedVal];

			optionObj = {};
			for (var i in svBoxJSONValues) {
				if (i == 'text') {
					continue;
				}
				optionObj = $(svBox).append($('<option></option>').val(i).html(svBoxJSONValues[i]['text']));
			}
			$(svBox).val(svSelected);

	}

};

var INFIELD = {
	// setup the infield values for a form
	setup	: function(formName) {
		if ($('form[name="' + formName + '"]').length) {
			formName = '[name="' + formName + '"]';
		} else {
			formName = '';
		}


		$('form' + formName + ' label').each(function() {
			var fieldName 	= $(this).attr('for');
			var fieldLabel 	= $(this).html();
			var formObj		= $('form [name="' + fieldName + '"]');

			if (formObj.length) {
				if (formObj.val() == '') {
					formObj.val(fieldLabel);
				}
				formObj.bind('focus', {label:fieldLabel}, INFIELD.setInFieldHandler);
				formObj.bind('blur', {label:fieldLabel}, INFIELD.setInFieldHandler);
				$(this).hide();
			}
		});

	},

	clearInFieldValues	: function(formName) {
		if (!formName) {
			formName = '';
		}

		if ($('form[name="' + formName + '"]').length) {
			formName = '[name="' + formName + '"]';
		} else {
			formName = '';
		}

		$('form' + formName).each(function() {
			var obj = $(this);

			obj.find('label').each(function() {
				var fieldName 	= $(this).attr('for');
				var fieldLabel 	= $(this).html();
				var formObj		= $('form [name="' + fieldName + '"]');

				if (formObj.length) {
					if (formObj.val() == fieldLabel) {
						formObj.val('');
					}
				}

			});

		});

	},

	// event handler function for handling onfocus and onblur calls
	setInFieldHandler	: function(ev) {
		var obj = $(ev.target);
		var label = ev.data.label;

		if ('focus' == ev.type) {
			if (obj.val() == label) {
				obj.val('');
			}
		} else if ('blur' == ev.type) {
			if (obj.val() == '') {
				obj.val(label);
			}
		}
	}
};