{% extends "board/base.html" %}
{% load post_body %}
{% load i18n %}

{% block title %}
    {% with title=board.url %}
        {{ block.super }}
    {% endwith %}
{% endblock title %}

{% block content %}
{# board header #}
<div class="row">
    <div class="column">&nbsp;</div>
    <div class="column">
        <h1>/{{ board.url }}/ - {{ board.name }}</h1>
    </div>
    <div class="column">&nbsp;</div>
</div>
<hr />
{# post creation form #}
<div class="row">
    <div class="column">&nbsp;</div>
    <div class="column">
        <div class="row">
        <h2>
            <a id="create_post" href="{% url 'board:post_create' url=board.url %}">{% translate "Create a new thread" %}</a>
        </h2>
        </div>
    </div>
    <div class="column">&nbsp;</div>
</div>
<hr />
{# posts #}
{% for post in threads %}
<div class="row post" id="p{{post.id}}">
    {# TODO we need some way to parameterize the last N threads #}
    {% with reply_link=True replies_elided=post.replies.all|length|add:"-3" %}
        {% include "board/post_snippet.html" %}
    {% endwith %}

    {# get the last 3 replies #}
    {% for post in post.replies.all|dictsortreversed:"id"|slice:":3" reversed %}
    <div class="row reply" id="p{{post.id}}">
        {% include "board/post_snippet.html" %}
    </div>
    {% endfor %}
</div>
<hr />
{% endfor %}

{# Page footer #}
<div class="row pagination">
    {% if current_page > 1 %}
        {% with prev_page=current_page|add:"-1" %}
        <a href="{% url 'board:board_detail' board.url prev_page %}">{% translate "Prev" %}</a>
        {% endwith %}
    {% endif %}
    [
        {% for page in pages %}
            {% if current_page == page %}
            <strong>{{page}}</strong>
            {% else %}
            <a href="{% url 'board:board_detail' board.url page %}">{{page}}</a>
            {% endif %}
        {% endfor %}
    ]
    {% if current_page < last_page %}
        {% with next_page=current_page|add:"1" %}
        <a href="{% url 'board:board_detail' board.url next_page %}">{% translate "Next" %}</a>
        {% endwith %}
    {% endif %}
</div>

<script>
const POST_URL = "{% url 'board:post_create' url=board.url %}";
$("#create_post").on("click", (e) => {
    e.preventDefault();
    openPostWindow(POST_URL);
});
</script>
{% endblock content %}