<!-- extend base layout -->
{% extends "base.html" %}
{% block css %}
    <!-- Ion.RangeSlider -->
    <link href="/vendors/normalize-css/normalize.css" rel="stylesheet">
        <!-- Switchery -->
    <link href="/vendors/switchery/dist/switchery.min.css" rel="stylesheet">
{% endblock %}
{% block content %}

<div class="row">
	<div class="col-md-12 col-sm-12 col-xs-12">
		<div class="x_panel">
			<div class="x_title">
				<h3><i class="fa fa-user"></i> Users</h3>
				<ul class="nav navbar-right panel_toolbox">
					<li>
						<a class="btn-new-user"><span style="color: #5499c7; "><i class="fa fa-plus"></i> Add new</span></a>
					</li>
        </ul>
        <div class="clearfix"></div>
			</div>
			<div class="x_content">
				<button class="btn btn-success btn-xs btn-sync_from_keycloak">
					<i class="fa fa-refresh" aria-hidden="true"></i> Sync all from keycloak
				</button>
				<button class="btn btn-primary btn-xs btn-sync_to_nextcloud">
					<i class="fa fa-refresh" aria-hidden="true"></i> Sync to Nextcloud
				</button>
				<button class="btn btn-primary btn-xs btn-sync_to_moodle">
					<i class="fa fa-refresh" aria-hidden="true"></i> Sync to Moodle
				</button>
				{% if current_user.role =='admin' %}
				<button class="btn btn-danger btn-xs btn-delete_keycloak">
					<i class="fa fa-trash"></i> Delete all keycloak
				</button>
				<button class="btn btn-danger btn-xs btn-delete_nextcloud">
					<i class="fa fa-trash"></i> Delete missing keycloak in nextcloud
				</button>
				<button class="btn btn-danger btn-xs btn-delete_moodle">
					<i class="fa fa-trash"></i> Delete missing keycloak in moodle
				</button>
				{% endif %}
				<table id="users" class="table" width="100%">
					<thead>
						<tr>
							<th></th>
							<th>Avatar</th>
							<th>Username</th>
							<th>First</th>
							<th>Last</th>
							<th>email</th>
							<th>Keycloak</th>
							<th>K.Groups</th>
							<th>K.Roles</th>
							<th>Moodle</th>
							<th>M.Groups</th>
							<th>Nextcloud</th>
							<th>N.Groups</th>
						</tr>
					</thead>
					<tbody>
					</tbody>
				</table>
			</div>
		</div>
		{% include 'pages/modals/users_modals.html' %}
		{% include 'pages/users_detail.html' %}
	</div>
</div>


{% endblock %}

{% block pagescript %}
   <!-- Ion.RangeSlider -->
    <script src="/vendors/ion.rangeSlider/js/ion.rangeSlider.min.js"></script>
    <!-- iCheck -->
    <script src="/vendors/iCheck/icheck.min.js"></script> 
    <!-- Switchery -->
    <script src="/vendors/switchery/dist/switchery.min.js"></script>
    <!-- Desktops sse & modals -->
	<script src="/static/js/sysadmin/users.js"></script>
{% endblock %}
