//startLoadingSpinner(document.getElementById('loading'));
function submitNotify(sender, id)
{
	var widget = document.getElementById(id);
	var emailInput = getSubClass(widget, 'email')[0];
	var idInput = getSubClass(widget, 'id')[0];
	
	var filter = /^([a-zA-Z0-9_.-])+@(([a-zA-Z0-9-])+.)+([a-zA-Z0-9]{2,4})+$/;
	if (!filter.test(emailInput.value)) {
		emailInput.focus();
		setNotifyStatus(id, "error");
		
		return false;
	}
	
	var url = sender.getAttribute('action');//we also have a input called action
	var args = 'action=notify_me_send&response=json&email_address=' + escape(emailInput.value) + '&list=' + escape(idInput.value);
	loadURL(url, args, function(response) {
		response = JSON.parse(response);
		if (response.error == null) {
			setNotifyStatus(id, "done");
		} else {
			setNotifyStatus(id, "error");
		}
	});
	setNotifyStatus(id, "loading");
	
	return false;
}

function setNotifyStatus(id, status)
{
	var widget = document.getElementById(id);
	
	var spinner = getSubClass(widget, 'loading')[0];
	var done = getSubClass(widget, 'done')[0];
	var error = getSubClass(widget, 'error')[0];
	var emailInput = getSubClass(widget, 'email')[0];
	
	//hide all the status icons
	stopLoadingSpinner(spinner);
	spinner.style.display = 'none';
	done.style.display = 'none';
	error.style.display = 'none';
	emailInput.disabled = false;
	
	//show only the one we want
	if (status == "loading") {
		spinner.style.display = '';
		startLoadingSpinner(spinner);
		emailInput.disabled = true;
	} else if (status == "done") {
		done.style.display = '';
	} else if (status == "error") {
		error.style.display = '';
		emailInput.focus();
	}
}

function startLoadingSpinner(spinner)
{
	var frame = 0;
	spinner.loadingInterval = setInterval(function() {
		frame++;
		if (frame > 11) {
			frame = 0;
		}
		spinner.style.backgroundPosition = '0px -' + (frame * spinner.offsetHeight) + 'px';
	}, 100);
}

function stopLoadingSpinner(spinner)
{
	window.clearInterval(spinner.loadingInterval);
}

function hasStyleClass(sender, className) {
	return sender.className.indexOf(className) !== -1;
}

function getSubClass(sender, className) {
	if (sender.getElementsByClassName) {
		return sender.getElementsByClassName(className);
	} else {
		var classes = new Array();
		
		var els = sender.getElementsByTagName("*");
		if(els.length < 1 && sender.all)els = sender.all;
		for(var count=0; count < els.length; count++) {
			if(hasStyleClass(els[count], className))
				classes.push(els[count]);
		}
		return classes;
	}
}

function loadURL(url, args, post)
{
	var request;
	if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
		request = new XMLHttpRequest();
	} else {// code for IE6, IE5
		request = new ActiveXObject("Microsoft.XMLHTTP");
	}
	
	if(post != null) {
		request.onreadystatechange = function(){
			if(request.readyState == 4){
				post(request.responseText);
			}
		}
	}
	
	request.open("POST", url, true);
    request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
	request.send(args);
}