{% extends 'backoffice/base.html' %}
{% load url from future %}
{% load i18n course %}

{% block extr_js %}
<script>
    {% if course_infos %}
    $(document).ready(function() {
        $('#courses-list').DataTable({
            paging:   false,
            searching: false,
            info: false,
        });
    });
    {% endif %}
</script>
{% endblock %}

{% block content %}

    <div>
        <h1>{% trans "Courses" %}</h1>

        <div class="col-xs-4">
            <form method="GET" action=".">
                <div class="input-group">
                    <span class="input-group-addon" id="sizing-addon1">{% trans 'Search' %}</span>
                    <input type="text" class="form-control" placeholder="{% trans 'university or course name' %}" aria-describedby="sizing-addon1" value="{{ pattern|default:'' }}" name="search">
                </div>
            </form>
        </div>
        <div class="col-xs-4">
            <form action="." method="POST">{% csrf_token %}
                <button type="submit" class="btn btn-info">{% trans "Download" %}</button>
            </form>
        </div>

        <div class="col-xs-4">
            {{ course_infos|length }} {% blocktrans %}courses{% endblocktrans %}{% if pattern %} {% trans "for your search pattern" %}{% endif %}
        </div>

        <table class="table table-striped table-hover" id="courses-list">
            <thead>
                <tr>
                    <th>{% trans 'Ident' %}</th>
                    <th>{% trans 'University' %}</th>
                    <th>{% trans 'Title' %}</th>
                    <th>{% trans 'Start' %}</th>
                    <th>{% trans 'End' %}</th>
                    <th>{% trans 'Enrollment start' %}</th>
                    <th>{% trans 'Enrollment end' %}</th>
                    <th>{% trans 'Enrollments' %}</th>
                    <th>{% trans 'Mode' %}</th>
                    <th>{% trans 'See' %}</th>
                </tr>
            </thead>
            <tbody>
                {% for course_info in course_infos %}
                <tr>
                    <td>
                        <a href="{% url 'backoffice:course-detail' course_info.course.id %}">{{ course_info.course.id }}</a>
                        {% if course_info.course.ispublic %}<span class="label label-success">{% trans "Published" %}</span>{% endif %}
                        {% if course_info.course.is_draft %}<span class="label label-primary">{% trans "Draft" %}</span>{% endif %}
                    </td>

                    <td>
                        {% if course_info.fun.university %}{{ course_info.fun.university.name }}{% else %}<span class="no-university">{{ course_info.course.org }}</span>{% endif %}
                    </td>
                    <td>{{ course_info.course.display_name_with_default }}</td>
                    <td data-order="{{ course_info.course.start|date:'ymd' }}">{{ course_info.course.start|date:'d/m/y' }}</td>
                    <td data-order="{{ course_info.course.end|date:'ymd' }}">{{ course_info.course.end|date:'d/m/y' }}</td>
                    <td data-order="{{ course_info.course.enrollment_start|date:'ymd' }}">{{ course_info.course.enrollment_start|date:'d/m/y' }}</td>
                    <td data-order="{{ course_info.course.enrollment_end|date:'ymd' }}">{{ course_info.course.enrollment_end|date:'d/m/y' }}</td>
                    <td>{{ course_info.students_count }}</td>
                    <td>
                        {% if course_info.modes %}<span class="glyphicon glyphicon-euro" aria-hidden="true"></span>{% endif %}
                    </td>
                    <td>
                        <a target="_blank" href="{{ course_info.url }}" title="{% trans 'See course' %}"><span class="glyphicon glyphicon-eye-open" aria-hidden="true"></span></a>
                    </td>
                </tr>
                {% empty %}
                <tr><td colspan="20">
                {% if pattern %}
                    {% trans 'No result for this search pattern' %}
                {% endif %}
                {% endfor %}
                </td></tr>
            </tbody>
        </table>


    </div>


{% endblock %}