{% extends "base.html" %}
{% block title %}Job {{ job.job_id }} - Feedmill Recounter{% endblock %}
{% block content %}
<h2>Job: {{ job.job_id }}</h2>

<div class="job-info">
    <p><strong>Status:</strong> <span class="status-{{ job.status.name|lower }}">{{ job.status.name }}</span></p>
    <p><strong>Video:</strong> {{ job.video_path }}</p>
    <p><strong>Progress:</strong> {{ "%.0f"|format(job.progress * 100) }}%</p>
    {% if job.current_model %}
    <p><strong>Current Model:</strong> {{ job.current_model }}</p>
    {% endif %}
    {% if job.error %}
    <p class="error"><strong>Error:</strong> {{ job.error }}</p>
    {% endif %}
</div>

{% if job.results %}
<h3>Results</h3>
<table class="results-table">
    <thead>
        <tr>
            <th>Model</th>
            <th>Loading</th>
            <th>Unloading</th>
            <th>Net</th>
            <th>Batches</th>
            <th>Frames</th>
            <th>Duration</th>
            <th>Output</th>
        </tr>
    </thead>
    <tbody>
        {% for r in job.results %}
        <tr>
            <td>{{ r.model_name }}</td>
            <td>{{ r.loading_count }}</td>
            <td>{{ r.unloading_count }}</td>
            <td>{{ r.net_count }}</td>
            <td>{{ r.batch_count }}</td>
            <td>{{ r.frame_count }}</td>
            <td>{{ "%.1f"|format(r.duration_seconds) }}s</td>
            <td>
                {% if r.output_path %}
                <a href="/download/{{ job.job_id }}/{{ r.output_path | basename }}"
                   class="download-btn">Download</a>
                {% endif %}
            </td>
        </tr>
        {% endfor %}
    </tbody>
</table>
{% endif %}

{% if job.status.name == "RUNNING" or job.status.name == "PENDING" %}
<div class="auto-refresh">
    <p>Status will auto-refresh...</p>
</div>
<script>
    setTimeout(function() { location.reload(); }, 2000);
</script>
{% endif %}
{% endblock %}