{% extends base %}

{% block content %}
{% import "macros/action_icons_static.html" as icons with context %}
<span class="title" role="main"><h2>{% block title %}Access User Profiles{% endblock %}</h2></span>
<div class="content-container content">
<article>
<div><a href="#" id="a_add_user">{{ icons.add_svg() }}</a></div>
{% if users %}
<div class="table-container">
<table id="tbl_users" class="data-table">
<thead>
<tr>
<th>User ID</th><th>Admin activities</th><th>Capture activities</th><th style="font-size: smaller;">[actions]</th>
</tr>
</thead>
<tbody>
{% for user in users %}
<tr>
<td>{{ user.v_user_id }}</td><td>{{ user.bl_admin }}</td><td>{{ user.bl_capture }}</td><td><a href="#{{ user.id }}" class="a_edit_user" aria-label="edit user">{{ icons.edit_svg() }}</a>&nbsp;<a href="#{{ user.id }}" class="a_remove_user" aria-label="remove user">{{ icons.delete_svg() }}</a></td>
</tr>
{% endfor %}{# end of looping through users #}
</tbody>
</table><!-- end of tbl_users -->
</div><!-- end of div.table-container -->
{% endif %}{# end of checking if users exist #}
</article>
</div><!-- end of div.content -->
{% from "macros/dialog.html" import dlg_prep with context %}
{{ dlg_prep(["dlg_user"]) }}
{# dlg divs below #}
<div id="dlg_user" aria-labeledby="spn_user">
<span id="spn_user">User details</span><br>
<form action="{{ url_for("main.users") }}" method="post" id="frm_user">
{{ form.csrf_token }}
{{ form.hid_user_id }}
<ul>
<li>{{ form.txt_user_id.label }}&nbsp;{{ form.txt_user_id }}</li>
<li><span style="font-size: smaller;">(leave both blank if editing, unless both match, to then reset password)</span><br>
{{ form.txt_password.label }}&nbsp;{{ form.txt_password }}</li>
<li>{{ form.txt_password_confirm.label }}&nbsp;{{ form.txt_password_confirm }}</li>
<li>{{ form.chk_admin }}&nbsp;{{ form.chk_admin.label }}</li>
<li>{{ form.chk_capture }}&nbsp;{{ form.chk_capture.label }}</li>
</ul>
<input type="submit" name="btn_save" value="Save">
</form>
</div><!-- end of dlg_user -->
<script type="text/javascript">
$(document).ready( function() {

try {

var s_dlg_user = $("#dlg_user").html();

$("#a_add_user").click( function(event) {
    event.preventDefault();
    $("#dlg_user").html(s_dlg_user);
    $("#dlg_user").redraw();
    $("#dlg_user").dialog("open");
});// end of a_add_user click event

$("#tbl_users").on("click", ".a_edit_user", function(event) {
    event.preventDefault();
    var s_id = String($(this).attr("href")).replace("#", "");
    var s_url = "{{ url_for("main.user_details", i_user_id=99999) }}".replace("99999", s_id);
    $.get(s_url, function(o_data) {
        if (typeof(o_data)=="object") {
            $("#dlg_user").html(s_dlg_user);
            $("#dlg_user").redraw();
            $("#hid_user_id").val(s_id);
            $("#txt_user_id").val(o_data.v_user_id);
            $("#chk_admin").prop("checked", o_data.bl_admin);
            $("#chk_capture").prop("checked", o_data.bl_capture);
            $("#dlg_user").redraw();
            $("#dlg_user").dialog("open");
        }// end of typeof check against o_data
    });// end of .get
});// end of .a_edit_user inside tbl_users click event

$("#tbl_users").on("click", ".a_remove_user", function(event) {
    event.preventDefault();
    var s_id = String($(this).attr("href")).replace("#", "");
    var bl_confirm = confirm("Are you sure?");
    if (bl_confirm) {
        $("#hid_remove_user_id").val(s_id);
        document.getElementById("frm_remove_user").submit();
    }// end of checking confirmation
});// end of .a_remove_user inside tbl_users click event

window.setTimeout( function() {
// do_alert("hello world");
}, 300);

} catch(e) {
    var s_err = String(e.name) + "\nmessage:" + String(e.message);
    s_err = (typeof(e.lineNumber)!="undefined") ? s_err + "\nline:" + String(e.lineNumber) : s_err;
    alert("Error! " + s_err);
}//end of catch

});// end of secondary document ready
</script>
<form action="{{ url_for("main.users") }}" method="post" id="frm_remove_user">
{{ removal_form.csrf_token }}
{{ removal_form.hid_remove_user_id }}
</form>
{% endblock %}