{% extends "base.html" %}
{% load static %}
{% load app_extras %}

{% block title %}
  {{ media.title }} - Yamtrack
{% endblock title %}

{% block container %}
  {% include "app/components/media_description.html" with media=media request=request source=media.source media_type=media.media_type media_id=media.media_id title=media.title IMG_NONE=IMG_NONE only %}

  {% for name, related_items in media.related.items %}
    {% if related_items %}
      <h2 class="fs-5">{{ name|no_underscore|title }}</h2>
      <div class="grid mb-4">
        {% for related in related_items %}
          <div class="card">
            <a href="{% if name == "seasons" %}{% url 'season_details' media_id=media.media_id title=media.title|slug season_number=related.season_number %}{% else %}{% url 'media_details' media_type=media.media_type media_id=related.media_id title=related.title|slug %}{% endif %}{% if request.GET.source %}?source={{ request.GET.source }}{% endif %}">
              <img src="{{ related.image }}"
                   class="card-img {% if related.image == IMG_NONE %}image-not-found{% else %}poster{% endif %}"
                   alt="{{ related.title }}" />
            </a>

            <div class="card-img-overlay">
              <div class="card-title">{{ related.title }}</div>
              <div class="card-text d-flex justify-content-center align-items-center">
                {% if name == "seasons" %}
                  {% include "app/components/open_modal.html" with modal_type="track" request=request source=media.source media_type="season" image=related.image media_id=media.media_id season_number=related.season_number title=media.title only %}
                {% else %}
                  {% include "app/components/open_modal.html" with modal_type="track" request=request source=media.source media_type=media.media_type image=media.image media_id=related.media_id title=related.title only %}
                {% endif %}
              </div>
            </div>
          </div>
        {% endfor %}
      </div>
    {% endif %}
  {% endfor %}
{% endblock container %}
