{% extends "base.html" %}
{% block title %}Results — Solitaire Hockey{% endblock %}

{% block content %}
<div class="page">
  <h1>Results</h1>

  <div class="filters">
    <label>Season</label>
    <select class="filter" onchange="applyFilters()">
      <option value="">All seasons</option>
      {% for s in seasons %}
      <option value="{{ s }}" {% if s == current_season %}selected{% endif %}>
        {{ s[:4] }}-{{ s[4:] }}
      </option>
      {% endfor %}
    </select>
  </div>

  <div class="card">
    {% if games %}
    <table>
      <thead>
        <tr>
          <th data-sort>Date</th>
          <th data-sort>Away</th>
          <th class="num" data-sort>A</th>
          <th class="num" data-sort>H</th>
          <th data-sort>Home</th>
          <th>OT</th>
        </tr>
      </thead>
      <tbody>
        {% for g in games %}
        {% set away_key = g.away_tricode + '_' + g.season %}
        {% set home_key = g.home_tricode + '_' + g.season %}
        {% set away_name = team_names.get(away_key, g.away_tricode) %}
        {% set home_name = team_names.get(home_key, g.home_tricode) %}
        {% set away_win = g.away_score > g.home_score %}
        {% set home_win = g.home_score > g.away_score %}
        <tr>
          <td>{{ g.game_date }}</td>
          <td>
            <a href="/team/{{ away_key }}">{{ away_name }}</a>
          </td>
          <td class="num" style="font-weight:{% if away_win %}700{% else %}400{% endif %}; color:{% if away_win %}#fff{% else %}#8892a4{% endif %}">
            {{ g.away_score }}
          </td>
          <td class="num" style="font-weight:{% if home_win %}700{% else %}400{% endif %}; color:{% if home_win %}#fff{% else %}#8892a4{% endif %}">
            {{ g.home_score }}
          </td>
          <td>
            <a href="/team/{{ home_key }}">{{ home_name }}</a>
          </td>
          <td style="color:#8892a4;font-size:0.75rem;">{{ 'OT' if g.overtime else '' }}</td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
    {% else %}
    <p class="empty">No results yet.</p>
    {% endif %}
  </div>
</div>
{% endblock %}

{% block scripts %}
<script>
function applyFilters() {
  const season = document.querySelector('select.filter').value;
  const params = new URLSearchParams();
  if (season) params.set('season', season);
  window.location = '/results' + (params.toString() ? '?' + params : '');
}
</script>
{% endblock %}