{% extends request.is_ajax|yesno:'nullcont.htm,ext.html' %}
{% load i18n %}
{% load telephone_filters %}
{% block content %}

    <div class="table-responsive">
        <table class="table table-striped table-bordered">
            <thead>
            <tr>
                <th>{% trans 'Play' %}</th>
                <th>{% trans 'calldate' %}</th>
                <th>{% trans 'src' %}</th>
                <th>{% trans 'duration' %}</th>
                <th>{% trans 'start' %}</th>
                <th>{% trans 'answer' %}</th>
                <th>{% trans 'end' %}</th>
                <th>{% trans 'disposition' %}</th>
            </tr>
            </thead>
            <tbody>
            {% for vmail in vmessages %}
                <tr>
                    <td class="btn-group btn-group-xs">
                        <button class="btn btn-default player-btn disabled">
                            <span class="glyphicon glyphicon-play"></span>
                            <audio preload="metadata" src="{{ vmail.path_to_media }}/{{ vmail.calldate|date:"YmdHi" }}-{{ vmail.src }}-{{ vmail.dst }}.wav"></audio>
                        </button>
                        <a href="{{ vmail.path_to_media }}/{{ vmail.calldate|date:"YmdHi" }}-{{ vmail.src }}-{{ vmail.dst }}.wav" class="btn btn-default disabled" target="_blank">
                            <span class="glyphicon glyphicon-download-alt"></span>
                        </a>
                    </td>
                    <td>{{ vmail.calldate|date:'d E Y, H:i:s' }}</td>
                    <td>{{ vmail.src|abon_if_telephone|safe }}</td>
                    <td>{{ vmail.duration }}</td>
                    <td>{{ vmail.start|date:'d E Y, H:i:s' }}</td>
                    <td>{{ vmail.answer|date:'d E Y, H:i:s' }}</td>
                    <td>{{ vmail.end|date:'d E Y, H:i:s' }}</td>
                    <td>{{ vmail.locate_disposition }}</td>
                </tr>
            {% empty %}
                <tr>
                    <td colspan="8">{% trans 'Calls was not found' %}</td>
                </tr>
            {% endfor %}
            </tbody>
        </table>
    </div>

    {% include 'toolbar_page.html' with pag=vmessages %}

{% endblock %}