{% extends "admin/partial/layout_logged_in.html.twig" %}

{% block title %}Manage Users{% endblock %}
{% block selected_page %}users{% endblock %}
{% block selected_sub_page %}user_manage{% endblock %}

{% block body %}
    <script>
        oTable = null;
        gUserId = null;
        oldStart = 0;
        $(document).ready(function () {
            // datatable
            oTable = $('#userTable').dataTable({
                "sPaginationType": "full_numbers",
                "bServerSide": true,
                "bProcessing": true,
                "sAjaxSource": 'ajax/user_manage',
                "iDisplayLength": 25,
                "aaSorting": [[1, "asc"]],
                "aoColumns": [
                    {bSortable: false, sWidth: '3%', sName: 'file_icon', sClass: "center adminResponsiveHide"},
                    {sName: 'username'},
                    {sName: 'email_address', sClass: "adminResponsiveHide"},
                    {sName: 'account_type', sWidth: '9%', sClass: "center adminResponsiveHide"},
                    {sName: 'last_login', sWidth: '15%', sClass: "center adminResponsiveHide"},
                    {sName: 'space_used', sWidth: '9%', sClass: "center adminResponsiveHide"},
                    {sName: 'total_files', sWidth: '8%', sClass: "center adminResponsiveHide"},
                    {sName: 'status', sWidth: '9%', sClass: "center adminResponsiveHide"},
                    {bSortable: false, sWidth: '18%', sClass: "center dataTableFix responsiveTableColumn"}
                ],
                "fnServerData": function (sSource, aoData, fnCallback, oSettings) {
                    setTableLoading();
                    if (oSettings._iDisplayStart != oldStart) {
                        var targetOffset = $('.dataTables_wrapper').offset().top - 10;
                        $('html, body').animate({scrollTop: targetOffset}, 300);
                        oldStart = oSettings._iDisplayStart;
                    }
                    aoData.push({"name": "filterText", "value": $('#filterText').val()});
                    aoData.push({"name": "filterByAccountType", "value": $('#filterByAccountType').val()});
                    aoData.push({"name": "filterByAccountStatus", "value": $('#filterByAccountStatus').val()});
                    aoData.push({"name": "filterByAccountId", "value": $('#filterByAccountId').val()});
                    $.ajax({
                        "dataType": 'json',
                        "type": "GET",
                        "url": sSource,
                        "data": aoData,
                        "success": fnCallback
                    });
                },
                "fnDrawCallback": function (oSettings) {
                    postDatatableRender();
                },
                "oLanguage": {
                    "sEmptyTable": "There are no files in the current filters."
                },
                dom: "lBfrtip",
                buttons: [
                    {
                        extend: "copy",
                        className: "btn-sm"
                    },
                    {
                        extend: "csv",
                        className: "btn-sm"
                    },
                    {
                        extend: "excel",
                        className: "btn-sm"
                    },
                    {
                        extend: "pdfHtml5",
                        className: "btn-sm"
                    },
                    {
                        extend: "print",
                        className: "btn-sm"
                    }
                ]
            });

            // update custom filter
            $('.dataTables_filter').html($('#customFilter').html());
        });

        function reloadTable()
        {
            oTable.fnDraw(false);
        }

        function confirmRemoveUser(userId)
        {
            showBasicModal('<p>Are you sure you want to permanently remove this user? All files and data relating to the user will be removed. This can not be undone.</p>', 'Remove User', '<button type="button" class="btn btn-primary" data-dismiss="modal" onClick="removeUser(' + userId + '); return false;">Remove</button>');
            return false;
        }

        function confirmApproveUser(userId)
        {
            showBasicModal('<p>Are you sure you want to approve this user account? The user will be notified via email after approval.</p>', 'Approve User', '<button type="button" class="btn btn-primary" data-dismiss="modal" onClick="approveUser(' + userId + '); return false;">Approve</button>');
            return false;
        }

        function approveUser(userId)
        {
            // get server list for deleting all files
            $.ajax({
                type: "POST",
                url: "ajax/user_approve",
                data: {userId: userId},
                dataType: 'json',
                success: function (json) {
                    if (json.error == true)
                    {
                        showError(json.msg);
                    } else
                    {
                        showSuccess(json.msg);
                        reloadTable();
                    }
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    showError('Failed connecting to server, please try again later.');
                }
            });
        }

        function confirmDeclineUser(userId)
        {
            showBasicModal('<p>Are you sure you want to decline this user account? The account will be removed and the user notified of the non-approval via email.</p>', 'Decline User', '<button type="button" class="btn btn-primary" data-dismiss="modal" onClick="declineUser(' + userId + '); return false;">Decline</button>');
            return false;
        }

        function declineUser(userId)
        {
            // get server list for deleting all files
            $.ajax({
                type: "POST",
                url: "ajax/user_decline",
                data: {userId: userId},
                dataType: 'json',
                success: function (json) {
                    if (json.error == true)
                    {
                        showError(json.msg);
                    } else
                    {
                        showSuccess(json.msg);
                        reloadTable();
                    }
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    showError('Failed connecting to server, please try again later.');
                }
            });
        }

        function removeUser(userId)
        {
            userDeleteConfirm(userId);
        }
        
        function userDeleteConfirm(userId)
        {
            // delete actual user
            $.ajax({
                type: "POST",
                url: "ajax/user_remove",
                data: {userId: userId},
                dataType: 'json',
                success: function (json) {
                    // compile result
                    if (json.error == true)
                    {
                        showError(json.msg);
                    } else
                    {
                        showSuccess(json.msg);
                    }
                    userDeleteFinish();
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    showError('Failed deleting user, please try again later.');
                    userDeleteFinish();
                }
            });
        }

        function userDeleteFinish()
        {
            reloadTable();

            // scroll to the top of the page
            $("html, body").animate({scrollTop: 0}, "slow");
        }

        function confirmImpersonateUser(userId)
        {
            if (confirm("Are you sure you want to login as this user account? You'll have access to their account as they would see it.\n\nWhen you logout of the impersonated user, you'll be reverted to this admin user account again."))
            {
                window.location = "user_manage?impersonate=" + userId;
                return true;
            }

            return false;
        }
    </script>

    <!-- page content -->
    <div class="right_col" role="main">
        <div class="">
            <div class="page-title">
                <div class="title_left">
                    <h3>{{ block('title') }}</h3>
                </div>
            </div>
            <div class="clearfix"></div>

            {{ msg_page_notifications|raw }}

            <div class="row">
                <div class="col-md-12 col-sm-12 col-xs-12">
                    <div class="x_panel">
                        <div class="x_title">
                            <h2>User List</h2>
                            <div class="clearfix"></div>
                        </div>
                        <div class="x_content">
                            <table id="userTable" class="table table-striped table-only-border dtLoading bulk_action">
                                <thead>
                                    <tr>
                                        <th></th>
                                        <th class="align-left">{{ t('username', 'Username') }}</th>
                                        <th>{{ t('email_address', 'Email Address') }}</th>
                                        <th>{{ t('type', 'Type') }}</th>
                                        <th class="align-left">{{ t('last_login', 'Last Login') }}</th>
                                        <th class="align-left">{{ t('space_used', 'HD Used') }}</th>
                                        <th>{{ t('files', 'Files') }}</th>
                                        <th>{{ t('status', 'Status') }}</th>
                                        <th class="align-left">{{ t('actions', 'Actions') }}</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td colspan="20">{{ t('admin_loading_data', 'Loading data...') }}</td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>

                    <div class="x_panel">
                        <div class="btn-group">
                            <div class="dropup">
                                <a href="user_add" class="btn btn-default dropdown-toggle" type="button">
                                    Add User
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="customFilter" id="customFilter" style="display: none;">
        <label>
            Filter Results:
            <input name="filterText" id="filterText" type="text" class="form-control" value="{{ filterText }}" onKeyUp="reloadTable();
                return false;" style="width: 160px;"/>
        </label>
        <label class="adminResponsiveHide" style="padding-left: 6px;">
            By Type:
            <select name="filterByAccountType" id="filterByAccountType" onChange="reloadTable();
                return false;" style="width: 160px;" class="form-control">
                <option value="">- all -</option>
                {% for accountTypeDetail in accountTypeDetails %}
                    <option value="{{ accountTypeDetail['id'] }}"{{ filterByAccountType == accountTypeDetail['id']?' SELECTED':'' }}>{{ accountTypeDetail['label']|title }}</option>
                {% endfor %}
            </select>
        </label>
        <label class="adminResponsiveHide" style="padding-left: 6px;">
            By Status:
            <select name="filterByAccountStatus" id="filterByAccountStatus" onChange="reloadTable();
                return false;" style="width: 120px;" class="form-control">
                <option value="">- all -</option>
                {% for accountStatusDetail in accountStatusDetails %}
                    <option value="{{ accountStatusDetail }}"{{ filterByAccountStatus == accountStatusDetail?' SELECTED':'' }}>{{ accountStatusDetail|title }}</option>
                {% endfor %}
            </select>
        </label>
        <input type="hidden" value="{{ filterByAccountId }}" name="filterByAccountId" id="filterByAccountId"/>
    </div>
{% endblock %}