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

{% load i18n %}
{% load hk_generic %}
{% load static %}


{% block head_title %}
{{ subject }} - {{ mlist.display_name|default:mlist.name }} - {{ block.super }}
{% endblock %}

{% block content %}

<div class="row view-thread">

{% include 'hyperkitty/fragments/thread_left_nav.html' with pagename='thread' %}

    <div class="col-12 col-md-10">

        <!-- thread header: navigation (older/newer), thread title -->
        <div class="thread-header">
          <div class="row">
            {% with prev_thread=thread.prev_thread next_thread=thread.next_thread %}
            <div class="col-sm-2">
                {% if next_thread %}
                <a id="next-thread" class="btn btn-secondary btn-sm {% if not next_thread %}disabled{% endif %}"
                        {% if next_thread %}title="{{ next_thread.subject|strip_subject:mlist|escape }}"{% endif %}
                        href="{% url 'hk_thread' threadid=next_thread.thread_id mlist_fqdn=mlist.name %}">
                    <span class="fa fa-chevron-left"></span>
                    <span class="d-none d-md-inline">{% trans "newer" %}</span>
                </a>
               {% endif %}
            </div>
            <div class="col-sm-8">
                <h3>{{ subject }}</h3>
            </div>
            <div class="col-sm-2 right">
                <a id="prev-thread" class="btn btn-secondary btn-sm {% if not prev_thread %}disabled{% endif %}"
                    {% if prev_thread %}
                    title="{{ prev_thread.subject|strip_subject:mlist|escape }}"
                    href="{% url 'hk_thread' threadid=prev_thread.thread_id mlist_fqdn=mlist.name %}"
                    {% endif %}>
                    <span class="fa fa-chevron-right"></span>
                    <span class="d-none d-md-inline">{% trans "older" %}</span>
                </a>
            </div>
          </div>
          <div class="thread-titles">
            <div class="row">
                <div class="d-none d-md-block col-md-6">
                {% if next_thread %}
                    <a href="{% url 'hk_thread' threadid=next_thread.thread_id mlist_fqdn=mlist.name %}"
                       title="{{ next_thread.subject|strip_subject:mlist|escape }}"
                       >{{ next_thread.subject|strip_subject:mlist|truncatesmart:"35" }}</a>
                {% endif %}
                </div>
                <div class="right d-none d-md-block col-md-6">
                {% if prev_thread %}
                    <a href="{% url 'hk_thread' threadid=prev_thread.thread_id mlist_fqdn=mlist.name %}"
                       title="{{ prev_thread.subject|strip_subject:mlist|escape }}"
                       >{{ prev_thread.subject|strip_subject:mlist|truncatesmart:"35" }}</a>
                {% endif %}
                </div>
            </div>
            {% endwith %}
            </div>
        </div> <!-- /thread-header -->

        <!-- nav tabs, for smaller screens -->
        <ul class="nav nav-tabs d-md-none">
            <li class="nav-item">
                <a href="#home" class="nav-link active">{% trans "First Post" %}</a>
            </li>
            <li class="nav-item">
                <a href="#replies" class="nav-link">{% trans "Replies" %}</a>
            </li>
            <li class="nav-item">
                <a href="#stats" class="nav-link">{% trans "Stats" %}</a>
            </li>
            <li class="dropdown nav-item">
                {% include 'hyperkitty/fragments/month_list.html' with show_dropdown=True %}
            </li>
        </ul> <!-- /navtab -->

        <div class="row">
            <div class="col-sm-12 col-md-9">
                <!-- main section, the email thread -->
                <div id="thread-content">

                    <!-- Start first email -->
                    {% include 'hyperkitty/messages/message.html' with email=starting_email unfolded='True' %}
                    <!-- End first email -->

                    <p class="sort-mode">
                        {% if sort_mode == "date" %}
                        <a href="{% url 'hk_thread' threadid=thread.thread_id mlist_fqdn=mlist.name %}?sort=thread"
                            >{% trans "Show replies by thread" %}</a>
                        {% else %}
                        <a href="{% url 'hk_thread' threadid=thread.thread_id mlist_fqdn=mlist.name %}?sort=date"
                            >{% trans "Show replies by date" %}</a>
                        {% endif %}
                    </p>

                    <div class="anchor-link">
                        <a id="replies"></a>
                    </div>
                    <div class="replies">
                        {% if is_bot %}
                            {% include 'hyperkitty/ajax/replies.html' %}
                        {% else %}
                            <img alt="{% trans 'Loading...' %}" class="ajaxloader" src="{% static 'hyperkitty/img/ajax-loader.gif' %}" />
                        {% endif %}
                    </div>

                </div>
            </div>

            <div class="col-12 col-md-3">
                <div class="anchor-link">
                    <a id="stats"></a>
                </div>
                {% include 'hyperkitty/threads/right_col.html' %}
            </div>

        </div>

    </div>

</div>

<!-- end of content -->
{% endblock %}

{% block additionaljs %}

<script type="text/javascript">
    $(document).ready(function() {
        //enable tooltips for thread buttons
        $("btn#next-thread").tooltip();
        $("btn#prev-thread").tooltip();

        setup_category();
        setup_tags();
        setup_favorites();
        // Hide quotes by default in the thread view
        fold_quotes("div.container");
        // Load the replies
        update_thread_replies("{% url 'hk_thread_replies' threadid=thread.thread_id mlist_fqdn=mlist.name %}?sort={{sort_mode}}&last_view={{last_view|date:'U'}}");
        setup_unreadnavbar("#unreadnavbar");
        setup_thread_keyboard_shortcuts();
    });
</script>

{% endblock %}
