{% extends "base.html" %}
{% block title %}Approve users{% endblock %}

{% block content %}

{% with messages = get_flashed_messages() %}
{% if messages %}
<div class="modal fade modal-warning" id="formerror" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
  aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
            aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Login Error</h4>
      </div>
      <div class="modal-body">
        <div class="modal-message">
          {% for message in messages %}
          {{ message }}
          {% endfor %}
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-warning" data-dismiss="modal">Close</button>
      </div>
    </div>
  </div>
</div>
{% endif %}
{% endwith %}

<div class="container">
  <div class="row">
    <form method="post">
      <div class="card">
        <div class="card-header">
          <div class="card-title">
            <div class="title">Approve or remove users and event subscribers <br />
            </div>
          </div>
        </div>
        <div class="card-body">
          <div class="row">
            <div class="col-sm-6 col-lg-6">
              <h3>New users</h3>
              <input type="checkbox" onClick="toggle_users(this)" checked> Approve all users<br /><br />
              {% for asked_user in asked_users %}
              <input type="checkbox" name="approve_users" value="{{ asked_user.name }}" checked> {{ asked_user.name }}:
              {{ asked_user.firstname }} {{ asked_user.lastname }} - {{ asked_user.email }}<br>
              {% endfor %}
            </div>
            <div class="col-sm-6 col-lg-6">
              <h3>Event subscribers</h3>
              <input type="checkbox" onClick="toggle_event_teams(this)" checked> Approve all event teams<br /><br />
              {% for asked_event_team in asked_sign_up %}
              <input type="checkbox" name="approve_event_teams" value="{{ asked_event_team.id }}" checked>
              {{ asked_event_team.event.name }} - {{ asked_event_team.team.name }} <br>
              {% endfor %}
            </div>
          </div>
          <div class="row">
            <div class="col-sm-6 col-lg-6 text-center">
              <input type="submit" name="submit_button" value="Approve!" class="btn btn-default">
            </div>
            <div class="col-sm-6 col-lg-6 text-center">
              <input type="submit" name="submit_button" value="Remove!" class="btn btn-default">
            </div>
          </div>
        </div>
    </form>
  </div>
</div>

{% endblock %}

{% block scripts %}
<script>
  function toggle_users(source) {
    checkboxes = document.getElementsByName('approve_users');
    for (var i = 0, n = checkboxes.length; i < n; i++) {
      checkboxes[i].checked = source.checked;
    }
  }
  function toggle_event_teams(source) {
    checkboxes = document.getElementsByName('approve_event_teams');
    for (var i = 0, n = checkboxes.length; i < n; i++) {
      checkboxes[i].checked = source.checked;
    }
  }
</script>
{% endblock %}