{% extends "page.html" %}

{% macro th(label, key='', colspan=1) %}
<th data-sort="{{key}}" colspan="{{colspan}}">{{label}}
  {% if key %}
  <a href="#"><i class="fa {% if sort.get(key) == 'asc' -%}
                               fa-sort-asc
                           {%- elif sort.get(key) == 'desc' -%}
                               fa-sort-desc
                           {%- else -%}
                               fa-sort
                           {%- endif %} sort-icon">
  </i></a>
  {% endif %}
</th>
{% endmacro %}

{% block main %}

<div class="container">
  <table class="table table-striped">
    <thead>
      <tr>
        {% block thead %}
        {{ th("User (%i)" % users|length, 'name') }}
        {{ th("Admin", 'admin') }}
        {{ th("Last Seen", 'last_activity') }}
        {{ th("Running (%i)" % running|length, 'running', colspan=2) }}
        {% endblock thead %}
      </tr>
    </thead>
    <tbody>
      <tr class="user-row add-user-row">
        <td colspan="12">
          <a id="add-users" role="button" class="col-xs-2 btn btn-default">Add Users</a>
          <span class="col-xs-offset-4 col-xs-3">
            <a id="start-all-servers" role="button" class="btn btn-primary col-xs-5 col-xs-offset-1">Start All</a>
            <a id="stop-all-servers" role="button" class="btn btn-danger col-xs-5 col-xs-offset-1">Stop All</a>
          </span>
          <a id="shutdown-hub" role="button" class="col-xs-2 col-xs-offset-1 btn btn-danger">Shutdown Hub</a>
        </td>
      </tr>
  {% for u in users %}
    <tr class="user-row" data-user="{{u.name}}" data-admin="{{u.admin}}">
      {% block user_row scoped %}
      <td class="name-col col-sm-2">{{u.name}}</td>
      <td class="admin-col col-sm-2">{% if u.admin %}admin{% endif %}</td>
      <td class="time-col col-sm-3">
        {%- if u.last_activity -%}
        {{ u.last_activity.isoformat() + 'Z' }}
        {%- else -%}
        Never
        {%- endif -%}
      </td>
      <td class="server-col col-sm-2 text-center">
        <a role="button" class="stop-server btn btn-xs btn-danger {% if not u.running %}hidden{% endif %}">stop server</a>
        <a role="button" class="start-server btn btn-xs btn-primary {% if u.running %}hidden{% endif %}">start server</a>
      </td>
      <td class="server-col col-sm-1 text-center">
        {% if admin_access %}
        <a role="button" class="access-server btn btn-xs btn-primary {% if not u.running %}hidden{% endif %}">access server</a>
        {% endif %}
      </td>
      <td class="edit-col col-sm-1 text-center">
        <a role="button" class="edit-user btn btn-xs btn-primary">edit</a>
      </td>
      <td class="edit-col col-sm-1 text-center">
        {% if u.name != user.name %}
        <a role="button" class="delete-user btn btn-xs btn-danger">delete</a>
        {% endif %}
      </td>
      {% endblock user_row %}
    </tr>
  {% endfor %}
  </tbody>
  </table>
</div>

{% call modal('Delete User', btn_class='btn-danger delete-button') %}
  Are you sure you want to delete user <span class="delete-username">USER</span>?
  This operation cannot be undone.
{% endcall %}

{% call modal('Stop All Servers', btn_label='Stop All', btn_class='btn-danger stop-all-button') %}
  Are you sure you want to stop all your users' servers? Kernels will be shutdown and unsaved data may be lost.
{% endcall %}

{% call modal('Start All Servers', btn_label='Start All', btn_class='btn-primary start-all-button') %}
  Are you sure you want to start all servers? This can slam your server resources.
{% endcall %}

{% call modal('Shutdown Hub', btn_label='Shutdown', btn_class='btn-danger shutdown-button') %}
  Are you sure you want to shutdown the Hub?
  You can choose to leave the proxy and/or single-user servers running by unchecking the boxes below:
  <div class="checkbox">
    <label>
      <input type="checkbox" class="shutdown-proxy-checkbox">Shutdown proxy
    </label>
  </div>
  <div class="checkbox">
    <label>
      <input type="checkbox" class="shutdown-servers-checkbox">Shutdown single-user-servers
    </label>
  </div>
{% endcall %}

{% macro user_modal(name, multi=False) %}
{% call modal(name, btn_class='btn-primary save-button') %}
<div class="form-group">
  <{%- if multi -%}
    textarea
    {%- else -%}
    input type="text"
    {%- endif %}
    class="form-control username-input"
    placeholder="{%- if multi -%} usernames separated by lines{%- else -%} username {%-endif-%}">
  {%- if multi -%}</textarea>{%- endif -%}
</div>
<div class="checkbox">
  <label>
    <input type="checkbox" class="admin-checkbox">Admin
  </label>
</div>
{% endcall %}
{% endmacro %}

{{ user_modal('Edit User') }}

{{ user_modal('Add Users', multi=True) }}

{% endblock %}

{% block script %}
{{ super() }}
<script type="text/javascript">
require(["admin"]);
</script>
{% endblock %}
