{% extends "whale_base.html" %}

{% block menu %}
    <li class="nav-item">
        <a class="nav-link" href="/plugins/ctfd-whale/admin/settings">🔗 Settings</a>
    </li>
    <li class="nav-item">
        <a class="nav-link active" href="#">Instances</a>
    </li>

    <li class="nav-item nav-link">
        <div class="btn-group" role="group">
            <button type="button" class="btn btn-outline-secondary"
                data-toggle="tooltip" title="Renew Containers" id="containers-renew-button">
                <i class="btn-fa fas fa-sync"></i>
            </button>
            <button type="button" class="btn btn-outline-danger"
                data-toggle="tooltip" title="Stop Containers" id="containers-delete-button">
                <i class="btn-fa fas fa-times"></i>
            </button>
        </div>
    </li>

    <li class="nav-item nav-link">
        <ul class="pagination">
            <li class="page-item{{ ' disabled' if curr_page <= 1 else '' }}">
                <a class="page-link" aria-label="Previous"
                   href="/plugins/ctfd-whale/admin/containers?page={{ curr_page - 1 }}"
                >
                    <span aria-hidden="true">&laquo;</span>
                    <span class="sr-only">Previous</span>
                </a>
            </li>
            {% set range_l = [[curr_page - 1, 1]|max, [pages - 3, 1]|max]|min %}
            {% set range_r = [[curr_page + 2, pages]|min, [4, pages]|min]|max %}
            {% for page in range(range_l, range_r + 1) %}
                <li class="page-item{{ ' active' if curr_page == page }}">
                    <a class="page-link"
                       href="/plugins/ctfd-whale/admin/containers?page={{ page }}"
                    >{{ page }}</a>
                </li>
            {% endfor %}
            <li class="page-item{{ ' disabled' if curr_page >= pages else '' }}">
                <a class="page-link" aria-label="Next"
                   href="/plugins/ctfd-whale/admin/containers?page={{ curr_page + 1 }}"
                >
                    <span aria-hidden="true">&raquo;</span>
                    <span class="sr-only">Next</span>
                </a>
            </li>
        </ul>
    </li>
    
    <li class="nav-item nav-link">
        {% if session['view_mode'] == 'card' %}
            <a href="?mode=list">Switch to list mode</a>
        {% else %}
            <a href="?mode=card">Switch to card mode</a>
        {% endif %}
    </li>
{% endblock %}

{% block panel %}
    {% include "containers/" + session["view_mode"] + ".containers.html" %}
{% endblock %}

{% block scripts %}
    <script defer src="{{ url_for('plugins.ctfd-whale.assets', path='containers.js') }}"></script>
{% endblock %}