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

{% block title %}{{ ta('manage_banned_ip_addresses', 'Manage Banned IP Addresses') }}{% endblock %}
{% block selected_page %}configuration{% endblock %}
{% block selected_sub_page %}configuration{% endblock %}

{% block body %}
<script>
    oTable = null;
    gBannedIpId = null;
    $(document).ready(function(){
        // datatable
        oTable = $('#fileTable').dataTable($.extend(dataTableOpts, {
            "sAjaxSource": 'ajax/banned_ip_manage',
            "aaSorting": [[ 1, "asc" ]],
            "aoColumns" : [   
                { bSortable: false, sWidth: '3%', sName: 'file_icon', sClass: "center adminResponsiveHide" },
                { sName: 'ip_address', sWidth: '20%' },
                { sName: 'date_banned', sWidth: '12%', sClass: "adminResponsiveHide" },
                { sName: 'ban_type', sWidth: '10%', sClass: "adminResponsiveHide" },
                { sName: 'ban_expiry', sWidth: '15%', sClass: "adminResponsiveHide" },
                { sName: 'ban_notes' , sClass: "adminResponsiveHide"},
                { bSortable: false, sWidth: '10%', sClass: "center" }
            ],
            "fnServerData": function ( sSource, aoData, fnCallback ) {
                aoData.push( { "name": "filterText", "value": $('#filterText').val() } );
                $.ajax({
                    "dataType": 'json',
                    "type": "GET",
                    "url": sSource,
                    "data": aoData,
                    "success": fnCallback
                });
            },
            'oLanguage': $.extend(dataTableOpts.oLanguage, {
                'sEmptyTable': {{ ta('there_are_no_banned_ips_in_the_current_filters', 'There are no banned IP addresses in the current filters.')|json_encode()|raw }}
            })
        }));
        
        // update custom filter
        $('.dataTables_filter').html($('#customFilter').html());
    });
    
    function addIPForm()
    {
        showBasicModal({{ ta('loading_dots', 'Loading...')|json_encode()|raw }}, {{ ta('add_ip_address', 'Add IP Address')|json_encode()|raw }}, '<button type="button" class="btn btn-primary" onClick="processBanIPAddress(); return false;">{{ ta('ban_ip_address', 'Ban IP Address') }}</button>');
        loadAddIPForm();
    }

    function loadAddIPForm()
    {
        $.ajax({
            type: "POST",
            url: "ajax/banned_ip_manage_add_form",
            data: {},
            dataType: 'json',
            success: function(json) {
                if(json.error == true)
                {
                    setBasicModalContent(json.msg);
                }
                else
                {
                    setBasicModalContent(json.html);
                    
                    // date picker
                    $('#ban_expiry_date').daterangepicker({
                        singleDatePicker: true,
                        calender_style: "picker_1",
                        autoUpdateInput: false,
                        locale: {
                            format: 'DD/MM/YYYY'
                        }
                    }, function(chosen_date) {
                        $('#ban_expiry_date').val(chosen_date.format('DD/MM/YYYY'));
                    });
                }
                
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                setBasicModalContent(XMLHttpRequest.responseText);
            }
        });
    }
    
    function processBanIPAddress()
    {
        // get data
        ip_address = $('#ip_address').val();
        ban_type = $('#ban_type').val();
        ban_expiry_date = $('#ban_expiry_date').val();
        ban_expiry_hour = $('#ban_expiry_hour').val();
        ban_expiry_minute = $('#ban_expiry_minute').val();
        ban_notes = $('#ban_notes').val();
        
        $.ajax({
            type: "POST",
            url: "ajax/banned_ip_manage_add_process",
            data: { ip_address: ip_address, ban_type: ban_type, ban_expiry_date: ban_expiry_date, ban_expiry_hour: ban_expiry_hour, ban_expiry_minute: ban_expiry_minute, ban_notes: ban_notes },
            dataType: 'json',
            success: function(json) {
                if(json.error == true)
                {
                    showError(json.msg, 'popupMessageContainer');
                }
                else
                {
                    showSuccess(json.msg);
                    reloadTable();
                    hideModal();
                }
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                showError(XMLHttpRequest.responseText, 'popupMessageContainer');
            }
        });
    }
    
    function reloadTable()
    {
        oTable.fnDraw(false);
    }
    
    function deleteBannedIp(bannedIpId)
    {
        showBasicModal('<p>{{ ta('are_you_sure_you_want_to_remove_the_banned_ip_address', 'Are you sure you want to remove the banned IP address?') }}</p>', {{ ta('confirm_removal', 'Confirm Removal')|json_encode()|raw }}, '<button type="button" class="btn btn-primary" onClick="removeBannedIp(); return false;">{{ ta('remove', 'Remove') }}</button>');
        gBannedIpId = bannedIpId;
    }
    
    function removeBannedIp()
    {
        $.ajax({
            type: "POST",
            url: "ajax/banned_ip_manage_remove",
            data: { bannedIpId: gBannedIpId },
            dataType: 'json',
            success: function(json) {
                if(json.error == true)
                {
                    showError(json.msg);
                }
                else
                {
                    showSuccess(json.msg);
                    reloadTable();
                    hideModal();
                }
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                showError(XMLHttpRequest.responseText);
            }
        });
    }
</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('banned_ip_addresses', 'Banned IP Addresses') }}</h2>
                        <div class="clearfix"></div>
                    </div>
                    <div class="x_content">
                        <table id='fileTable' class='table table-striped table-only-border dtLoading bulk_action'>
                            <thead>
                                <tr>
                                    <th></th>
                                    <th class="align-left">{{ ta('ip_address', 'IP Address') }}</th>
                                    <th class="align-left">{{ ta('date_banned', 'Date Banned') }}</th>
                                    <th class="align-left">{{ ta('ban_type', 'Ban Type') }}</th>
                                    <th class="align-left">{{ ta('ban_expiry', 'Ban Expiry') }}</th>
                                    <th class="align-left">{{ ta('ban_notes', 'Ban Notes') }}</th>
                                    <th class="align-left">{{ ta('actions', 'Actions') }}</th>
                                </tr>
                            </thead>
                            <tbody>
                            </tbody>
                        </table>
                    </div>
                </div>

                <div class="x_panel">
                    <div class="pull-left">
                        <a href="#" type="button" class="btn btn-primary" onClick="addIPForm(); return false;">{{ ta('ban_ip_address', 'Ban IP Address') }}</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" onKeyUp="reloadTable(); return false;" style="width: 160px;"/>
    </label>
</div>
{% endblock %}