{% extends "base.html" %}

{% block stylesheets %}
{% endblock %}

{% block content %}
	<div class="jumbotron">
		<div class="container">
			<h1>Users</h1>
		</div>
	</div>
	<div class="container">
		<div class="row">
			<div class="col-md-12">
				<table class="table table-striped">
					<thead>
					<tr>
						<td><b>User</b></td>
						<td><b>Website</b></td>
						<td class="d-none d-md-table-cell d-lg-table-cell"><b>Affiliation</b></td>
						<td class="d-none d-md-table-cell d-lg-table-cell"><b>Country</b></td>
					</tr>
					</thead>
					<tbody>
					{% for user in users %}
						<tr>
							<td>
								{% if scores_visible() %}
									<a href="{{ url_for('users.public', user_id=user.id) }}">
										{{ user.name | truncate(50) }}
									</a>
								{% else %}
									<span>{{ user.name | truncate(50) }}</span>
								{% endif %}
								{% if user.oauth_id %}
									<a href="https://majorleaguecyber.org/u/{{ user.name }}">
										<span class="badge badge-primary">Official</span>
									</a>
								{% endif %}
							</td>
							<td class="text-center" style="width: 10px;">
								{% if user.website and (user.website.startswith('http://') or user.website.startswith('https://')) %}
									<a href="{{ user.website }}" target="_blank">
										<i class="fas fa-external-link-alt" data-toggle="tooltip" data-placement="top"
										   title="{{ user.website }}"></i>
									</a>
								{% endif %}
							</td>
							<td class="d-none d-md-table-cell d-lg-table-cell">
								{% if user.affiliation %}
									{% if user.affiliation | length > 50 %}
										<span data-toggle="tooltip" data-placement="top" title="{{ user.affiliation }}">
									{% if user.affiliation %}{{ user.affiliation | truncate(50) }}{% endif %}
								</span>
									{% else %}
										<span>
									{% if user.affiliation %}{{ user.affiliation | truncate(50) }}{% endif %}
								</span>
									{% endif %}
								{% endif %}
							</td>
							<td class="d-none d-md-table-cell d-lg-table-cell">
								<span>
									{% if user.country %}
										<i class="flag-{{ user.country.lower() }}"></i>
										{{ lookup_country_code(user.country) }}
									{% endif %}
								</span>
							</td>
						</tr>
					{% endfor %}
					</tbody>
				</table>
			</div>
		</div>
		{% if pages > 1 %}
			<div class="row">
				<div class="col-md-12">
					<div class="text-center">Page
						<br>
						{% if curr_page != 1 %}
							<a href="{{ url_for('users.listing', page=curr_page - 1) }}">
								&lt;&lt;&lt;
							</a>
						{% endif %}
						<select class="page-select">
							{% for page in range(1, pages + 1) %}
							<option {% if curr_page == page %}selected{% endif %}>{{ page }}</option>
							{% endfor %}
						</select>
						{% if curr_page != pages %}
							<a href="{{ url_for('users.listing', page=curr_page + 1) }}">
								&gt;&gt;&gt;
							</a>
						{% endif %}
					</div>
				</div>
			</div>
		{% endif %}
	</div>
{% endblock %}

{% block scripts %}
{% endblock %}
