﻿﻿var TipAFriend = {

	counter : 1,
	
	recaptchaLoaded : false,

	addFriendRow : function(addButton) {
		// register MooTools in IE
		$(addButton);
		
		var Table = document.getElementById("tipAFriendBody");
		var tr = document.createElement("tr");

		var newNameTd = document.createElement("td");
		newNameTd.innerHTML = "<input name='name" + TipAFriend.counter + "' id='name-input-" + TipAFriend.counter + "' type='text'/>";
		tr.appendChild(newNameTd);

		var newEmailTd = document.createElement("td");
		newEmailTd.innerHTML = "<input name='email" + TipAFriend.counter
				+ "' id='email-input-" + TipAFriend.counter + "' type='text'/>";
		tr.appendChild(newEmailTd);

		Table.appendChild(tr);

		newNameTd.firstChild.focus();
		
		TipAFriend.counter++;
		$("totalFriends").value = TipAFriend.counter;
		if (TipAFriend.counter >= 5) {
			addButton.addClass("hidden");
		}
	},
	
	submit : function(e) {
		e.stop();
		
		if (!TipAFriend.validate()) {
			return;
		}
		
		this.set('send', {
			method: 'post',
			
			onSuccess: function() {
				TipAFriend.reportSuccess('Gelukt! Binnen enkele seconden ontvangen je vrienden bericht.');
				TipAFriend.visitRows(function (nameInput, emailInput) {
					DefaultText.reset(nameInput);
					DefaultText.reset(emailInput);
				});
				Recaptcha.reload();
			},
			
			onFailure: function(xhr) {
				if (xhr.statusText == 'CaptchaIncorrect') {
					$('recaptcha_response_field').addClass('invalid');
					TipAFriend.reportFailure('De woorden kwamen niet overeen. Probeer het nog een keertje.');
				} else {
					TipAFriend.reportFailure('Er is een fout opgetreden. Probeer het straks nog eens!');
				}
				Recaptcha.reload();
			}
		});
		this.send();
	},
	
	reportFailure : function(message) {
		$('tipAFriend-result').set('text', message);
		$('tipAFriend-result').className = 'failure';
	},

	reportSuccess : function(message) {
		$('tipAFriend-result').set('text', message);
		$('tipAFriend-result').className = 'success';
	},

	validate : function() {
		TipAFriend.clearFeedback();
		
		// Check own name
		var myNameInput = $('myname');
		if (!DefaultText.isFilledIn(myNameInput) || !myNameInput.value.trim()) {
			TipAFriend.reportFailure('Vergeet niet je eigen naam in te vullen.');
			$('myname').addClass('invalid');
			return false;
		}
		
		// Check all names.
		var namesOk = true;
		TipAFriend.visitRows(function(nameInput, emailInput, interesting) {
			if (!interesting) return;
			if (!DefaultText.isFilledIn(nameInput) || !nameInput.value.trim()) {
				namesOk = false;
				nameInput.addClass('invalid');
			}
		});
		if (!namesOk) {
			TipAFriend.reportFailure('Vergeet niet een naam bij het emailadres te vermelden.');
			return false;
		}
		
		// Check all email addresses.
		var emailsOk = true;
		TipAFriend.visitRows(function(nameInput, emailInput, interesting) {
			if (!interesting) return;
			var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
			if (!DefaultText.isFilledIn(emailInput) || !reg.test(emailInput.value)) {
				emailInput.addClass('invalid');
				emailsOk = false;
			}
		});
		if (!emailsOk) {
			TipAFriend.reportFailure('Dit is geen geldig emailadres.');
			return false;
		}
		
		return true;
	},
	
	clearFeedback : function() {
		$('recaptcha_response_field').removeClass('invalid');
		$('myname').removeClass('invalid');
		TipAFriend.visitRows(function(nameInput, emailInput) {
			nameInput.removeClass('invalid');
			emailInput.removeClass('invalid');
		});
		$('tipAFriend-result').removeClass('failure');
		$('tipAFriend-result').removeClass('success');
		$('tipAFriend-result').addClass('hide');
		$('tipAFriend-result').set('text', '');
	},
	
	visitRows: function(f) {
		for (var i = 0; i < TipAFriend.counter; i++) {
			var nameInput  = $('name-input-'  + i);
			var emailInput = $('email-input-' + i);
			var interesting = i == 0 || nameInput.value || emailInput.value; // Skip empty rows.
			f(nameInput, emailInput, interesting);
		}
	},

	togglePopup : function() {
		TipAFriend.clearFeedback();
		
		$('darkOverlay').toggleClass('show');
		$('tip-a-friend-popup').toggleClass('show');
		
		if ($('tip-a-friend-popup').hasClass('show') && !TipAFriend.recaptchaLoaded) {
			Recaptcha.create('6Lci0ggAAAAAAA28mDuy5v73t82krdSIH6ErKrYU', null, { theme: 'custom' });
			TipAFriend.recaptchaLoaded = true;
		}
	},
	
	hidePopup : function() {
		$('darkOverlay').removeClass('show');
		$('tip-a-friend-popup').removeClass('show');
	}
};

var DefaultText = {
	texts : {},
		
	install : function(input, text) {
		DefaultText.texts[input.id] = text;
		if (!input.value) {
			input.value = text;
		}
		input.addEvent('focus', function() {
			if (input.value == text) {
				input.value = '';
			}
			;
		});
		input.addEvent('blur', function() {
			if (!input.value) {
				input.value = text;
			}
		});
	},
	
	isFilledIn : function(input) {
		return input.value != DefaultText.texts[input.id];
	},
	
	reset : function(input) {
		input.value = DefaultText.texts[input.id];
	}
};

window.addEvent("domready", function() {
	if ($('tipAFriendForm')) {
		$('darkOverlay').addEvent('click', function() {
			TipAFriend.togglePopup();
		});
		$('tipAFriendForm').addEvent('submit', TipAFriend.submit);
		document.addEvent('keyup', function(event) {
			if (event.key == 'esc') {
				TipAFriend.hidePopup();
			}
		});

		DefaultText.install($('myname'), 'Jouw naam');
		DefaultText.install($('name-input-0'), 'Naam ontvanger');
		DefaultText.install($('email-input-0'), 'E-mailadres');

		TipAFriend.clearFeedback();
	}
});
