{% extends "fellchensammlung/base.html" %}
{% load i18n %}
{% load custom_tags %}

{% block title %}<title>{% translate "Tierschutzorganisationen" %}</title>{% endblock %}

{% block og_title %}
    <meta property="og:title" content="{% translate "Tierschutzorganisationen" %} - Notfellchen"/>
{% endblock %}
{% block description %}
    <meta name="description" content="{% translate 'Finde Tierschutzorganisationen in deiner Gegend.' %}">
{% endblock %}
{% block og_description %}
    <meta name="og:description" content="{% translate 'Finde Tierschutzorganisationen in deiner Gegend.' %}">
{% endblock %}
{% block canonical_url %}{% host %}{% url 'rescue-organizations' %}{% endblock %}

{% block content %}
    <div class="columns block">
        <div class=" column {% if show_search %}is-two-thirds {% endif %}">
            <div style="height: 70vh">
                {% include "fellchensammlung/partials/partial-map.html" %}
            </div>
        </div>
        {% if show_search %}
            <div class="column is-one-third">
                <form method="GET" autocomplete="off">
                    <input type="hidden" name="longitude" maxlength="200" id="longitude">
                    <input type="hidden" name="latitude" maxlength="200" id="latitude">
                    <!--- https://docs.djangoproject.com/en/5.2/topics/forms/#reusable-form-templates -->
                    {{ search_form }}
                    <button class="button is-primary is-fullwidth" type="submit" value="search" name="action">
                        <i class="fas fa-search  fa-fw"></i> {% trans 'Suchen' %}
                    </button>
                </form>
            </div>
        {% endif %}
    </div>

    <div class="block">
        {% with rescue_organizations=rescue_organizations_to_list %}
            {% include "fellchensammlung/lists/list-animal-shelters.html" %}
        {% endwith %}
    </div>
    <nav class="pagination" role="navigation" aria-label="{% trans 'Paginierung' %}">
        {% if rescue_organizations_to_list.has_previous %}
            <a class="pagination-previous"
               href="?page={% url_replace request 'page' rescue_organizations_to_list.previous_page_number %}">{% trans 'Vorherige' %}</a>
        {% endif %}
        {% if rescue_organizations_to_list.has_next %}
            <a class="pagination-next"
               href="?{% url_replace request 'page' rescue_organizations_to_list.next_page_number %}">{% trans 'Nächste' %}</a>
        {% endif %}
        <ul class="pagination-list">
            {% for page in elided_page_range %}
                {% if page != "…" %}
                    <li>
                        <a href="?{% url_replace request 'page' page %}"
                           class="pagination-link {% if page == rescue_organizations_to_list.number %} is-current{% endif %}"
                           aria-label="{% blocktranslate %}Gehe zu Seite {{ page }}.{% endblocktranslate %}">
                            {{ page }}
                        </a>
                    </li>
                {% else %}
                    <li>
                        <span aria-hidden="true" class="pagination-ellipsis">&hellip;</span>
                    </li>
                {% endif %}
            {% endfor %}
        </ul>
    </nav>
{% endblock %}
