$(function () {
    var $comment_form = $('#comment_form');

    $('.reply_comment').on('click', function (e) {
        e.preventDefault();

        $('#parent_comment_id').remove();
        $('#delete_parent').remove();

        var $parent = $('<input type="hidden" name="parent" id="parent_comment_id" value="' + $(this).data('parent') + '">'),
            $delete_parent = $('<a href="#" id="delete_parent" class="delete_parent"> &times; <i>' + $(this).data('user') + '</i></a>');
        $comment_form.prepend($parent);
        $comment_form.find('button').after($delete_parent);

        $('html, body').animate({
            scrollTop: $comment_form.offset().top - 20
        });

        $comment_form.find('textarea').trigger('focus');
    });

    $comment_form.on('click', '#delete_parent', function (e) {
        e.preventDefault();
        $('#parent_comment_id').remove();
        $(this).remove();
    });

    $comment_form.on('submit', function (e) {
        e.preventDefault();

        $comment_form.find('.error').removeClass('error');

        $.ajax({
            url: $comment_form.attr('action'),
            type: $comment_form.attr('method'),
            data: $comment_form.serializeArray(),
            beforeSend: function () {
                $comment_form.find('button').attr('disabled', true);
            },
            success: function (response) {
                console.log(response);

                if (response.success) {
                    $comment_form.find('[name="parent"]').remove();
                    $comment_form[0].reset();
                    window.location.reload();
                }

                if (response.errors) {
                    $.each(response.errors, function (i, err) {
                        $comment_form.find('#id_' + i).addClass('error');
                    });
                }
            },
            complete: function () {
                $comment_form.find('button').attr('disabled', false);
            }
        });
    });
});