;$(document).ready(function () {

    $('div#comment-form form').submit(function () {
        $('div.comment-error').remove();
        name = $('#id_name').val();
        email = $('#id_email').val();
        url = $('#id_url').val();
        comment = $('#id_comment').val();
        content_type = $('#id_content_type').val();
        object_pk = $('#id_object_pk').val();
        timestamp = $('#id_timestamp').val();
        security_hash = $('#id_security_hash').val();
        honeypot = $('#id_honeypot').val();

        $.post('/ajax/comment/post/', {
            name: name,
            email: email,
            url: url,
            comment: comment,
            content_type: content_type,
            object_pk: object_pk,
            timestamp: timestamp,
            security_hash: security_hash,
            honeypot: honeypot
        }, function (data) {
            if (data.status === "success") {
                // If the post was a success, disable the Post button to
                // prevent accidental duplication.
                $('input.submit-post').attr('disabled', 'disabled');

                // If this is the first comment, I add the "## comment(s) so far"
                // banner that I use to introduce the comments section.
                if ($('div#comments').children().length === 0) {
                    $('div#comments').prepend(
                        '<h2 class="comment-hd">1 comment so far:</h2>'
                    );
                }

                // Here I build the HTML to use for the comment.  I set the
                // style to "display:none" so that I can fade it in with an
                // animation.
                comment_html = '<div class="comment new" style="display: none;">' +
                    '<h6>Ravnokar povedano - ' + 
                    '<a href="' + url + '">' + name + '</a>' +
                    '</h6><p>' + comment + '</p></div>';

                // Then I add the comment at the bottom of the comments section
                // and fade it in.
                $('#comments').append(comment_html);

                // I hide the comment form to prevent duplication, and
                // replace it with a success message for the user.
                $('#comment-form').hide();
                comment_confirm = '<p class="comment-thanks" style="display: none;">' +
                    'Komentar objavljen. Hvala za sodelovanje!</p>';
                $('#comments').append(comment_confirm);
                
                $('div.comment:last').show('slow');
                $('.comment-thanks').show('slow');

            } else {
                // If there were errors with the form, I add them to the
                // page above my comment form with a "comment-error" div.
                $('div#comment-form').before('<div class="comment-error">' +
                    data.error + '</div>');
            }

        }, "json");
        return false;
    });
});

