$(function() {
	
var submissionCounter = 1;

$('#submit').click(function() {
	// Show loading image
	$("#response").hide();
	$("#loading").show();
	// Send ajax request
	$.ajax({
		url      : SUBMIT_URL,
	  	type     : "post",
	  	data     : $('form#form').serialize(),
		dataType : "json",
		success  : function(result) {
			$("#loading").hide();
			if (result.success) {
				// New comment structure
				var newComment 	=  '<div id="comment_new_' + submissionCounter + '" class="comment" style="display: none;">';
				newComment 		+= '	<div class="name_location">';
				newComment 		+= '		<span class="name">' + result.data.name + '</span>&nbsp;';
				newComment 		+= '		<span class="location">(' + result.data.location + ')</span>';
				newComment 		+= '	</div>';
				newComment 		+= '	<div class="created">' + result.data.created + '</div>';
				newComment 		+= '	<div class="content">' + result.data.content + '</div>';
				newComment 		+= '	<div class="divider"></div>';
				newComment 		+= '</div>';
				
				$('#comments div:first').prepend(newComment);
				$('#comment_new_' + submissionCounter).show("slow");
				submissionCounter++;
				
				$("#response").html("Success!");
				
			} else {
				$("#response").html(result.errors);
			}
			// Show the response
			$("#response").show();
   		},
		error   : function(request, error) {
   			$("#response").html("Failed to connect");
		}
	});
});

});