{% extends "admin/base.html" %}

{% block stylesheets %}
<style>
</style>
{% endblock %}


{% block content %}
	{% include "admin/modals/challenges/challenges.html" %}

	{% include "admin/modals/tags/tags.html" %}
	{% include "admin/modals/files/files.html" %}
	{% include "admin/modals/hints/hints.html" %}
	{% include "admin/modals/keys/keys.html" %}

	<div class="modal fade" tabindex="-1">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
				</div>
				<div class="modal-body">
				</div>
			</div>
		</div>
	</div>

	<input type="hidden" value="{{ nonce }}" id="nonce">

	<div id="create-challenge" class="modal fade" tabindex="-1">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal">&times;</button>
					<h3>New Challenge</h3>
				</div>
			</div>
		</div>
	</div>

	<div id="update-modals-entry-div">
	</div>

<div class="jumbotron">
	<div class="container">
		<h1>Challenges
			<a class="no-decoration" href="{{ request.script_root }}/admin/chal/new">
				<i class="fa fa-plus-circle" role="button" data-toggle="tooltip" title="Create Challenge"></i>
			</a>
		</h1>
	</div>
</div>
<div class="container">
	<div class="row">
		<div class="col-md-12">
			<div>
				<table id="challenges" class="table table-striped">
					<thead>
					<tr>
						<td><b>ID</b></td>
						<td><b>Name</b></td>
						<td class="d-none d-md-table-cell d-lg-table-cell"><b>Category</b></td>
						<td class="d-none d-md-table-cell d-lg-table-cell"><b>Value</b></td>
						<td class="d-none d-md-table-cell d-lg-table-cell"><b>Type</b></td>
						<td class="d-none d-md-table-cell d-lg-table-cell text-center"><b>Status</b></td>
						<td style="width: 200px;"><b>Settings</b></td>
					</tr>
					</thead>
					<tbody>
					{% for challenge in challenges %}
						<tr>
							<td>{{ challenge.id }}</td>
							<td>{{ challenge.name }}</td>
							<td class="d-none d-md-table-cell d-lg-table-cell">{{ challenge.category }}</td>
							<td class="d-none d-md-table-cell d-lg-table-cell">{{ challenge.value }}</td>
							<td class="d-none d-md-table-cell d-lg-table-cell">{{ challenge.type }}</td>
							<td class="d-none d-md-table-cell d-lg-table-cell text-center">
								{% if challenge.hidden %}
									<button class="btn-sm btn-danger" type="submit" disabled>Hidden</button>
								{% else %}
									<button class="btn-sm btn-success" type="submit" disabled>Visible</button>
								{% endif %}
							</td>
							<td>
								<i class="fa fa-pencil edit-challenge" aria-hidden="true" data-toggle="tooltip"
								   data-placement="top" chal-id="{{ challenge.id }}"
								   title="Edit {{ challenge.name }}"></i>

								<i class="fa fa-file-text-o preview-challenge" aria-hidden="true" data-toggle="tooltip"
								   data-placement="top" chal-id="{{ challenge.id }}"
								   title="Preview {{ challenge.name }}"></i>

								<span>&nbsp; &nbsp;</span>

								<i class="fa fa-flag edit-keys" aria-hidden="true" data-toggle="tooltip" data-placement="top"
								   title="Edit Flags" chal-id="{{ challenge.id }}"></i>
								<i class="fa fa-cloud-download edit-files" aria-hidden="true" data-toggle="tooltip"
								   data-placement="top" title="Edit Files" chal-id="{{ challenge.id }}"></i>
								<i class="fa fa-tags edit-tags" aria-hidden="true" data-toggle="tooltip" data-placement="top"
								   title="Edit Tags" chal-id="{{ challenge.id }}"></i>
								<i class="fa fa-question-circle edit-hints" aria-hidden="true" data-toggle="tooltip"
								   data-placement="top" title="Edit Hints" chal-id="{{ challenge.id }}"></i>

								<span>&nbsp; &nbsp;</span>

								<i class="fa fa-times delete-challenge" aria-hidden="true" data-toggle="tooltip"
								   data-placement="top" title="Delete {{ challenge.name }}" chal-id="{{ challenge.id }}"></i>
							</td>
						</tr>
					{% endfor %}
					</tbody>
				</table>
			</div>
		</div>
	</div>
</div>
{% endblock %}

{% block scripts %}
	<script src="{{ request.script_root }}/themes/admin/static/js/challenges/chalboard.js"></script>
	<script src="{{ request.script_root }}/themes/admin/static/js/files/files-utils.js"></script>
	<script src="{{ request.script_root }}/themes/admin/static/js/hints/hints-utils.js"></script>
	<script src="{{ request.script_root }}/themes/admin/static/js/keys/keys-utils.js"></script>
	<script src="{{ request.script_root }}/themes/admin/static/js/tags/tags-utils.js"></script>
	<script src="{{ request.script_root }}/themes/admin/static/js/multi-modal.js"></script>
{% endblock %}
