{% extends "default.html" %}
{% block pagetitle %}/h/{{hole}} Mods{% endblock %}
{% block content %}
	<script defer src="{{'js/remove_mod.js' | asset}}"></script>

	<h5 class="mt-2">/h/{{hole}} Mods</h5>
	<div class="overflow-x-auto mt-1"><table class="table table-striped mb-5">
	<thead class="bg-primary text-white">
		<tr>
			<th>#</th>
			<th>Name</th>
			<th>Mod since</th>
			<th class="disable-sort-click"></th>
		</tr>
	</thead>
	{% for user, mod in users %}
		<tr>
			<td>{{loop.index}}</td>
			<td>{% include "user_in_table.html" %}</td>
			<td data-time="{{mod.created_utc}}"></td>
			<td>
				{% if v.id == user.id or v.mod_date(hole.name) and v.mod_date(hole.name) < mod.created_utc %}
					<form action="/h/{{hole}}/remove_mod" method="post" data-nonce="{{g.nonce}}" data-onsubmit="removeMod(this)">
						<input hidden name="formkey" value="{{v|formkey}}">
						<input hidden name="uid" value="{{user.id}}">
						<input autocomplete="off" class="btn btn-primary ml-auto" type="submit" value="{% if v.id == user.id %}Resign{% else %}Remove Mod{% endif %}">
					</form>
				{% endif %}
			</td>
		</tr>
	{% endfor %}

	</table>

	{% if v.mods(hole.name) %}
		<form action="/h/{{hole}}/add_mod" method="post" data-nonce="{{g.nonce}}" data-onsubmit="sendFormXHRReload(this)">
			<input hidden name="formkey" value="{{v|formkey}}">
			<input class="form-control" style="display:inline;width:250px" autocomplete="off" type="text" name="user" class="form-control" placeholder="Enter username..">
			<input autocomplete="off" class="btn btn-primary ml-auto" type="submit" value="Add Mod" style="margin-bottom: 5px">
		</form>
	{% endif %}
{% endblock %}