{{ define "content" }}
<h2>Thunderball Results</h2>

<form method="GET" action="/results/thunderball" style="margin-bottom: 1rem;">
    <input type="text" name="q" placeholder="Search by date or draw number" value="{{ .Query }}">

    <select name="year">
        <option value="">All Years</option>
        {{ range .Years }}
            <option value="{{ . }}" {{ if eq $.YearFilter . }}selected{{ end }}>{{ . }}</option>
        {{ end }}
    </select>

    <select name="machine">
        <option value="">All Machines</option>
        {{ range .Machines }}
            <option value="{{ . }}" {{ if eq $.MachineFilter . }}selected{{ end }}>{{ . }}</option>
        {{ end }}
    </select>

    <select name="ballset">
        <option value="">All Ball Sets</option>
        {{ range .BallSets }}
            <option value="{{ . }}" {{ if eq $.BallSetFilter . }}selected{{ end }}>{{ . }}</option>
        {{ end }}
    </select>

    <button type="submit">Search</button>
    {{ if .Query }}
        <a href="/results/thunderball" style="margin-left: 10px;">Clear</a>
    {{ end }}
</form>

{{ if .NoResultsMsg }}
    <p>{{ .NoResultsMsg }}</p>
{{ end }}

<table>
    <tr>
        <th>Draw Number</th>
        <th>Date</th>
        <th>Machine</th>
        <th>Ball Set</th>
        <th>Numbers</th>
        <th>Thunderball</th>
    </tr>
    {{ range .Results }}
    <tr>
        <td>{{ .Id }}</td>
        <td>{{ .DrawDate }}</td>
        <td>{{ .Machine }}</td>
        <td>{{ .BallSet }}</td>
        <td>
            {{ range $i, $n := .SortedBalls }}
                {{ if $i }}, {{ end }}{{ $n }}
            {{ end }}
        </td>
        <td>{{ .Thunderball }}</td>
    </tr>
    {{ end }}
</table>

<style>
.pagination a {
    margin: 0 5px;
    text-decoration: none;
}
.pagination .disabled {
    color: #aaa;
    pointer-events: none;
    cursor: default;
}
</style>

<div class="pagination" style="margin-top: 20px;">
    {{ if gt .Page 1 }}
        <a href="/results/thunderball?page=1{{ if .Query }}&q={{ .Query }}{{ end }}{{ if .YearFilter }}&year={{ .YearFilter }}{{ end }}{{ if .MachineFilter }}&machine={{ .MachineFilter }}{{ end }}{{ if .BallSetFilter }}&ballset={{ .BallSetFilter }}{{ end }}">« First</a>
        <a href="/results/thunderball?page={{ minus1 .Page }}{{ if .Query }}&q={{ .Query }}{{ end }}{{ if .YearFilter }}&year={{ .YearFilter }}{{ end }}{{ if .MachineFilter }}&machine={{ .MachineFilter }}{{ end }}{{ if .BallSetFilter }}&ballset={{ .BallSetFilter }}{{ end }}">← Prev</a>
    {{ else }}
        <span class="disabled">« First</span>
        <span class="disabled">← Prev</span>
    {{ end }}

    &nbsp; Page {{ .Page }} of {{ .TotalPages }} &nbsp;

    {{ if lt .Page .TotalPages }}
        <a href="/results/thunderball?page={{ plus1 .Page }}{{ if .Query }}&q={{ .Query }}{{ end }}{{ if .YearFilter }}&year={{ .YearFilter }}{{ end }}{{ if .MachineFilter }}&machine={{ .MachineFilter }}{{ end }}{{ if .BallSetFilter }}&ballset={{ .BallSetFilter }}{{ end }}">Next →</a>
        <a href="/results/thunderball?page={{ .TotalPages }}{{ if .Query }}&q={{ .Query }}{{ end }}{{ if .YearFilter }}&year={{ .YearFilter }}{{ end }}{{ if .MachineFilter }}&machine={{ .MachineFilter }}{{ end }}{{ if .BallSetFilter }}&ballset={{ .BallSetFilter }}{{ end }}">Last »</a>
    {{ else }}
        <span class="disabled">Next →</span>
        <span class="disabled">Last »</span>
    {{ end }}

    <p>
        Showing {{ add (mul (minus1 .Page) 20) 1 }}–{{ min (mul .Page 20) .TotalResults }} of {{ .TotalResults }} results
    </p>
</div>
{{ end }}