$(document).ready(function(){
	var inputMessage = $("#message");
	var loading = $("#loading");
	var messageList = $(".messages > div > ul");
	
	function updateShoutbox(){
		messageList.hide();
		loading.fadeIn();
		$.ajax({
			type: "POST", url: "shoutbox.php", data: "action=update",
			complete: function(data){
				loading.fadeOut();
				messageList.html(data.responseText);
				messageList.fadeIn(2000);
			}
		});
	}
	
	//check if all fields are filled
	function checkForm(){
		if(inputMessage.attr("value"))
			return true;
		else
			return false;
	}
	
	updateShoutbox();
	
	$("#form").submit(function(){
		if(checkForm()){
			var message = inputMessage.attr("value");
			$("#send").attr({ disabled:true, value:"Sending..." });
			$("#send").blur();
			$.ajax({
				type: "POST", url: "shoutbox.php", data: "action=insert" + "&message=" + message,
				complete: function(data){
					messageList.html(data.responseText);
					updateShoutbox();
					$("#send").attr({ disabled:false, value:"Shout it!" });
				}
			 });
		}
		else alert("Please fill all fields!");
		return false;
	});	
});

function updateShoutbox(){
		var inputMessage = $("#message");
        	var loading = $("#loading");
		var messageList = $(".messages > div > ul");
                $.ajax({
                        type: "POST", url: "shoutbox.php", data: "action=update",
                        complete: function(data){
                                messageList.html(data.responseText);
                        }
                });
        }
window.setInterval("updateShoutbox()", 30000);