{% extends '_base.html' %}
{% load i18n %}
{% load static %}

{% block stylesheet %}
    {{ block.super }}
    <link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}">
    <link rel="stylesheet" type="text/css" href="{% static 'DataTables/css/jquery.dataTables.css' %}">
{% endblock stylesheet %}

{% block content %}
<div class="container-fluid">

{% block navbar %}
<nav class="navbar navbar-default">
    <div class="container-fluid">
        <div class="navbar-header">
            <a href="{% url 'dashboard' %}">
                <img src="{% static 'img/header-logo.gif' %}" height="48px" alt="Unicorn ID Manager">
            </a>
        </div>
        <ul class="nav navbar-nav navbar-right">
            <li><a href="{% url 'users' target=target.id %}">{% trans 'Users' %}</a></li>
            <li><a href="{% url 'groups' target=target.id %}">{% trans 'Groups' %}</a></li>
            <li><a href="{% url 'result' target=target.id %}">{% trans 'Result' %}</a></li>
            <li class="dropdown">
                <a href="" class="dropdown-toggle" data-toggle="dropdown">
                    {{ admin.name }}<span class="caret"></span>
                </a>
                <ul class="dropdown-menu">
                    <li><a href="{% url 'admin_password' %}">{% trans 'Change Password' %}</a></li>
                    <li><a href="/unicornidm/documentation/">{% trans 'Help' %}</a></li>
                    <li class="divider"></li>
                    <li><a href="{% url 'logout' %}">{% trans 'Logout' %}</a></li>
                </ul>
            <li>
        </ul>
    </div>
</nav>
{% endblock navbar %}

{% block breadcrumb %}
<ol class="breadcrumb">
    <li><a href="{% url 'dashboard' %}">{% trans 'Dashboard' %}</a></li>
    <li><a href="{% url 'users' target=target.id %}">{{ target.name }}</a></li>
    {% if resource.type == 'User' %}
    <li><a href="{% url 'users' target=target.id %}">{% trans 'Users' %}</a></li>
    {% elif resource.type == 'Group' %}
    <li><a href="{% url 'groups' target=target.id %}">{% trans 'Groups' %}</a></li>
    {% else %}
    <li><a href="{% url 'result' target=target.id %}">{% trans 'Result' %}</a></li>
    {% endif %}
</ol>
{% endblock breadcrumb %}

<table id="operation-table">
    <thead>
        <tr>
            <th>{% trans "Resource Type" %}</th>
            <th>{% trans "Name" %}</th>
            <th>{% trans "Operation Name" %}</th>
            <th>{% trans "Operation Result" %}</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>restype</td>
            <td>name</td>
            <td>operation</td>
            <td>result</td>
        </tr>
        <tr>
            <td>restype</td>
            <td>name</td>
            <td>operation</td>
            <td>result</td>
        </tr>
    <tbody>
</table>

</div><!-- container-fluid -->
{% endblock content %}

{% block footer_scripts %}
{{ block.super }}
<script type="application/javascript" src="{% static 'js/jquery.min.js' %}"></script>
<script type="application/javascript" src="{% static 'js/bootstrap.min.js' %}"></script>
<script type="text/javascript" charset="utf8" src="{% static 'DataTables/js/datatables.min.js' %}"></script>
<script>
$(document).ready( function () {
    $('#operation-table').DataTable({
        lengthChange: false,
        ordering: false,
        paging: false,
        searching: false,
        columns: [
            { data: "{% trans 'Name' %}"},
            { data: "{% trans 'Operation Name' %}"},
            { data: "{% trans 'Operation Result' %}"}            
        ]
    });
} );
</script>
{% endblock footer_scripts %}