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

{% block title %}{{ ta('manage_sharing', 'Manage Sharing') }}{% endblock %}
{% block selected_page %}sharing{% endblock %}
{% block selected_sub_page %}sharing_manage{% endblock %}

{% block body %}
<script>
    oTable = null;
    gDeleteSharingId = null;
    $(document).ready(function () {
        // datatable
        oTable = $('#sharingTable').dataTable($.extend(dataTableOpts, {
            "sAjaxSource": 'ajax/sharing_manage',
            "aaSorting": [[1, "desc"]],
            "aoColumns": [
                {sName: 'shared_date', sWidth: '10%', sClass: "center"},
                {sName: 'by_user', sWidth: '15%'},
                {sName: 'shared_items', sClass: "center adminResponsiveHide"},
                {sName: 'access_level', sClass: "center adminResponsiveHide"},
                {sName: 'is_global', sClass: "center adminResponsiveHide"},
                {sName: 'last_accessed', sWidth: '10%', sClass: "center adminResponsiveHide"},
                {sName: 'status_expiry', sWidth: '15%', sClass: "center adminResponsiveHide"},
                {bSortable: false, sWidth: '10%', sClass: "center"}
            ],
            "fnServerData": function (sSource, aoData, fnCallback) {
                aoData.push({"name": "filterText", "value": $('#filterText').val()});
                aoData.push({"name": "filterByStatus", "value": $('#filterByStatus').val()});
                $.ajax({
                    "dataType": 'json',
                    "type": "GET",
                    "url": sSource,
                    "data": aoData,
                    "success": fnCallback
                });
            }
        }));

        // update custom filter
        $('.dataTables_filter').html($('#customFilter').html());
        {% if addServerTrigger == true %}
            addShareForm();
        {% endif %}
    });

    function confirmRemoveSharingLink(sharingId)
    {
        $('#pleaseWait').hide();
        $('#confirmText').show();
        $('#confirmDelete').modal("show");
        gDeleteSharingId = sharingId;
    }

    function removeSharingLink()
    {
        $('#confirmText').hide();
        $('#pleaseWait').show();
        $.ajax({
            type: "POST",
            url: "ajax/sharing_manage_remove",
            data: {sharingId: gDeleteSharingId},
            dataType: 'json',
            success: function (json) {
                if (json.error == true)
                {
                    $('#pleaseWait').hide();
                    $('#confirmText').show();
                    showError(json.msg);
                } else
                {
                    showSuccess(json.msg);
                    reloadTable();
                    $("#confirmDelete").modal("hide");
                }

            },
            error: function (XMLHttpRequest) {
                $('#pleaseWait').hide();
                $('#confirmText').show();
                showError(XMLHttpRequest.responseText);
            }
        });
    }

    function loadAddShareForm()
    {
        $('#addSharingForm').html({{ ta('loading_dots', 'Loading...')|json_encode()|raw }});
        $.ajax({
            type: "POST",
            url: "ajax/sharing_manage_add_form",
            data: {},
            dataType: 'json',
            success: function (json) {
                if (json.error == true)
                {
                    $('#addSharingForm').html(json.msg);
                } else
                {
                    $('#addSharingForm').html(json.html);
                    updateFolderSelect();

                    // date picker
                    $('#expiryDate').daterangepicker({
                        singleDatePicker: true,
                        calender_style: "picker_1",
                        autoUpdateInput: false,
                        locale: {
                            format: 'MMMM D, YYYY'
                        }
                    }, function(chosen_date) {
                        $('#expiryDate').val(chosen_date.format('MMMM D, YYYY'));
                    });
                }

            },
            error: function (XMLHttpRequest) {
                $('#addSharingForm').html(XMLHttpRequest.responseText);
            }
        });
    }

    function processAddSharing()
    {
        // get data
        $.ajax({
            type: "POST",
            url: "ajax/sharing_manage_add_process",
            data: {
                created_by_user_id: $('#created_by_user_id').val(),
                folder_id: $('#folder_id').val(),
                shared_with_user_id: $('#shared_with_user_id').val(),
                share_permission_level: $('#share_permission_level').val(),
                expiryDate: $('#expiryDate').val()
            },
            dataType: 'json',
            success: function (json) {
                if (json.error == true)
                {
                    showError(json.msg, 'popupMessageContainer');
                } else
                {
                    showSuccess(json.msg);
                    reloadTable();
                    $("#addShareForm").modal("hide");
                }
            },
            error: function (XMLHttpRequest) {
                showError(XMLHttpRequest.responseText, 'popupMessageContainer');
            }
        });

    }

    function updateFolderSelect()
    {
        // update dropdown while loading
        $('#folder_id').html('<option value="">{{ ta('loading_dots', 'Loading...') }}</option>');

        // get data
        $.ajax({
            type: "POST",
            url: "ajax/sharing_manage_add_get_folder_listing",
            data: {
                created_by_user_id: $('#created_by_user_id').val()
            },
            dataType: 'json',
            success: function (json) {
                $('#folder_id').html(json.html);
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                showError(XMLHttpRequest.responseText, 'popupMessageContainer');
            }
        });
    }

    function addShareForm()
    {
        loadAddShareForm();
        $('#addShareForm').modal("show");
    }

    function reloadTable()
    {
        oTable.fnDraw(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>{{ ta('manage_shared_items', 'Manage Shared Items') }}</h2>
                        <div class="clearfix"></div>
                    </div>
                    <div class="x_content">
                        <table id="sharingTable" class="table table-striped table-only-border dtLoading bulk_action">
                            <thead>
                                <tr>
                                    <th>{{ ta("shared_date", "Date Shared") }}</th>
                                    <th>{{ ta("by_to_user", "By / To User") }}</th>
                                    <th>{{ ta("shared_items", "Shared Items") }} *</th>
                                    <th>{{ ta("access_level", "Access Level") }}</th>
                                    <th>{{ ta("is_global_share", "Is Global Share") }}</th>
                                    <th>{{ ta("last_accessed", "Last Accessed") }}</th>
                                    <th>{{ ta("status_expiry", "Status / Expiry") }}</th>
                                    <th>{{ ta("action", "Action") }}</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td colspan="20">{{ ta('admin_loading_data', 'Loading data...') }}</td>
                                </tr>
                            </tbody>
                        </table>

                        <div class="clear"><br/></div>
                        <p>{{ ta('shared_item_counts_include_all_folders_but_only_files_at_the_root_level', '* Shared item counts include all folders but only files at the root level.') }}</p>
                    </div>
                </div>

                <div class="x_panel">
                    <div class="btn-group pull-left">
                        <a href="#" type="button" class="btn btn-primary" onClick="addShareForm(); return false;">{{ ta('create_share', 'Create Share') }}</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="customFilter" id="customFilter" style="display: none;">
    <label>
        {{ ta('filter_results', 'Filter Results') }}:
        <input name="filterText" id="filterText" type="text" class="form-control" onKeyUp="reloadTable(); return false;" style="width: 160px;"/>
    </label>
    <label class="adminResponsiveHide" style="padding-left: 6px;">
        {{ ta('by_status', 'By Status') }}:
        <select name="filterByStatus" id="filterByStatus" onChange="reloadTable();
                return false;" style="width: 120px;" class="form-control">
            <option value="">- {{ ta('all', 'all') }} -</option>
            {% for k,statusDetail in statusDetails %}
                <option value="{{ k }}"{{ filterByStatus == k?' SELECTED':'' }}>{{ statusDetail|title }}</option>
            {% endfor %}
        </select>
    </label>
</div>

<div id="addShareForm" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header"><button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span></button></div>
            <div class="modal-body" id="addSharingForm"></div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">{{ ta('cancel', 'Cancel') }}</button>
                <button type="button" class="btn btn-primary" onClick="processAddSharing(); return false;">{{ ta('create_share', 'Create Share') }}</button>
            </div>
        </div>
    </div>
</div>

<div id="confirmDelete" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header"><button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span></button></div>
            <div class="modal-body" id="removeSharingLinkForm">
                <div class="x_panel">
                    <span id="confirmText">
                        <div class="x_title">
                            <h2>{{ ta('confirm_sharing_link_removal', 'Confirm Sharing Link Removal') }}</h2>
                            <div class="clearfix"></div>
                        </div>
                        <div class="x_content">
                            <p>{{ ta('are_you_sure_you_want_to_remove_the_sharing_link', 'Are you sure you want to remove the sharing link?') }}</p>
                        </div>
                    </span>
                    <span id="pleaseWait">
                        {{ ta('removing_please_wait', 'Removing, please wait...') }}
                    </span>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">{{ ta('cancel', 'Cancel') }}</button>
                <button type="button" class="btn btn-primary" onClick="removeSharingLink(); return false;">{{ ta('confirm', 'Confirm') }}</button>
            </div>
        </div>
    </div>
</div>
{% endblock %}