{% extends "layout.html" %}
{% import "macros/_misc.html" as misc %}

{% block page_title %}Participants{% endblock %}
{% block body_class %}eventusers{% endblock %}

{% block content %}

{% if current_user and current_user.is_authenticated %}
  <div class="float-right btn-group">
    <a class="btn btn-lg btn-info"
       title="Go to my user profile"
       href="{{ url_for('public.user_current') }}">
      <i class="fa fa-user bg-info text-white" aria-hidden="true"></i>
      {{ current_user.username }}
    </a>
    <a href="{{ url_for('auth.user_story') }}" 
       title="Edit my user story"
       class="btn btn-success btn-lg">
      <i class="fa fa-child"></i>
      My Story
    </a>
  </div>
{% endif %}

<h1 class="huge">
  {% if u %}`{{ u }}`
  {% else %}Contributors
  {% endif %}
</h1>

  <div id="search-users" class="mb-2">
    <form method="get" action="{{ url_for('public.all_participants') }}">
      <div class="content input-group">
        <span class="input-group-text">
          <i class="fa fa-search" aria-hidden="true"></i>
        </span>
        <input type="text" class="form-control" name="u"
          title="Use @username *skill or ~role to refine your search."
          aria-label="Search users" placeholder="Search ...">
      </div>
    </form>
  </div>

{% if preset_roles %}
  <div class="missing-roles">
    {% for role in preset_roles %}
      <a class="role" data-id="{{ role.id }}"
         href="{{ url_for('public.all_participants') }}?u=~{{ role.name }}">
        <span>{{ role.name }}</span>
      </a>
    {% endfor %}
  </div>
{% endif %}

{% if participants %}

  <div class="event-participants">
    <div class="participant-box">
    {% for user in participants %}
      {{ misc.render_user_profile(user) }}
    {% endfor %}
    </div>
  </div><!-- /event-participants -->

{% endif %}

<div category-id="infobox" class="mt-5 text-center">
  {% if not usercount %}
    <h5 class="no-matches">🤷‍♀️ Encourage people to choose a role and join a team.</h5>
  {% else %}
    <div class="usercount mb-2">
      <span class="user-score">{{ usercount }}</span> 
      {% if u %}match{% endif %}
    </div>
  {% endif %}
  {% if current_event %}
    <a class="btn btn-secondary" href="{{ url_for('public.all_participants') }}">
      <i class="fa fa-book me-2"></i>
      Directory</a>

    {% if current_event.has_started and not current_event.has_finished %}
      <h4 class="mt-4">
        <i class="fa fa-lightbulb-o me-1"></i>
        Remember to join a project that you are working on.
      </h4>
    {% endif %}
  {% endif %}
</div>

{% if current_event %}
<center class="mt-5">
    <a class="btn btn-light btn-lg" href="{{ url_for('public.event', event_id=current_event.id) }}">
      <i class="fa fa-arrow-left" aria-hidden="true"></i>
      {{ current_event.name }}</a>
</center>
{% endif %}

{% endblock %}