{% extends "base.html" %}

{% block title %} Results {% endblock %}
{% block page_content %}
    {% if error %}
        <h1>Please enter a keyword.</h1>
    {% else %}
        <div class="h1">Found {{ data['num_match'] }} board{% if data['num_match'] > 1 %}s{% endif %}.</div>
        <div class="float-end">
            Sort by:
            <a href="javascript:setParam('order', 'popular')">Popular</a>
            <a href="javascript:setParam('order', 'hot')">Hot</a>
        </div>
        <br>
        <hr>

        {% for board in data['boards'] %}
            <div class="h1"><a href="/board/{{ board.Bid }}" class="text-decoration-none">{{ board.name }}</a></div>
            <div class="text-muted">Post count:{{ board.post_count }}</div>
            <hr>

        {% endfor %}
    {% endif %}

    {# Pagination #}
    <nav {% if data['num_page'] <= 1 %}style="display: none"{% endif %}>
        <ul class="pagination justify-content-center">
            <li class="page-item {% if data['page'] == 1 %}disabled{% endif %}">
                <a class="page-link" href="javascript:setParam('page',{{ data['page'] - 1 }})"
                   tabindex="-1">Previous</a>
            </li>

            {% for i in range(1, 1 + data['num_page']) %}
                <li class="page-item{% if i == data['page'] %} active {% endif %}">
                    <a class="page-link" href="javascript:setParam('page',{{ i }})">{{ i }}</a>
                </li>
            {% endfor %}

            <li class="page-item {% if data['page'] == data['num_page'] %}disabled{% endif %}">
                <a class="page-link" href="javascript:setParam('page',{{ data['page'] + 1 }})">Next</a>
            </li>
        </ul>
    </nav>

{% endblock %}
