@using EnVisage.Code.HtmlHelpers
@using Microsoft.AspNet.Identity
@using EnVisage.Code
@model EnVisage.Models.UDFModel

@section scripts
{
    <script type="text/javascript">
	    var ctr = 0;
	    init.push(function () {
	        $('#udfs').dataTable({
		        "bProcessing": true,
		        "bServerSide": true,
		        "bAutoWidth" : false,
		        "sAjaxSource": document.URL,
		        "sServerMethod": "POST",
		        "aoColumns": [
                {
                    "mDataProp": "Name"
                },
                {
                    "mDataProp": "Description",
                        "bSortable": false,
                        "bSearchable": false
	            },
         
                   {
                       "mDataProp": "Label"
                   },
			   {
			       "mDataProp": "Area"
			   },
				{
					"mData": function (data, type, full) {
					    @if (SecurityManager.CheckSecurityObjectPermission(Areas.UserDefinedFields, AccessLevel.Write))
                        {
                        <text>
                        ctr++;
          return ('<a id="btnEdit_rplcmnt_ onclick="return CheckLock(this.id, \'udf\', \'_rplcmnt_\')" data-toggle="popover" data-placement="left" ' + 'class="btn btn-sm btn-primary popover-warning popover-dark" onclick="showEditUdfWindow(\'_rplcmnt_\');"><i class="fa fa-edit"></i> Edit</a> ' +
								'<a id="btnDelete_rplcmnt_ onclick="return CheckLock(this.id, \'udf\', \'_rplcmnt_\')" data-toggle="popover" data-placement="left" ' + 'class="btn btn-sm btn-danger popover-warning popover-dark" ) + onclick="deleteUdf(\'_rplcmnt_\');"' + ' ><i class="fa fa-trash-o"></i> Delete</a>')
							.replace(/_rplcmnt_/g, data.Id);
                        </text>
                        }
    else
    {
                        <text>

                        return "";

                        </text>

                        }
}
                ,'bSortable':false}],
			});
			   @if ( SecurityManager.CheckSecurityObjectPermission(Areas.UserDefinedFields, AccessLevel.Write))

			{
			<text>
	        $('#udfs_wrapper .table-caption').html('<a class="btn btn-primary" onclick="showEditUdfWindow(\'@Guid.Empty\');"><i class="fa fa-plus"></i> Add Field</a>');
            </text>
			}
	        $('#udfs_wrapper .dataTables_filter input').attr('placeholder', 'Search...');
	        $('#udfs_wrapper .dataTables_processing').addClass("table-caption");
	        $('#udfs_wrapper .dataTables_processing').html('<span class="h3"><img class="valign-middle" src="../Content/images/loadFA.gif"/></span>');
        });
        function showEditUdfWindow(UdfId) {
            
            $.get('@Url.Action("Edit", "UDF")?id=' + UdfId, function (data) {
                $('#divEditUdf').html(data);
                $('#modalEditUdf').modal("show");
                initUdf();
            }).fail(function () {
                showErrorModal('Oops...', 'An error occurred while processing your request. Please, try again later.');
            });
        };
 
        function deleteUdf(UdfId) {
            if (!UdfId)
                return;
            
            bootbox.confirm({
                message: "Are you sure you want to delete this Field?",
                callback: function (result) {
                    if (result) {
                        var text = "@Url.Action("Delete", "UDF", new { Id = "JSVar" })".replace("JSVar", UdfId);
                        $.post(text, function () {
                            blockUI();
                            refreshUdfs();
                        }).fail(function () {
                            showErrorModal('Oops...', 'An error occurred while processing your request. Please, try again later.');
                        }).always(unblockUI);
                    }
                },
                className: "bootbox-sm"
            });
        };

        function closeEditUdfWindow() {
            $('#modalEditUdf').modal("hide");
        };
        function refreshUdfs() {
            blockUI();
            $('#udfs').DataTable().ajax.reload(unblockUI, false);
        };
    </script>
}

<div class="table-light table-responsive">
    <table cellpadding="0" cellspacing="0" border="0" class="table table-striped table-bordered" id="udfs">
        <thead>
            <tr>
                <th>
                    Field Name
                </th>
                <th>
                    Field Description
                </th>
                <th>
                    Label
                </th>
                <th style="width: 100px;">
                    Area
                </th>
                <th style="width:229px;"></th>
            </tr>
        </thead>
    </table>
</div>
<div id="modalEditUdf" class="modal fade" data-width="600" tabindex="-1" role="dialog" style="display: none;" data-backdrop="static">
    <div class="modal-dialog" id="divEditUdf">
    </div> <!-- / .modal-dialog -->
</div> <!-- / .modal -->