{% extends "oneevent/base.html" %}

{% block heading_action %}Messages{% endblock %}
{% block heading_title %}Your messages{% endblock %}

{% block navbar_header_text %}Your messages{% endblock %}

{% block navbar_extra %}
<!--  TODO: Add message navigation here -->
{% endblock %}

{% block content %}

<div class="row">
    <a href="{% url 'message_create' %}" class="btn btn-info"
        data-toggle="tooltip" data-placement="top" title="Send a message to the admin">
        <span class="glyphicon glyphicon-envelope"></span>
        Contact the admin
    </a>
    <p></p>
</div>

<div class="row">
{% for thread_head, thread in threads %}
<div class="panel collapsible-caret
            {% if thread_head.category == 'BUG' %}panel-danger
            {% elif thread_head.category == 'ADMIN' %}panel-warning
            {% elif thread_head.category == 'FEAT' %}panel-success
            {% else %}panel-info{% endif %}">
    <div class="panel-heading collapsible-toggle collapsed"
         data-toggle="collapse" data-target="#collapse_{{thread_head.id}}">
        <span>{{ thread_head.safe_title }}</span>
        <span class="badge pull-right">{{ thread_head.get_category_display }}</span>
    </div>

    <div id="collapse_{{thread_head.id}}" class="panel-collapse collapse table-responsive">
        <div class="container">
            <div class="row" align="center">
                <a href="{% url 'message_reply' thread_id=thread_head.id %}" class="btn btn-default"
                    data-toggle="tooltip" data-placement="top" title="Reply in this thread">
                    <span class="glyphicon glyphicon-share-alt"></span>
                    Reply in this thread
                </a>
            </div>
            </a>
            {% for message in thread %}
            <div class="row">
                <div class="col-xs-12 col-sm-6">From: {{ message.sender.get_full_name }}</div>
                <div class="col-xs-12 col-sm-6 text-right">{{ message.created|date:"D, d N Y H:i e"}}</div>
            </div>
            <div class="row">
                <div class="col-xs-12 col-sm-10 col-sm-offset-1 well">{{ message.safe_text }}</div>
            </div>
            {% endfor %}
        </div>
    </div>
</div>
{% empty %}
<div class="well">You have no message.</div>
{% endfor %}

</div>
{% endblock %}
