{% extends "domain_base.html" %}
{% block domain_content %}
<div class="section">
  <div class="section__header">
    <h1 class="section__title">{{ _('Bulk enroll students') }}</h1>
  </div>
  <div class="section__body typo">
    <p>{{ _('Paste one student per line as «display name, student id, group». Student id and group are optional. A username and a temporary password are generated for each one; download the CSV to hand them out on the first day.') }}</p>
  </div>
  {% if created %}
  <div class="section__body">
    <div class="fork-callout fork-callout--success">{{ _('{0} accounts created.').format(createdCount) }}</div>
    {% if csvB64 %}
    <a class="rounded primary button" download="credenciales.csv" href="data:text/csv;charset=utf-8;base64,{{ csvB64 }}">
      <span class="icon icon-download"></span> {{ _('Download credentials (CSV)') }}
    </a>
    <p class="supplementary">{{ _('The temporary passwords are only shown here and in the CSV. Keep the file safe and ask students to change it.') }}</p>
    {% endif %}
  </div>
  {% endif %}
  {% if messages.length %}
  <div class="section__body">
    <div class="fork-callout fork-callout--warn">{% for m in messages %}{{ m }}<br>{% endfor %}</div>
  </div>
  {% endif %}
  {% if planned.length %}
  <div class="section__body no-padding">
    <table class="data-table">
      <thead>
        <tr>
          <th>{{ _('Name') }}</th>
          <th>{{ _('Username') }}</th>
          {% if created %}<th>{{ _('Password') }}</th>{% endif %}
          <th>{{ _('Email') }}</th>
          <th>{{ _('Student ID') }}</th>
          <th>{{ _('Group') }}</th>
          {% if created %}<th>{{ _('Status') }}</th>{% endif %}
        </tr>
      </thead>
      <tbody>
        {%- for p in planned -%}
        <tr>
          <td>{{ p.displayName }}</td>
          <td>{{ p.username }}</td>
          {% if created %}<td><code>{{ p.password }}</code></td>{% endif %}
          <td>{{ p.email }}</td>
          <td>{{ p.studentId }}</td>
          <td>{{ p.group }}</td>
          {% if created %}<td>
            {% if p.uid %}<span class="record-status--text pass">UID {{ p.uid }}</span>
            {% else %}<span class="record-status--text fail">{{ p.error }}</span>{% endif %}
          </td>{% endif %}
        </tr>
        {%- endfor -%}
      </tbody>
    </table>
  </div>
  {% endif %}
  <div class="section__body">
    <form method="post">
      <label>{{ _('Or upload a .csv file')}}
        <input type="file" accept=".csv,.txt" id="csvFile" class="textbox" />
      </label>
      <p class="help-text supplementary">{{ _('The file is read in your browser and its content fills the box below; a header row (with «nombre»/«name») is skipped automatically.') }}</p>
      <label>{{ _('Student list') }}
        <textarea name="users" id="usersField" class="textbox" rows="10" placeholder="Juan Pérez, 12345678A, Prácticas A&#10;María López, 87654321B, Prácticas B">{% if not created %}{{ rawInput }}{% endif %}</textarea>
      </label>
      <label>{{ _('Email domain') }}
        <input type="text" name="emailDomain" class="textbox" value="{{ emailDomain or 'alumno.local' }}">
      </label>
      <button type="submit" name="draft" value="true" class="rounded button">{{ _('Preview') }}</button>
      <button type="submit" name="draft" value="false" class="rounded primary button" onsubmit="return confirm('{{ _('Confirm') }}?')">{{ _('Create accounts') }}</button>
    </form>
  </div>
</div>
<script>
(function () {
  var input = document.getElementById('csvFile');
  var field = document.getElementById('usersField');
  if (!input || !field) return;
  input.addEventListener('change', function () {
    var file = input.files && input.files[0];
    if (!file) return;
    var reader = new FileReader();
    reader.onload = function () {
      var text = String(reader.result || '').replace(/\r\n?/g, '\n');
      var lines = text.split('\n');
      // Salta una posible fila de cabecera (contiene «nombre»/«name»/«identificador»).
      if (lines.length && /\b(nombre|name|identificador|username|usuario)\b/i.test(lines[0])) lines.shift();
      field.value = lines.join('\n').trim();
    };
    reader.readAsText(file, 'utf-8');
  });
})();
</script>
{% endblock %}