{% extends 'atlas/exams.html' %}
{% load crispy_forms_tags %}

{% block content %}

    {% include 'atlas/partials/_viewing_case_as_part_of_collection.html' with nav_link_view="atlas:collection_case_details" %}

    <h2>Case: <a href="{% url 'atlas:case_detail' casedetail.case.pk %}">{{casedetail.case.title}}</a></h2>

    <p>This page allows you to configure how the case is displayed as part of the collection.</p>



    <form method="POST" class="post-form">
        {% csrf_token %}
        {% crispy form form.helper %}

        <div class="card mb-3">
            <div class="card-header">
                <strong>Series Visibility</strong>
            </div>
            <div class="card-body">
                <p class="small text-muted mb-3">Choose how each series is shown for this case in this collection.</p>
                {% if series_visibility_rows %}
                    <div class="table-responsive">
                        <table class="table table-sm align-middle">
                            <thead>
                                <tr>
                                    <th>Series</th>
                                    <th>Visibility</th>
                                </tr>
                            </thead>
                            <tbody>
                                {% for row in series_visibility_rows %}
                                    <tr>
                                        <td>
                                            <div class="fw-semibold">Series {{ forloop.counter }}</div>
                                            <div class="small text-muted">{{ row.series }}</div>
                                        </td>
                                        <td>
                                            <select class="form-select form-select-sm" name="series_visibility_{{ row.series.pk }}">
                                                {% for value, label in visibility_choices %}
                                                    <option value="{{ value }}" {% if row.value == value %}selected{% endif %}>{{ label }}</option>
                                                {% endfor %}
                                            </select>
                                        </td>
                                    </tr>
                                {% endfor %}
                            </tbody>
                        </table>
                    </div>
                {% else %}
                    <div class="text-muted">No series linked to this case.</div>
                {% endif %}
            </div>
        </div>

        <button type="submit" value="answer" name="submit" class="btn btn-primary">Save Changes</button>
    </form>

{% endblock %}

{% block js %}
    <script>
    </script>
    <style></style>
{% endblock %}