{% load static %}
{% load i18n %}

<link rel="stylesheet" type="text/css" href="{% static "cerberus_ac/datatables/datatables.min.css" %}"/>
<script type="text/javascript" src="{% static "cerberus_ac/datatables/datatables.min.js" %}"></script>

<script type="text/javascript" language="javascript" class="init">

$(document).ready( function () {
    $('#editprivtable').DataTable({
        paging: true,
        scrollX: true,
        serverSide: true,
        processing: true,
        autoWidth: true,
        deferRender: true,
        ajax: {
            url: "{% url 'admin:cerberus:edit_privileges_json' role_type=box.context.role_type resource_type=box.context.resource_type %}",
            type: "POST",
            dataFilter: function(data) {
                var json = jQuery.parseJSON(data);
                return JSON.stringify(json)
            }
        }
    });
} );

$('.collapse').on('show.bs.collapse', function () {
    $('.collapse.in').collapse('hide');
});

</script>

<style>

    button.btn-check-success {
      background: #95d394; /* Old browsers */
      background: -moz-linear-gradient(top, #b2ecb2, #92cd96); /* FF3.6-15 */
      background: -webkit-linear-gradient(top, #b2ecb2, #92cd96); /* Chrome10-25,Safari5.1-6 */
      background: linear-gradient(top, #b2ecb2, #92cd96); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b2ecb2', endColorstr='#92cd96',GradientType=0 ); /* IE6-9 */
    }
    button.btn-check-default {
      background: #faffff; /* Old browsers */
      background: -moz-linear-gradient(top, #faffff, #faffff); /* FF3.6-15 */
      background: -webkit-linear-gradient(top, #faffff, #faffff); /* Chrome10-25,Safari5.1-6 */
      background: linear-gradient(top, #faffff, #faffff); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#faffff', endColorstr='#faffff',GradientType=0 ); /* IE6-9 */
    }
    button.btn-check-danger {
      background: #d68489; /* Old browsers */
      background: -moz-linear-gradient(top, #e59998, #e88b7f); /* FF3.6-15 */
      background: -webkit-linear-gradient(top, #e59998, #e88b7f); /* Chrome10-25,Safari5.1-6 */
      background: linear-gradient(top, #e59998, #e88b7f); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e59998', endColorstr='#e88b7f',GradientType=0 ); /* IE6-9 */
    }

    button.active.btn-check-success {
      background: #17e71a; /* Old browsers */
      background: -moz-linear-gradient(top, #2ce42b, #23e927); /* FF3.6-15 */
      background: -webkit-linear-gradient(top, #2ce42b, #23e927); /* Chrome10-25,Safari5.1-6 */
      background: linear-gradient(top, #2ce42b, #23e927); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2ce42b', endColorstr='#23e927',GradientType=0 ); /* IE6-9 */
    }
    button.active.btn-check-default {
      background: #ffffff; /* Old browsers */
      background: -moz-linear-gradient(top, #ffffff, #ffffff); /* FF3.6-15 */
      background: -webkit-linear-gradient(top, #ffffff, #ffffff); /* Chrome10-25,Safari5.1-6 */
      background: linear-gradient(top, #ffffff, #ffffff); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
    }
    button.active.btn-check-danger {
      background: #e72f26; /* Old browsers */
      background: -moz-linear-gradient(top, #ee1f1e, #de1914); /* FF3.6-15 */
      background: -webkit-linear-gradient(top, #ee1f1e, #de1914); /* Chrome10-25,Safari5.1-6 */
      background: linear-gradient(top, #ee1f1e, #de1914); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ee1f1e', endColorstr='#de1914',GradientType=0 ); /* IE6-9 */
    }
</style>

<table id="editprivtable" class="display">
    <thead>
        <tr>
            <th>User</th>
{#            {% for r in box.context.resources %}#}
{#                <th>{{ r }}</th>#}
{#            {% endfor %}#}
        </tr>
    </thead>
    <tbody>
    <!--{% for m in box.context.roles %}-->
        <form action="{% url "admin:cerberus:edit_privileges_post" user=m.id %}" method="POST">
            <tr data-toggle="collapse" data-target=".userrow{{ m.id }}">
                <td style="text-align: right" class="span5">
                    {{ m.username }}
                    <input type="submit" value="Save" name="submit_{{ m.id }}"/>
                    <input type="submit" value="Inherited" name="inherited_{{ m.id }}"/>
                </td>
{#                <!--{% for r in box.context.resources %}-->#}
                    <td></td>
{#                <!--{% endfor %}-->#}
            </tr>
            <tr>
                <td class="hiddenRow">
                    <div id="userrow{{ m.id }}" class="collapse userrow{{ m.id }}">
                        ID : {{ m.id }}<br>
                        Groups: {{ m.get_groups }}<br>
                        Username : {{ m.username }}<br>
                        Mail : {{ m.email }} <br>
                        Active : {{ m.is_active }}<br>
                        Last login: {{ m.last_login }}<br>
                        Register date: {{ m.date_joined }}<br>
                    </div>
                </td>
{#                <!--{% for r in box.context.resources %}-->#}
{#                    <td class="hiddenRow " >#}
{#                        <div class="row">#}
{#                            <div class="collapse userrow{{ m.id }}" style="text-align: right">#}
{#                              <div>{% trans "Create" %}#}
{#                                <div id="update_{{ m.id }}_{{ r.id }}" class="btn-group" data-toggle="buttons-radio">#}
{#                                    <button class="btn btn-check-success" id="allow_create_{{ m.id }}_{{ r.id }}" type="button"></button>#}
{#                                    <button class="btn btn-check-default" id="default_create_{{ m.id }}_{{ r.id }}" type="button"></button>#}
{#                                    <button class="btn btn-check-danger" id="deny_create_{{ m.id }}_{{ r.id }}" type="button"></button>#}
{#                                </div></div>#}
{#                              <div>{% trans "Read" %}#}
{#                                <div id="read_{{ m.id }}_{{ r.id }}" class="btn-group" data-toggle="buttons-radio">#}
{#                                    <button class="btn btn-check-success" id="allow_read_{{ m.id }}_{{ r.id }}" type="button"></button>#}
{#                                    <button class="btn btn-check-default" id="default_read_{{ m.id }}_{{ r.id }}" type="button"></button>#}
{#                                    <button class="btn btn-check-danger" id="deny_read_{{ m.id }}_{{ r.id }}" type="button"></button>#}
{#                                </div></div>#}
{#                              <div>{% trans "Update" %}#}
{#                                <div id="update_{{ m.id }}_{{ r.id }}" class="btn-group" data-toggle="buttons-radio">#}
{#                                    <button class="btn btn-check-success" id="allow_update_{{ m.id }}_{{ r.id }}" type="button"></button>#}
{#                                    <button class="btn btn-check-default" id="default_update_{{ m.id }}_{{ r.id }}" type="button"></button>#}
{#                                    <button class="btn btn-check-danger" id="deny_update_{{ m.id }}_{{ r.id }}" type="button"></button>#}
{#                                </div></div>#}
{#                              <div>{% trans "Delete" %}#}
{#                                <div id="delete_{{ m.id }}_{{ r.id }}" class="btn-group" data-toggle="buttons-radio">#}
{#                                    <button class="btn btn-check-success" id="allow_delete_{{ m.id }}_{{ r.id }}" type="button"></button>#}
{#                                    <button class="btn btn-check-default" id="default_delete_{{ m.id }}_{{ r.id }}" type="button"></button>#}
{#                                    <button class="btn btn-check-danger" id="deny_delete_{{ m.id }}_{{ r.id }}" type="button"></button>#}
{#                                </div></div>#}
{#                            </div>#}
{#                        </div>#}
{#                    </td>#}
{##}
{#                <!--{% endfor %}-->#}
                </tr>
            </form>
        <!--{% endfor %}-->
        </tbody>
    <tfoot>
        </tfoot>
</table>
