$(document).ready(function() {
                    previewed = false;

                    commentBusy = false;
                  });

function ajaxComment(args) {
  // TODO: if the media variable ends in a forward slash, remove it.
  var media = args.media;

  $('div.comment-error').remove();
  $('#comment_form ul.errorlist').each(function() {
                                         this.parentNode.removeChild(this);
                                       });

  if (commentBusy) {
    $('#comment_form form').before('\
                                   <div class="comment-error">\
                                   Your comment is currently in the process of posting.\
                                   </div>\
                                   ');
    $('div.comment-error').fadeOut(2000);

    return false;
  }

  comment = $('#comment_form form').serialize();

  // Add a wait animation
  $('input.submit-post').after('\
                               <img src="' + media + '/img/ajax-loader.gif" alt="Please wait..."\
                               class="ajax-loader" />\
                               ');

  // Indicate that the comment is being posted
  $('p.submit').after('\
                      <div class="comment-waiting" style="display: none;">\
                      One moment while the comment is posted. . .\
                      </div>\
                      ');
  $('div.comment-waiting').fadeIn(1000);

  commentBusy = true;

  url = $('#comment_form form').attr('action');

  // Use AJAX to post the comment.
  $.ajax({
           type: 'POST',
           url: url,
           data: comment,
           success: function(data) {
             commentBusy = false;

             removeWaitAnimation()

             if (data.success == true) {
               commentSuccess(data);
             } else {
               commentFailure(data);
             }
           },
           error: function(data) {
             commentBusy = false;

             removeWaitAnimation()

             $('#comment_form form').unbind('submit');
             $('#comment_form form').submit();
           },
           dataType: 'json'
         });

  return false;
}

function commentSuccess(data) {
  email = $('#id_email').val();
  comment = $('#id_comment').val();
  name = $('#id_name').val();
  url = $('#id_url').val();

  $('#comment_form form textarea')[0].value = "";

  $('#id_comment').val('');

  $('#comments').append(data['html']);
  $('.comment:last').fadeIn(2500);

}

function commentFailure(data) {
  $('#comment_form ul.errorlist').each(function() {
                                         this.parentNode.removeChild(this);
                                       });

  for (var error in data.errors) {
    $('#id_' + error).parent().before(data.errors[error])
  }
}

function removeWaitAnimation() {
  // Remove the wait animation and message
  $('.ajax-loader').remove();
  $('div.comment-waiting').stop().remove();
}

$(document).ready(function() {
                    domain = 'http://' + document.domain;
                    if (window.location.port) {
                      domain = domain + ':' + window.location.port;
                    }

                    media = domain + '/media';
                    $('#comment_form form').submit(function() {
                                                     ajaxComment({'media': media});
                                                     return false;
                                                   });
                  });