{# templates/songs_dashboard.html #}
{% extends 'base.html' %}

{# page title #}
{% block title %}Analyse Wiederholungen{% endblock %}
{% block page_id %}songs_dashboard{% endblock %}

{# page content #}
{% block content %}

<!-- Main Container -->
<div class="container">
  <h2>Analyse Wiederholungen</h2>
  <!-- Dropdown Controls -->
  <div class="mb-4 d-flex flex-wrap gap-2">
    <!-- Site Dropdown -->
    <div class="dropdown">
      <button class="btn btn-secondary dropdown-toggle" 
              type="button" id="siteDropdown" data-bs-toggle="dropdown" aria-expanded="false">
        {% if session['songs_dashboard_site'] == 'Speyer' %}
          Speyer
        {% elif session['songs_dashboard_site'] == 'Schwegenheim' %}
          Schwegenheim
        {% else %}
          Select Site
        {% endif %}
      </button>
      <ul class="dropdown-menu" aria-labelledby="siteDropdown">
        <li>
          <a class="dropdown-item {% if session['songs_dashboard_site'] == 'Speyer' %}active{% endif %}" 
            href="{{ url_for('songs_dashboard', site='Speyer') }}">
            Speyer
          </a>
        </li>
        <li>
          <a class="dropdown-item {% if session['songs_dashboard_site'] == 'Schwegenheim' %}active{% endif %}" 
            href="{{ url_for('songs_dashboard', site='Schwegenheim') }}">
            Schwegenheim
          </a>
        </li>
      </ul>
    </div>
    
    <!-- Timeframe Dropdown -->
    <div class="dropdown">
      <button class="btn btn-secondary dropdown-toggle" 
              type="button" id="timeframeDropdown" data-bs-toggle="dropdown" aria-expanded="false">
        {% if session['songs_dashboard_timeframe'] == '7' %}
          Last 7 Days
        {% elif session['songs_dashboard_timeframe'] == '14' %}
          Last 14 Days
        {% elif session['songs_dashboard_timeframe'] == '30' %}
          Last 30 Days
        {% elif session['songs_dashboard_timeframe'] == '90' %}
          Last 90 Days
        {% elif session['songs_dashboard_timeframe'] == '365' %}
          Last 365 Days
        {% elif session['songs_dashboard_timeframe'] == 'all' %}
          All Data
        {% else %}
          Select Timeframe
        {% endif %}
      </button>
      <ul class="dropdown-menu" aria-labelledby="timeframeDropdown">
        <li>
          <a class="dropdown-item {% if session['songs_dashboard_timeframe'] == '7' %}active{% endif %}" 
            href="{{ url_for('songs_dashboard', timeframe='7') }}">
            Last 7 Days
          </a>
        </li>
        <li>
          <a class="dropdown-item {% if session['songs_dashboard_timeframe'] == '14' %}active{% endif %}" 
            href="{{ url_for('songs_dashboard', timeframe='14') }}">
            Last 14 Days
          </a>
        </li>
        <li>
          <a class="dropdown-item {% if session['songs_dashboard_timeframe'] == '30' %}active{% endif %}" 
            href="{{ url_for('songs_dashboard', timeframe='30') }}">
            Last 30 Days
          </a>
        </li>
        <li>
          <a class="dropdown-item {% if session['songs_dashboard_timeframe'] == '90' %}active{% endif %}" 
            href="{{ url_for('songs_dashboard', timeframe='90') }}">
            Last 90 Days
          </a>
        </li>
        <li>
          <a class="dropdown-item {% if session['songs_dashboard_timeframe'] == '365' %}active{% endif %}" 
            href="{{ url_for('songs_dashboard', timeframe='365') }}">
            Last 365 Days
          </a>
        </li>
        <li>
          <a class="dropdown-item {% if session['songs_dashboard_timeframe'] == 'all' %}active{% endif %}" 
            href="{{ url_for('songs_dashboard', timeframe='all') }}">
            All Data
          </a>
        </li>
      </ul>
    </div>

    <!-- category Dropdown -->
    <div class="dropdown">
      <button class="btn btn-secondary dropdown-toggle" type="button" id="categoryDropdown" data-bs-toggle="dropdown" aria-expanded="false">
        {% if session['songs_dashboard_category'] == 'Gemeinsamer Gesang' %}
        Gemeinsamer Gesang
        {% elif session['songs_dashboard_category'] == 'Chor' %}
        Chor
        {% elif session['songs_dashboard_category'] == 'Gruppenlied' %}
        Gruppenlied
        {% else %}
        Select Category
        {% endif %}
      </button>
      <ul class="dropdown-menu" aria-labelledby="categoryDropdown">
        <li>
          <a class="dropdown-item {% if session['songs_dashboard_category'] == 'Gemeinsamer Gesang' %}active{% endif %}" 
            href="{{ url_for('songs_dashboard', category='Gemeinsamer Gesang') }}">
            Gemeinsamer Gesang
          </a>
        </li>
        <li>
          <a class="dropdown-item {% if session['songs_dashboard_category'] == 'Chor' %}active{% endif %}" 
            href="{{ url_for('songs_dashboard', category='Chor') }}">
            Chor
          </a>
        </li>
        <li>
          <a class="dropdown-item {% if session['songs_dashboard_category'] == 'Gruppenlied' %}active{% endif %}" 
            href="{{ url_for('songs_dashboard', category='Gruppenlied') }}">
            Gruppenlied
          </a>
        </li>
      </ul>
    </div>
  </div> 

  <!-- Table Output -->
  <table class="table table-bordered">
    <thead>
      <tr>
        <th>Anzahl</th>
        <th>Titel</th>
        <th>Zuletzt gesungen</th>
      </tr>
    </thead>
    <tbody>
      {% for item in performance_data %}
        <tr>
          <td>{{ item['count'] }}</td>
          <td>{{ item['titel'] }}</td>
          <td>{{ item['last_performed'] }}</td>
        </tr>
      {% endfor %}
    </tbody>
  </table>
</div>

{% endblock %}
