{% extends 'modal_base.html' %}
{% load i18n %}

{% block title %}
	{% trans 'Deletion confirmation' %}
{% endblock %}

{% block body %}
    <form action="{{ workshopstepquestionanswer.get_delete_url }}"
          method="post"
          id="workshop-question-answer-delete-form">{% csrf_token %}
        <div class="modal-body">
            <p>
                {% blocktrans trimmed with question_label=workshopstepquestionanswer.label %}
                    Are you sure you want to delete the answer "{{ question_label }}"?
                {% endblocktrans %}
            </p>
        </div>
        <div class="modal-footer clearfix">
            <button type="button" class="btn btn-default pull-left" data-dismiss="modal">{% trans 'Cancel' %}</button>
            <input class="btn btn-danger pull-right" type="submit" value="{% trans 'Confirm' %}" />
        </div>
    </form>
    <script type="text/javascript">
        $(document).ready(function(){
            var afterSuccess = function() {
                var $answer =  $('#answer-{{ workshopstepquestionanswer.pk }}');

                // Dismiss the modal
                $('.modal').modal('hide');

                // Remove the element containing the soft-deleted answer from the DOM
                // with a quick animation to let the user know the operation was a success :p
                $answer.animate(
                    {
                        opacity: '0',
                        height: '0'
                    },
                    1000,
                    function() {
                        $answer.remove();
                    }
                );
            };
            $('#workshop-question-answer-delete-form').autoAjaxForm(afterSuccess);
        });
    </script>
{% endblock %}