{% load markup %}

{% if request.path == '/' %}

<div class="py-3">
  <h1 class="text-body-emphasis">Aktuelles</h1>
  <p class="fs-5 col-md-8">
    Hier finden Sie aktuelle Artikel und Links zu Blogs zu den Fortschritten der Stadtverwaltung Karlsruhe.
  </p>
</div>

<div id="cardCarousel" class="carousel slide" data-bs-ride="carousel">
  <div class="carousel-inner">
    <div class="carousel-item active">
      <div class="row">
        {% for update in updates|slice:":3" %}
        <div class="col">
          <div class="card mb-4 rounded-3 shadow-sm">
            <a href="{{ update.get_absolute_url }}" class="text-body text-decoration-none">
            <div class="card-header p-3 tight-margin text-start">
              {% if show_context %}
                <span class="badge text-bg-blue-100 rounded-pill float-md-right mb-2 mb-md-0">
                  {{ update.plan.get_section }}
                </span>
              {% endif %}
              
              {% if show_context %}
                <h3 class="h5 mt-0">{{ update.plan }}</h3>
              {% else %}
                <h3 class="h4 mt-0">{{ update.title }}</h3>
              {% endif %}

              <div class="small">
                <time datetime="{{ update.timestamp|date:'c' }}">{{ update.timestamp|date:"DATE_FORMAT" }}</time>
        
                {% if update.user or update.organization %}
                <span>
                  von {{ update.user.get_full_name }}{% if update.user and update.organization %},{% endif %}
                  {{ update.organization.name }}
                </span>
                {% endif %}
              </div>

            </div>
            </a>
            <div class="card-body tight-margin text-start">

              {% if update.content or show_context %}
              <div class="tight-margin">
                {% if show_context %}
                  <h4 class="h5">{{ update.title }}</h4>
                {% endif %}
            
                {% with update.content|markdown as content %}
                  {% if show_context %}
                    {{ content|truncatewords_html:50 }}
                  {% else %}
                    {{ content }}
                  {% endif %}
                {% endwith %}
              </div>
              {% endif %}
            
              {% if update.url or update.foirequest or show_context %}
              <div class="{% if update.content %}box-card-links{% else %}d-flex mt-auto{% endif %}">
                {% if show_context %}
                  <a href="{{ update.get_absolute_url }}" class="action-link">→ zum Vorhaben</a>
                {% else %}
                  {% if update.url %}
                    <a href="{{ update.url }}" class="action-link me-3" target="_blank" rel="noopener">→ mehr auf {{ update.get_url_domain }} lesen…</a>
                  {% endif %}
            
                  {% if update.foirequest %}
                    <a href="{{ update.foirequest.get_absolute_url }}" class="action-link">→ zur Anfrage</a>
                  {% endif %}
                {% endif %}
              </div>
              {% endif %}

            </div>
          </div>
        </div>
        {% endfor %}
      </div>
    </div>
    <div class="carousel-item">
      <div class="row">
        {% for update in updates|slice:"3:6" %}
        <div class="col">
          <div class="card mb-4 rounded-3 shadow-sm">
            <a href="{{ update.get_absolute_url }}" class="text-body text-decoration-none">
            <div class="card-header p-3 tight-margin text-start">
              {% if show_context %}
                <span class="badge text-bg-blue-100 rounded-pill float-md-right mb-2 mb-md-0">
                  {{ update.plan.get_section }}
                </span>
              {% endif %}
              
              {% if show_context %}
                <h3 class="h5 mt-0">{{ update.plan }}</h3>
              {% else %}
                <h3 class="h4 mt-0">{{ update.title }}</h3>
              {% endif %}

              <div class="small">
                <time datetime="{{ update.timestamp|date:'c' }}">{{ update.timestamp|date:"DATE_FORMAT" }}</time>
        
                {% if update.user or update.organization %}
                <span>
                  von {{ update.user.get_full_name }}{% if update.user and update.organization %},{% endif %}
                  {{ update.organization.name }}
                </span>
                {% endif %}
              </div>

            </div>
            </a>
            <div class="card-body tight-margin text-start">

              {% if update.content or show_context %}
              <div class="p-3 p-md-4 tight-margin">
                {% if show_context %}
                  <h4 class="h5">{{ update.title }}</h4>
                {% endif %}
            
                {% with update.content|markdown as content %}
                  {% if show_context %}
                    {{ content|truncatewords_html:50 }}
                  {% else %}
                    {{ content }}
                  {% endif %}
                {% endwith %}
              </div>
              {% endif %}
            
              {% if update.url or update.foirequest or show_context %}
              <div class="p-3 p-md-4 {% if update.content %}box-card-links{% else %}d-flex mt-auto{% endif %}">
                {% if show_context %}
                  <a href="{{ update.get_absolute_url }}" class="action-link">→ zum Vorhaben</a>
                {% else %}
                  {% if update.url %}
                    <a href="{{ update.url }}" class="action-link me-3" target="_blank" rel="noopener">→ mehr auf {{ update.get_url_domain }} lesen…</a>
                  {% endif %}
            
                  {% if update.foirequest %}
                    <a href="{{ update.foirequest.get_absolute_url }}" class="action-link">→ zur Anfrage</a>
                  {% endif %}
                {% endif %}
              </div>
              {% endif %}

            </div>
          </div>
        </div>
        {% endfor %}
      </div>
    </div>
  </div>
  <button class="carousel-control-prev" type="button" data-bs-target="#cardCarousel" data-bs-slide="prev">
    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
    <span class="visually-hidden">Zurück</span>
  </button>
  <button class="carousel-control-next" type="button" data-bs-target="#cardCarousel" data-bs-slide="next">
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
    <span class="visually-hidden">Weiter</span>
  </button>
</div>

{% else %}

<div class="py-3" style="margin-top: 1rem; margin-bottom: -2rem;">
  <h1 class="text-body-emphasis">Aktuelles</h1>
  <p class="fs-5 col-md-8">
    Hier finden Sie aktuelle Artikel und Links zu Blogs zu den Fortschritten des Vorhabens.
  </p>
</div>

<div class="row row-cols-1 row-cols-sm-2 row-cols-md-3 g-3">
  {% for update in updates %}
  <div class="col">
    <div class="card mb-4 rounded-3 shadow-sm">
      <a href="{{ update.get_absolute_url }}" class="text-body text-decoration-none">
      <div class="card-header p-4 tight-margin text-start">
        {% if show_context %}
          <span class="badge text-bg-blue-100 rounded-pill float-md-right mb-2 mb-md-0">
            {{ update.plan.get_section }}
          </span>
        {% endif %}
        
        {% if show_context %}
          <h3 class="h5 mt-0">{{ update.plan }}</h3>
        {% else %}
          <h3 class="h4 mt-0">{{ update.title }}</h3>
        {% endif %}

        <div class="small">
          <time datetime="{{ update.timestamp|date:'c' }}">{{ update.timestamp|date:"DATE_FORMAT" }}</time>
  
          {% if update.user or update.organization %}
          <span>
            von {{ update.user.get_full_name }}{% if update.user and update.organization %},{% endif %}
            {{ update.organization.name }}
          </span>
          {% endif %}
        </div>

      </div>
      </a>
      <div class="card-body tight-margin text-start p-4">

        {% if update.content or show_context %}
        <div class="tight-margin">
          {% if show_context %}
            <h4 class="h5">{{ update.title }}</h4>
          {% endif %}
      
          {% with update.content|markdown as content %}
            {% if show_context %}
              {{ content|truncatewords_html:50 }}
            {% else %}
              {{ content }}
            {% endif %}
          {% endwith %}
        </div>
        {% endif %}
      
        {% if update.url or update.foirequest or show_context %}
        <div class="{% if update.content %}box-card-links{% else %}d-flex mt-auto{% endif %}">
          {% if show_context %}
            <a href="{{ update.get_absolute_url }}" class="action-link">→ zum Vorhaben</a>
          {% else %}
            {% if update.url %}
              <a href="{{ update.url }}" class="action-link me-3" target="_blank" rel="noopener">→ mehr auf {{ update.get_url_domain }} lesen…</a>
            {% endif %}
      
            {% if update.foirequest %}
              <a href="{{ update.foirequest.get_absolute_url }}" class="action-link">→ zur Anfrage</a>
            {% endif %}
          {% endif %}
        </div>
        {% endif %}

      </div>
    </div>
  </div>
  {% endfor %}
</div>

{% endif %}