{% extends 'base.html.twig' %}

{% block title %}Statistic administration{% endblock %}

{% block stylesheets %}
    {{ parent() }}
{% endblock %}

{% block content %}

    <header class="content__title">
        <h1>Statistic administration</h1>
    </header>


    <div class="card">
        <div class="card-body">
            <h4 class="card-title">Access rights</h4>
            <h6 class="card-subtitle">Please set the access rights of the users here. You can not change the rights of administrators</h6>

            <div class="table-responsive data-table">
                <table id="data-table" class="table">
                    <thead>
                    <tr>
                        <th>User</th>
                        {% for statisticType in statisticTypes %}
                        <th>{{ statisticType.getTitle }} - form</th>
                        <th>{{ statisticType.getTitle }} - analysis</th>
                        {% endfor %}
                    </tr>
                    </thead>
                    <tbody>
                    {% for user in userList %}
                    <tr>
                        <td>{{ user.getName }}</td>
                        {% for statisticType in statisticTypes %}
                            {% for type in ['form','analysis'] %}
                                {% set inputId = 'switch_' ~ user.getId ~ '_' ~ statisticType.getId ~ '_' ~ type %}

                                <td>
                                {% if user.hasRole('ROLE_OWNER') or user.hasRole('ROLE_ADMIN') %}

                                    <div class="form-group">
                                        <div class="toggle-switch toggle-switch--blue">
                                            <input type="checkbox" class="toggle-switch__checkbox" disabled checked>
                                            <i class="toggle-switch__helper"></i>
                                        </div>
                                    </div>

                                {% else %}

                                    <div class="form-group">
                                        <div class="toggle-switch toggle-switch--green">
                                            <input
                                                    type="checkbox"
                                                    id="{{ inputId }}"
                                                    data-user="{{ user.getId }}"
                                                    data-statistictype="{{ statisticType.getId }}"
                                                    data-type="{{ type }}"
                                                    class="toggle-switch__checkbox statistic-user-checkbox"
                                                    {% if user.hasStatisticTypeAccessTo(statisticType, type) %}checked{% endif %}>
                                            <i class="toggle-switch__helper"></i>
                                        </div>
                                    </div>

                                {% endif %}
                                </td>

                            {% endfor %}
                        {% endfor %}
                    </tr>
                    {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>
    </div>

    {#% include 'footer.html.twig' %#}
{% endblock %}

{% block javascripts %}
    {{ parent() }}

    <script src="{{ asset('resources/vendors/datatables/jquery.dataTables.min.js') }}"></script>
    <script src="{{ asset('resources/vendors/datatables/datatables-buttons/dataTables.buttons.min.js') }}"></script>
    <script src="{{ asset('resources/vendors/datatables/datatables-buttons/buttons.print.min.js') }}"></script>
    <script src="{{ asset('resources/vendors/jszip/jszip.min.js') }}"></script>
    <script src="{{ asset('resources/vendors/datatables/datatables-buttons/buttons.html5.min.js') }}"></script>

    <script>
        $('.statistic-user-checkbox').change(function() {
            var user = $(this).data('user');
            var statisticType = $(this).data('statistictype');
            var type = $(this).data('type');

            $.ajax({
                type: "POST",
                url: "{{ path('statistic_toggle_statistic_user') }}",
                data: {
                    userId: user,
                    statisticTypeId: statisticType,
                    type: type
                },
                success:function(data) {

                },
                error:function(data) {

                },
            });

        });
    </script>
{% endblock %}