{% extends "./base.html" %}
{% load wagtailcore_tags %}
{% load crispy_forms_tags %}
{% load static %}
{% load django_vite %}
{% load i18n %}

{% block body_class %}template-bloglistpage{% endblock %}

{% block meta %}
  {{ block.super }}
  {% if blog.noindex %}
    <meta name="robots" content="noindex">
  {% endif %}
  <link rel="canonical" href="{{ canonical_url }}">
  {% if use_audio_player %}
    <link rel="preconnect" href="https://cdn.podlove.org" />
  {% endif %}
{% endblock %}

{% block before_main %}
  <header class="cast-hero">
    {% block hero_canvas %}{% endblock hero_canvas %}
    <div class="cast-hero-content">
      <h1 class="blog-title">{% block hero_title %}{{ page.title }}{% endblock hero_title %}</h1>
      <div class="intro lead">{% block hero_tagline %}{{ page.description|richtext }}{% endblock hero_tagline %}</div>
    </div>
  </header>
{% endblock before_main %}

{% block content %}
  <div class="cast-reading">
    {% block feeds %}{% endblock feeds %}

    {% block filters %}
      {% include "./_active_filters.html" with page=page filterset=filterset active_facets=active_facets %}
    {% endblock filters %}

    <noscript>
      <div class="cast-noscript-search">
        <form action="{{ page.url }}" method="get">
          <label for="noscript-search">{% translate "Search posts" %}</label>
          <input type="text" id="noscript-search" name="search"
                 value="{{ request.GET.search|default:'' }}"
                 placeholder="{% translate 'Search posts...' %}">
          <button type="submit">{% translate "Search" %}</button>
        </form>
      </div>
    </noscript>

    <div id="paging-area" hx-history-elt>
      <div class="post-list">
        {% with podlove_load_mode="facade" %}
          {% for post in posts %}
            {% include "./post_body.html" with render_detail=False page=post %}
          {% endfor %}
        {% endwith %}
      </div>

      <footer>
        {% include "./pagination.html" %}
      </footer>
    </div>
  </div>

  {% include "./_search_modal.html" with page=page filterset=filterset %}
{% endblock content %}

{% block javascript %}
  {{ block.super }}
  {% vite_hmr_client app="cast-bootstrap5" %}
  {% vite_asset 'src/search/cast-search-modal.ts' app="cast-bootstrap5" %}
  {% vite_asset 'src/filters/filter-enhancements-bootstrap.ts' app="cast-bootstrap5" %}
  {% vite_asset 'src/content/post-content-enhancements.ts' app="cast-bootstrap5" %}
  {% vite_asset 'src/gallery/image-gallery-bs5.ts' app="cast-bootstrap5" %}
  {% if use_audio_player %}
    {% vite_asset 'src/audio/podlove-player.ts' app="cast-bootstrap5" %}
  {% endif %}
{% endblock javascript %}