{% extends 'base.html' %}

{% block content %}
    {% if cid is not None %}
        CID: {{cid}}
    {% endif %}

    <h2>Collection: {{collection.name}}

        {% if collection.in_review_mode or cid_user_exam.completed %}
            <span class="stamp-white">REVIEW</span>
        {% endif %}
    </h2>


    {% if not collection.review_only %}
        {{answer_count}} out of {{collection_length}} cases answered. Click to go to case.
    {% endif %}
    <div class="sba-finish-list">
        <ul>
            {% for question, answer, self_review in question_answer_tuples %}
                <li> <span class="{% if not collection.review_only and not answer %}unanswered{% endif %}">
                    <a href="
                             {% if cid is not None %}
                                 {% url 'atlas:collection_case_view_take' pk=collection.id case_number=forloop.counter0 cid=cid passcode=passcode %}
                             {% else %}
                                 {% url 'atlas:collection_case_view_take_user' pk=collection.id case_number=forloop.counter0 %}
                             {% endif %}
                            ">
                        Case: {{forloop.counter}}

                        {% if answer.completed or cid_user_exam.completed %}
                            <span title="You have completed this case"><i class="bi bi-check-square-fill"></i>
                            </span>
                        {% endif %}
                        {% if self_review %} <span class="self-review-complete" title="You have reviewed this case."> <i class="bi-card-checklist"></i></span>{% endif %}

                    </a>
                    <br/>
                    {% if not collection.review_only  %}
                        {% if not answer %}
                            No answer
                        {% else %}
                        <details><summary>Answered</summary>
                            
                            {% if aswer.answer %}
                                {{answer.answer}}
                            {% else %}
                                {{answer.json_answer}}
                            {% endif %}
                                
                        </details>
                        {% endif %}
                    {% endif %}
                </span>
                </li>
            {% endfor %}
        </ul>
    </div>


    Start time: {{cid_user_exam.start_time}}


    {% if not collection.review_only and not cid_user_exam.completed %}
        <p>Completed: <span id="completed-state">{{cid_user_exam.completed}}</span></p>
        <form hx-post=""
                hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
                hx-delete
                hx-confirm="Finish session?"
                hx-target="#completed-state"
                _="on htmx:afterOnLoad remove me"
        >
            <button type="submit" name="finish" value="finish">Finish</button>
        </form>
    {% endif %}



{% endblock %}

{% block js %}
    <script>
        $(document).ready(() => {
        })
    </script>
{% endblock %}