$( function () {
	
	$('#subscribeWrapper').css({ 
		'background-color' : '#4a4141',
		'width': '140px',
		'height': '50px',
		'padding': '0px',
		'color': 'white',
		'font-family': 'arial, sans-serif'
	});	
	
	$('<div>')
		.attr( 'id', 'subscribeDiv' )
		.appendTo( '#subscribeWrapper' );
	
	$('<div>')
		.attr( 'id', 'subscribeError' )
		.css({'color': 'fff', 'font-family': 'Verdana, Arial, Helvetica, sans-serif', 'font-size': '10px' })
		.appendTo( '#subscribeWrapper' );
	
	$('#subscribeDiv').css({ 'font-family': 'Verdana, Arial, Helvetica, sans-serif', 'font-size': '10px' });
	
	$('.subscribeClass').css({ 'font-family': 'Verdana, Arial, Helvetica, sans-serif', 'font-size': '10px'});
	$('<input>')
		.attr( { 'id': 'subscriberInput' } )
		.css({ 'border': '1px solid black', 'width' : '170px' })
		.appendTo( '#subscribeDiv' );
	
	$('<button>')
		.attr( { 'id': 'btn_subscribe' } )
		.css({ 'border': '1px solid black' })
		.html('Subscribe')
		.appendTo( '#subscribeDiv' );

	$('#btn_subscribe').click( function () {
		if ( checkEmailAddress( $('#subscriberInput').val() ) == false ) {
			$('#subscribeError').html('<span>Invalid email address given.</span>');
			
		} else {
			$('#subscribeError').html('');
			$('#subscribeDiv').animate({'opacity' : '0'}, 200, function() {
	
				$.post('subscribe.php', { subscriber : $('#subscriberInput').val() }, function(response) {
						
					$('#subscribeDiv').html( response );
					$('#subscribeDiv').animate({'opacity' : '1'}, 500);
				
				});
			});
		}
	});
	
});

function checkEmailAddress( address ) {      
  var emailPattern = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;
  return emailPattern.test(address); 
}