{% extends "trainings/trainingactivity_base_detail.html" %}

{% load i18n template_tools %}

{% block main %}
    <div class="clearfix">
        <div class="pull-left">
            <p>{{ object.description }}</p>
        </div>
        <div class="pull-right">
            {% if object.training.is_editable %}
                <a href="{{ object.get_edit_url }}" class="btn btn-primary dialog-box">
                    <i class="fa fa-pencil"></i>
                    {% trans 'Modify parameters' %}
                </a>
            {% endif %}
        </div>
    </div>
    <hr>
    <div class="clearfix">
        <h4>
            {% trans 'Questions' %}
            {% if questions and object.training.is_editable %}
                <a href="{{ object.get_questions_sort_url }}" class="btn btn-primary">
                    <i class="fa fa-sort"></i>
                    {% trans 'Sort questions' %}
                </a>
                <a href="{{ object.get_questions_delete_url }}" class="btn btn-danger">
                    <i class="fa fa-trash"></i>
                    {% trans 'Delete questions' %}
                </a>
            {% endif %}
        </h4>
        {% if object.training.is_editable %}
            <div class="navbar navbar-fixed-bottom activity-action text-center dropup">
                <div class="btn-group">
                    <button type="button" class="btn btn-primary dropdown-toggle navbar-btn" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                        {% trans 'Add a new question' %} <i class="fa fa-caret-up"></i>
                    </button>
                    <ul class="dropdown-menu">
                        {% for question_type in object.questions_type_and_create_url %}
                            <li>
                                <a href="{{ question_type.create_url }}">
                                    <i class="fa fa-plus"></i>
                                    {% trans 'New ' %} {{ question_type.verbose_type }}
                                </a>
                            </li>
                        {% endfor %}
                    </ul>
                </div>
            </div>
        {% endif %}
    </div>
    <hr>
    <ol class="media-list media-list-numbered">
        {% for question in questions %}
            <li class="media">
                {% if question.image %}
                    <div class="media-left">
                        <a href="#">
                            <img class="media-object" src="{{ question.image.url }}" alt="" style="max-width: 100px; max-height: 100px;">
                        </a>
                    </div>
                {% endif %}
                <div class="media-body clearfix">
                    <div class="pull-left">
                        <h4 class="media-heading">
                            {{ question.label }}
                        </h4>
                        <ul class="list-unstyled">
                        {% for choice in question.choices.non_deleted %}
                            <li class="answer">
                                <span class="correct-flag">
                                    {% if choice.is_valid %}
                                        <i class="fa fa-check"></i>
                                    {% endif %}
                                </span>
                                {{ choice.label }}
                            </li>
                        {% endfor %}
                        </ul>
                    </div>
                    {% if object.training.is_editable %}
                        <div class="pull-right">
                            <a href="{{ question.get_edit_url }}" class="btn btn-primary">
                                {% trans 'Edit' %}
                            </a>
                        </div>
                    {% endif %}
                </div>
            </li>
        {% endfor %}
    </ol>
{% endblock %}