{% extends "base.html" %}
{% block content %}

<div id="admin">

    <style>
        DIV.table {
        display:table;
        }
        .tr {
        display:table-row;
        }
        SPAN.td {
        padding: 10px;
        display:table-cell;
        }

        .padding {
        padding-left: 10px;
        }
    </style>

    <div id="add-user-div">
        <h3>Add New User:</h3>
        {{email-error}}
        <form action="/admin/user/add" method="POST" role="form" class="form-inline">
            <input name="__anti-forgery-token" type="hidden" value="{{af-token}}"/>

            <div class="form-group">
                <label for="email">Email</label>
                {% if email-error %}
                <div id="email-error" class="alert alert-danger">{{email-error}}</div>
                {% endif %}
                <input class="form-control" id="email" name="email" tabindex="1" type="text" autocomplete="off"
                       placeholder="Email" {% if email %} value="{{email}}" {% endif %}/>
            </div>

            <div class="form-group">
                <label for="password">Password</label>
                {% if pass-error %}
                <div id="pass-error" class="alert alert-danger">{{pass-error}}</div>
                {% endif %}
                <input class="form-control" id="password" name="password" tabindex="2" type="password"
                       placeholder="Password" autocomplete="off"/>
            </div>

            <div class="form-group">
                <label for="confirm">Confirm Password</label>

                {% if confirm-error %}
                <div id="confirm-error" class="alert alert-danger">{{confirm-error}}</div>
                {% endif %}
                <input class="form-control" id="confirm" name="confirm" tabindex="3" type="password"
                       placeholder="Confirm Password" autocomplete="off"/>
            </div>

            <button class="btn btn-primary" tabindex="4" type="submit">Add User</button>
        </form>
    </div>

    <hr />

    <form class="form-inline padding" role="form" action="/admin/users" method="GET">
        <input name="__anti-forgery-token" type="hidden" value="{{af-token}}"/>
        <div class="form-group">
            <label class="sr-only" for="username-filter">Username</label>
            <input type="text" class="form-control" id="username-filter" name="filter" placeholder="Enter Username">
        </div>
        <button type="submit" class="btn btn-default">Filter Users</button>
    </form>

    <br />

    <div class="table" field="table">
        <div class="tr" field="table-header-row">
            <span class="td" field="header-entry"><b>Username</b></span>
            <span class="td" field="header-entry"><b>Role</b></span>
            <span class="td" field="header-entry"><b>Active?</b></span>
        </div>

        {% for user in users %}
        <form field="user-row" class="tr" method="post" action="/admin/user/update">
            <input name="__anti-forgery-token" type="hidden" value="{{af-token}}"/>
            <input type="hidden" field="username-hidden" name="username" value="{{user.email}}"/>
            <span field="username" class="td">{{user.email}}</span>
                <span field="role" class="td">
                    <select field="role-select" name="role">
                        {% for role in roles %}
                        <option value="{{role}}" {% ifequal role user.role %} selected {% endifequal %}
                                {% if user.role|empty? %} selected {% endif %}>{{role}}</option>
                        {% endfor %}
                    </select>
                </span>
                <span field="active" class="td">
                    <input type="checkbox" name="active" {% if user.is_active %} checked {% endif %}></span>
            <span field="submit" class="td"><input type="submit" value="Update User" class="btn btn-primary"></span>
        </form>
        {% endfor %}
    </div>
</div>

{% endblock %}