var fnameBubble = '<p id="fname_bubble" class="bubble">Please provide your first name.</p>';
var missingEmailBubble = '<p id="missing_email_bubble" class="bubble">Please provide your email address.</p>';
var countryBubble = '<p id="country_bubble" class="bubble">Please select your country.</p>';
var invalidEmailBubble = '<p id="invalid_email_bubble" class="bubble">Oops, that isn&rsquo;t a valid email address.  Please try again.</p>';
var duplicateEmailBubble = '<p id="duplicate_email_bubble" class="bubble">Huh, that email address is already in use (perhaps by you?).  Please sign up with a different address (or go to our <a href="/login">login page</a> to recover your password).</p>';

var formSetup = function() {
	$('.list_su select[name="country"]').each(function() {
		var selectedCountry = $(this).metadata().cc;
		if (selectedCountry.length) {
			$(this).children('option[value="'+selectedCountry+'"]').attr('selected', 'selected');
		}
	});
	$('.mainbox_middle .connecting .ss_button').attr({src: '/images/buttons/subscribe_114x40.png', width: '114', height: '40'});
	$('.mainbox_middle .jod .ss_button').attr({src: '/images/buttons/sign-up_104x40.png', width: '104', height: '40'});
	$('.mainbox_middle .sub_button').attr({src: '/images/buttons/submit_104x40.png', width: '104', height: '40'});
	$('.mainbox_middle_blue .connecting .ss_button').attr({src: '/images/buttons/subscribe_119x42.png', width: '119', height: '42'});
	$('.mainbox_middle_blue .jod .ss_button').attr({src: '/images/buttons/sign-up_109x42.png', width: '109', height: '42'});
	$('.mainbox_middle_blue .sub_button').attr({src: '/images/buttons/submit_109x42.png', width: '109', height: '42'});
	$('.ccm-input-captcha').focus();
}


$(document).ready(function() {
	formSetup();
	
	$('.list_su_form').live('submit', function(e) {
		eval('var block = {' + $(this).attr('value') + '}');
		$('#list_su_container_' + block.instance + ' .ss_button').attr('disabled', 'disabled');
		$('#list_su_content_' + block.instance).fadeTo("slow", .4);
		
		var loaderTop = Math.round($('#list_su_container_' + block.instance).outerHeight()/2) - 33;
		var loaderLeft = Math.round($('#list_su_container_' + block.instance).outerWidth()/2) - 33;
		
		if ($(this).is('.mainbox_middle .list_su_form')) {
			$('<img class="loader" src="/images/loaders/blue-loader-66.gif" width="66" height="66" />')
				.appendTo($('#list_su_container_' + block.instance))
				.css({top: loaderTop + 'px', left: loaderLeft + 'px'});
		} else {
			$('<img class="loader" src="/images/loaders/blue-loader-66.gif" width="66" height="66" />')
				.appendTo($('#list_su_container_' + block.instance))
				.css({top: loaderTop + 'px', left: loaderLeft + 'px'});
		}
		
		var form_data = $(this).serializeArray();
		$('#list_su_container_' + block.instance).load(block.url + ' #list_su_content_' + block.instance, form_data, function() {
			$('#list_su_content_' + block.instance).hide().fadeIn("slow");
			formSetup();
		});
		
		e.preventDefault();
	});
	/*
	$('#fname').blur(function() {
		if (!$(this).val()) {
			$(fnameBubble).appendTo('body');
			var bubbleTop = $(this).offset().top + Math.round(($(this).outerHeight() - $('#fname_bubble').outerHeight())/2);
			var bubbleLeft = Math.round(($(window).width() - $('#central').width())/2) + $(this).position().left + $(this).outerWidth() - 8;
			$('#fname_bubble')
				.css({
					top: bubbleTop + 'px',
					left: bubbleLeft + 'px'})
				.show('scale', {easing: 'easeOutBack'}, 'medium');
			$(this).effect('highlight', {color: '#FFF68B'}, 'fast').effect('highlight', {color: '#FFF68B'}, 'slow');
			$('#ss_button').attr({"disabled": "disabled", "src": "/images/buttons/pink_subscribe_32_disabled.png"}).css("cursor", "progress");
		} else {
			$('#fname_bubble').hide('explode', {pieces: 30}, 'fast');
			$('#ss_button').removeAttr("disabled").attr({"src": "/images/buttons/pink_subscribe_32.png"}).css("cursor", "pointer");
		}	
	});
	
	$('#email').blur(function() {
		var emailAddress = $(this).val();
		var rxEmail = /^[\w\.\-]+@([\w\-]+\.)+[a-zA-Z]+$/;
		if (!emailAddress) {
			$(missingEmailBubble).appendTo('body');
			var bubbleTop = $(this).offset().top + Math.round(($(this).outerHeight() - $('#missing_email_bubble').outerHeight())/2);
			var bubbleLeft = ($(window).width() - $('#central').width())/2 + $(this).position().left + $(this).outerWidth() - 8;
			$('#missing_email_bubble')
				.css({
					top: bubbleTop + 'px',
					left: bubbleLeft + 'px'})
				.show('scale', {easing: 'easeOutBack'}, 'medium');
			$(this).effect('highlight', {color: '#FFF68B'}, 'fast').effect('highlight', {color: '#FFF68B'}, 'slow');
			$('#ss_button').attr({"disabled": "disabled", "src": "/images/buttons/pink_subscribe_32_disabled.png"}).css("cursor", "progress");
		} else if (!rxEmail.test(emailAddress)) {
			$('#missing_email_bubble').hide();
			var bubbleTop = $(this).position().top + $('#central').position().top + Math.round(($(this).height() - $('#invalid_email_bubble').height())/2);
			var bubbleLeft = ($(window).width() - $('#central').width())/2 + $(this).position().left + $(this).outerWidth() - 8;
			$('#invalid_email_bubble').css({
				"top": bubbleTop + 'px',
				"left": bubbleLeft + 'px'
			}).show('scale', {easing: 'easeOutBack'}, 'medium');
			$(this).effect('highlight', {color: '#FFF68B'}, 'fast').effect('highlight', {color: '#FFF68B'}, 'slow');
			$('#ss_button').attr({"disabled": "disabled", "src": "/images/buttons/pink_subscribe_32_disabled.png"}).css("cursor", "progress");
		} else {
			$.post('/index.php/tools/check_email.php', {email: emailAddress}, function(data) {
				eval("uniqEmail = " + data);
				if (!uniqEmail) {
					
				}
			});
			
			$('#email_bubble').hide('explode', {pieces: 30}, 'fast');
			$('#invalid_email_bubble').hide('explode', {pieces: 30}, 'fast');
			$('#ss_button').removeAttr("disabled").attr({"src": "/images/buttons/pink_subscribe_32.png"}).css("cursor", "pointer");
		}				
	});
	
	$('#country').blur(function() {
		var bubbleTop = $(this).position().top + $('#central').position().top + Math.round(($(this).height() - $('#country_bubble').height())/2);
		var bubbleLeft = ($(window).width() - $('#central').width())/2 + $(this).position().left + $(this).outerWidth() - 8;
		$('#country_bubble').css({
			"top": bubbleTop + 'px',
			"left": bubbleLeft + 'px'
		}).show('scale', {easing: 'easeOutBack'}, 'medium');
	});
	*/
});