{% extends "base.html" %}
{% block title %}{{ student.full_name }} · {{ exam.title }}{% endblock %}
{% block content %}
<div class="pagehead">
  <div>
    <div class="crumbs"><a href="{{ url_for('teacher_home') }}">Exams</a> / <a href="{{ url_for('exam_results', eid=exam.id) }}">{{ exam.title }} results</a> / {{ student.full_name }}</div>
    <h1>{{ student.full_name }} <span class="muted" style="font-weight:500">{{ student.username }}</span></h1>
    <p>{{ student.class_name or 'No class' }} · started {{ att.started_at|dt }}{% if att.submitted_at %} · submitted {{ att.submitted_at|dt }}{% endif %}</p>
  </div>
  <div class="row no-print"><button class="btn" onclick="window.print()">Print</button></div>
</div>

<div class="pill-row">
  <div class="pill"><b>{% if att.status == 'submitted' %}{{ att.score|num }} / {{ att.total|num }}{% else %}Writing{% endif %}</b><span>Score</span></div>
  <div class="pill"><b>{% if pct is not none %}{{ '%.1f'|format(pct) }}%{% else %}-{% endif %}</b><span>Percent</span></div>
  <div class="pill"><b>{{ att.tab_switches }}</b><span>Times left the exam tab</span></div>
  <div class="pill"><b>{{ att.strikes }}</b><span>Warnings</span></div>
  <div class="pill"><b>{{ att.interruptions }}</b><span>Page closed / resumed</span></div>
</div>
{% if att.end_reason %}<div class="flash error">Exam ended automatically: {{ att.end_reason }}.</div>{% endif %}
{% if events %}
<div class="card" style="margin-bottom:14px"><h3 style="margin-top:0">Integrity log</h3>
  <table class="tbl"><tbody>
  {% for e in events %}<tr><td class="small">{{ e.ts|dt }}</td><td><b>{{ e.kind|replace('_',' ') }}</b></td><td class="small muted">{{ e.detail }}</td></tr>{% endfor %}
  </tbody></table></div>
{% endif %}

{% for r in rows %}
<div class="rev {{ 'ok' if r.ok else 'bad' }}">
  <div class="row between">
    <div><span class="qnum">{{ loop.index }}.</span><b>{{ r.q.text }}</b>{% if r.q.image %}<br><img class="qimg" src="{{ qimg(r.q.image) }}" alt="">{% endif %}</div>
    <span class="badge {{ 'ok' if r.ok else 'bad' }}">{{ 'Correct' if r.ok else 'Wrong' }} · {{ (r.q.marks if r.ok else 0)|num }}/{{ r.q.marks|num }}</span>
  </div>
  <div class="small" style="margin-top:6px">Student answered: <b>{{ r.given_text }}</b></div>
  {% if not r.ok %}<div class="small">Correct answer: <b>{{ r.correct_text }}</b></div>{% endif %}
</div>
{% endfor %}
{% endblock %}