{% extends "base.html" %}
{% load url from future %}
{% load i18n %}
{% load hk_generic %}


{% block title %}
{% trans 'Available lists' %} - {{ app_name|title }}
{% endblock %}

{% block content %}

<div class="row-fluid all-lists">

<div class="span2 side-menu lists-menu">
    <h2>{% trans 'Lists' %}</h2>
    <ul>
        <li>
            {% if not sort_mode %}
            <span class="active">{% trans 'All' %}</span>
            {% else %}
            <a href="{% url 'root' %}">{% trans 'All' %}</a>
            {% endif %}
        </li>
        <li>
           {% if sort_mode == "active" %}
           <span class="active">{% trans 'Most active' %}</span>
           {% else %}
           <a href="{% url 'root' %}?sort=active">{% trans 'Most active' %}</a>
           {% endif %}
        </li>
        <li>
           {% if sort_mode == "popular" %}
           <span class="active">{% trans 'Most popular' %}</span>
           {% else %}
            <a href="{% url 'root' %}?sort=popular">{% trans 'Most popular' %}</a>
           {% endif %}
        </li>
        <li>
           {% if sort_mode == "creation" %}
           <span class="active">{% trans 'Newest' %}</span>
           {% else %}
            <a href="{% url 'root' %}?sort=creation">{% trans 'Newest' %}</a>
           {% endif %}
        </li>
    </ul>
</div>

<div class="span10 lists">

{% if all_lists|length > 10 %}
<div class="filter-lists">
    <input name="filter" type="text" class="search-query input-medium" id="focusedInput"
           placeholder="{% trans 'Filter list names' %}" />
</div>
{% endif %}

<h1>
    {% trans 'Available lists' %}
    {% if sort_mode == 'active' %}
        <small>({% trans 'most active first' %})</small>
    {% elif sort_mode == 'popular' %}
        <small>({% trans 'most popular first' %})</small>
    {% elif sort_mode == 'creation' %}
        <small>({% trans 'newest first' %})</small>
    {% endif %}
</h1>

{% if all_lists %}

<p class="hide-switches">
    <label><input type="checkbox" value="inactive" checked="checked" /> Hide inactive</label>
    <label><input type="checkbox" value="private" /> Hide private</label>
</p>

<table class="lists table">
    <thead>
        <tr>
            <th>{% trans 'List' %}</th>
            <th>{% trans 'Description' %}</th>
            <th>{% trans 'Activity in the past 30 days' %}</th>
        </tr>
    </thead>
    <tbody>
{% for mlist in all_lists %}
        <tr class="list
           {% if mlist.is_private %}
           private
           {% elif mlist.recent_threads_count == 0 %}
           inactive
           {% endif %}
           ">
            <td>
                {% ifchanged mlist.name|first %}<a name="{{ mlist.name|first }}" />{% endifchanged %}
                {% if mlist.is_new %}
                 <span class="new label">{% trans 'new' %}</span>
                {% endif %}
                 <a href="{% url 'list_overview' mlist_fqdn=mlist.name %}"
                    class="list-name">
                     {% if mlist.display_name %}
                         {{ mlist.display_name }}
                     {% else %}
                         {{ mlist.name|until:"@" }}
                     {% endif %}
                 </a>
                {% if mlist.is_private %}
                <span class="list-tags">private</span>
                {% elif mlist.recent_threads_count == 0 %}
                <span class="list-tags">inactive</span>
                {% endif %}
                <br />
                <span class="list-address">
                    {{ mlist.name }}
                </span>
            </td>
            <td class="list-description">
                {{ mlist.description|default_if_none:"" }}
            </td>
            <td class="activity">
                <div class="chart">
                    <img alt="Loading..." class="ajaxloader" src="{{ STATIC_URL }}hyperkitty/img/ajax-loader.gif" />
                </div>
                <ul class="list-stats">
                    <li><span class="participant">
                        {% if mlist.can_view %}
                        {{ mlist.recent_participants_count|default_if_none:"..." }}
                        {% else %}
                        ...
                        {% endif %}
                        participants</span></li>
                    <li><span class="discussion">
                        {% if mlist.can_view %}
                        {{ mlist.recent_threads_count|default_if_none:"..." }}
                        {% else %}
                        ...
                        {% endif %}
                        discussions</span></li>
                </ul>
            </td>
        </tr>
        <tr class="spacer"><td colspan="3"></td></tr>
{% endfor %}
    </tbody>
</table>
{% else %}
<p>No archived list yet.</p>
{% endif %}

</div> <!-- middle column -->

{% if all_lists|length > 10 %}
<div class="side-menu initials">
    <h2>&#8628;</h2>
    <ul>
        {% for letter in initials %}
        <li><a href="#{{ letter }}">{{ letter|upper }}</a></li>
        {% endfor %}
    </ul>
</div>
{% endif %}

</div>

<img id="logo" alt="HyperKitty" src="{{STATIC_URL}}hyperkitty/img/logo.png" />

{% endblock %}

{% block additionaljs %}

<script>
    $(function() {
        setup_index("{% url 'list_recent_activity' 'PLACEHOLDER@PLACEHOLDER' %}");
    });
</script>

{% endblock %}