{% include 'header.html' %}
<link rel="stylesheet" href="{{ url_for('static', filename='css/serverusers.css') }}"> {% include 'wrapper.html' %}

<div class="users">
    {% for user in users%}
    <div class="user-box">
        <form enctype="multipart/form-data" action="{{ url_for('uploadManagmentUserPicture') }}" method="POST">
            <div class="icon" style="background-image: url(/static/pics/profiles/{{ user[3] }});">
                <input class="image-btn" type="file" onchange="form.submit()" name="profilePicture-{{ user[0] }}">
            </div>
        <div class="prop">
            <input type="hidden" class="user-id" value="{{ user[0] }}">
            <div class="name" onclick="editName(this)">{{ user[1] }}</div>
            <input type="text" class="name input input-name">
            <div class="password" onclick="editPassword(this)">{{ user[2] }}</div>
            <input type="text" class="password input input-password"><br style="display: none;">
            <div class="delete" onclick="deleteUser(this.parentElement.parentElement,this)"><a href="#"><i class="fa fa-trash"></i></a></div>
        </div>
        </form>
    </div>

    {% endfor %}
    <div class="user-box">
        <form action="{{ url_for('add_user') }}" method="POST">
            <div class="icon"><button type="submit" class="add-user-btn">Add User</button></div>
            <div class="prop">
                <input type="text" name="username" class="name input input-name" style="display: inline-block;" placeholder="Username" required><br>
                <input type="text" name="password" class="password input input-password" style="display: inline-block; margin-top: 5px;" placeholder="Password" minlength="8" required><br>
            </div>
        </form>
    </div>
</div>

{% include 'wrapper_end.html' %}
<script>
    key_sc($(".input-name"), 'n');
    key_sc($(".input-name"), 'c');
</script>
<script src="{{ url_for('static', filename='js/serverusers.js') }}"></script>
{% include 'footer.html' %}