{% from 'vote.html' import vote %}
{% set page_number = request.query.page|int or 0 %}

<div class="posts">
    <div class="menu">
        <a href="?sort=hot" class="flex-item {{ 'active_page' if sort == 'hot' }}">
            Hot
        </a>
        <a href="?sort=new" class="flex-item {{ 'active_page' if sort == 'new' }}">
            New
        </a>
    </div>

    {% for post in posts %}
        {% set topics = split_topics (post.topics) %}

        <div class="post">
            {# Print the item position number #}
            <div class="position">
                {{ page_number * settings ('defaults', 'items_per_page') + loop.index }}.
            </div>

            <div class="info">
                <div class="title">
                    <a href="{{ post.link if post.link and post.link|length > 0 else url ('post', hash_id=post.hashId) }}">
                        {{ post.title }}

                        {# Post content preview #}
                        {% if post.text %}
                            <img
                                alt=""
                                title="{{ post.text|md2txt }}"
                                src="{{ url ('static', filename='images/text.svg') }}"
                                class="text_preview" />
                        {% endif %}
                    </a>

                    {# URL hostname #}
                    {% if post.link %}
                        <span class="netloc">
                            {{ post.link|netloc }}
                        </span>
                    {% endif %}
                </div>

                <div class="topics">
                    {% for topic in topics %}
                        <a href="{{ url ('topic', name=topic) }}" class="topic">{{ topic }}</a>
                    {% endfor %}
                </div>

                <div class="about">
                    {{ vote ('post', post, user) }}

                    <a href="{{ url('community', cmty=post['community_name']) }}">c/{{ post['community_name'] }}</a>

                    ·

                    Posted by

                    <a href="{{ url ('user_public', username=post.username) }}">
                        {{ post.username }}
                    </a>

                    <em class="username">
                        <a href="{{ url ('post', hash_id=post.hashId) }}">
                            <time title="{{ post.created|title }}" datetime="{{ post.created }}">
                                {{ post.created|ago }}
                            </time>
                        </a>
                    </em>

                    —

                    <a href="{{ url ('post', hash_id=post.hashId) }}#comments">
                        {% if post.commentsCount > 0 %}
                            {{ post.commentsCount }} comments
                        {% else %}
                            discuss
                        {% endif %}
                    </a>
                </div>
            </div>
        </div>

    {% endfor %}

    <div class="pagination">
        {% if page_number > 0 %}
            <form>
                {% for key, value in request.query.items () %}
                    {% if key != 'page' %}
                        <input type="hidden" name="{{ key }}" value="{{ value }}" />
                    {% endif %}
                {% endfor %}

                <button type="submit"
                        name="page"
                        value="{{ page_number - 1 }}"
                        class="button button_default1">
                        Previous
                </button>

                {% if page_number > 4 %}
                    <button type="submit"
                            name="page"
                            value="{{ page_number - 5 }}"
                            class="button button_default1">
                            -5
                    </button>
                {% endif %}
            </form>
        {% endif %}

        {% if page_number > 0 %}
            <span class="page_number">
                PAGE: {{ page_number }}
            </span>
        {% endif %}

        {% if posts %}
            <form>
                {% for key, value in request.query.items () %}
                    {% if key != 'page' %}
                        <input type="hidden" name="{{ key }}" value="{{ value }}" />
                    {% endif %}
                {% endfor %}

                <button type="submit"
                        name="page"
                        value="{{ page_number + 5 }}"
                        class="button button_default1">
                        +5
                </button>
                <button type="submit"
                        name="page"
                        value="{{ page_number + 1 }}"
                        class="button button_default1">
                        Next
                </button>
            </form>
        {% endif %}
    </div>
</div>