@extends('layouts.app')

@section('sidebar')
@include('sidebar')
@stop
@section('content')
<div class="m-content">
    <div class="m-portlet m-portlet--full-height ">
        <div class="m-portlet__head">
            <div class="m-portlet__head-caption">
                <div class="m-portlet__head-title">
                    <h3 class="m-portlet__head-text">
                        Tutorial
                    </h3>
                </div>
            </div>
            
            <div class="m-portlet__head-caption">
                <div class="m-portlet__head-title">
                <a href="{{ url('tutorialadd') }}" class="btn btn-primary">Add</a>
                </div>
            </div>

        </div>
        <div class="m-portlet__body">
            @if(Session::has('success'))
            <div class="alert alert-success">
                {!! Session::get('success') !!}
            </div>
            @endif

           

            <table class="m_datatable table table-striped- table-bordered table-hover table-checkable" id="tutorial">
                <thead>
                    <tr>
                        <th>ID</th>
                        <th>Tutorial Name</th>
                        <th>Content Title</th>
                        <th>PDF Content</th>
                        
                        <th>Vide Content</th>
                        <th>Status</th>
                        <th>Date Of Submit</th>
                        <th>Action</th>
                    </tr>
                </thead>
                <tbody></tbody>
            </table>
        </div>
    </div>
</div>
@endsection

@section('script')
{{ Html::script('custom/eModal/eModal.js') }}
{{ Html::script('custom/datatables/datatables.bundle.js') }}
<script type="text/javascript">

    (function($){
        var table = '';
            

		$(document).ready(function () {

            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });

            

            $('#tutorial').each(function() {
                var aoColumns = [];
                var table;
                table = $(this).DataTable({
                    'responsive': true,
                    'searchDelay': 500,
                    'processing': true,
                    "oLanguage": {
                        "sProcessing": '<div class="m-loader m-loader--brand m-loader--left"><span>Please wait...</span></div>',
                    },
                    "serverSide": true,
                    "ajax": {
                        "url": base_url + "/tutorial",
                        "type": "GET",
                        "order": [[ 0, "desc" ]],
                        "dom": "<'row'<'col-sm-12'tr>>" +
                            "<'row'<'col-sm-12 col-md-6'l><'col-sm-12 col-md-6'p>>",
                        "success": function(data) {
                            if (data.error !== 'No Permission') {
                                aoColumns = [
                                    { data: 'id', name: 'id', bSearchable: false, bVisible: false },
                                    { data: 'tutorial_name', name: 'tutorial_name'},
                                    { data: 'content_title', name: 'content_title'},
                                    { data: 'pdf_content', name: 'pdf_content'},
                                    { data: 'video_content', name: 'video_content'},
                                    { data: 'status', name: 'status'},
                                    { data: 'created_at', name: 'created_at'},
                                    { data: 'action', name: 'action', orderable: false, searchable: false }
                                ];
                                // Reinitialize DataTable with updated aoColumns
                                table.destroy();
                                table = $('#tutorial').DataTable({
                                    'responsive': true,
                                    'searchDelay': 500,
                                    'processing': true,
                                    "oLanguage": {
                                        "sProcessing": '<div class="m-loader m-loader--brand m-loader--left"><span>Please wait...</span></div>',
                                    },
                                    "serverSide": true,
                                    "ajax": {
                                        "url": base_url + "/tutorial",
                                        "type": "GET",
                                        "order": [[ 0, "desc" ]],
                                        "dom": "<'row'<'col-sm-12'tr>>" +
                                            "<'row'<'col-sm-12 col-md-6'l><'col-sm-12 col-md-6'p>>"
                                    },
                                    "aoColumns": aoColumns
                                });
                            }else{
                                table.destroy();
                                swal(data.error, data[0], 'error') //warning,success,error,info,question
                                .then((isOK) => {
                                    window.location.href = base_url + "/no/permission";
                                });
                            }
                        }
                    }
                });
            });


            
                    

		});

        // Search Start

        // Status type Vise Search
        $('#document_status').on('change', function () {
                table.column('6').search($(this).val()).draw();
        });

        // Document type vise search
        $('#document_type').on('change', function () {
            table.column('3').search($(this).val()).draw();
        });

        $('#document_status, #document_type').selectpicker();

        // General search after 3 character entered
        $("#general-search")
        .unbind() // Unbind previous default bindings
        .bind("keyup", function(e) { // Bind our desired behavior
            var data = $(this).val();
            // If the length is 3 or more characters, or the user pressed ENTER, search
            if(data.length >= 3 || e.keyCode == 13 || e.keyCode == 8){
                table.search(data).draw();
            }
            // Ensure we clear the search if they backspace far enough
            if(this.value.length == 0) {
                table.search("").draw();
            }
        });

        // Search End

     ;
        /** end Verify Client **/
        function saveDocuments()
        {
            $('#document-form').submit();
        }
        /** Document Verification **/
        $(document).on('click', 'a.tutorial-delete', function(event){
            var id = $(this).attr('data-id');
            swal({
                    title: 'Are you sure!',
                    text: 'You won`t be able to revert this!',
                    type: "warning",
                    showCancelButton: !0,
                    confirmButtonText: "Yes, Confirm It!"
                }).then(function(e) {
                    //$.blockUI({ css: { backgroundColor: '#f00', color: '#fff'} });
                    if( e.value ) {
                        $.blockUI({ message: '<img src="{{ URL::to("images/loading.svg") }}" height="100%" width="100%" />', css: { border:'none', backgroundColor:'transparent' , top: '0%' , bottom: '0%'} });
                        var csrfToken = $('meta[name="csrf-token"]').attr('content');
                        
                        $.ajax({
                            url: "{{ url('tutorial/delete') }}", 
                            method: 'POST',
                            data:{
                                id : id,
                                _token : csrfToken,
                            },
                            dataType: 'json',
                            beforeSend:function(){
                                
                            },
                            complete: function(){
                                
                            },
                            success: function(res){
                                if (res.status == true) {
                                    swal("Deleted!", "Your tutorial deleted.", "success")
                                    .then((isOK) => {
                                        $('#tutorial').DataTable().ajax.reload();
                                        $.unblockUI();
                                    });
                                }else{
                                    swal("Oops...!", res.msg, "error")
                                    .then((isOK) => {
                                        $('#tutorial').DataTable().ajax.reload();
                                        $.unblockUI();
                                    });
                                }
                            }
                        });
                        // $.post( "{{ url('tutorial/delete') }}", { 'id': $(this).attr('data-id') }, function( data ) {
                        //     if(data.success){
                        //         if(data.action == 1) {
                        //             swal("Active!", "Bank Active Successfully.", "success")
                        //             .then((isOK) => {
                        //                 $('#wire-banks').DataTable().ajax.reload();
                        //             });
                        //         } else {
                        //             swal("Deactivated!", "Bank Deactivated Successfully.", "error")
                        //             .then((isOK) => {
                        //                 $('#wire-banks').DataTable().ajax.reload();
                        //             });
                        //         }
                        //     }
                        //     if(data.error){
                        //         swal(data["error"], data[0], "error")
                        //         .then((isOK) => {
                        //             $('#wire-banks').DataTable().ajax.reload();
                        //         });
                        //     }
                        //     $.unblockUI();
                        // });
                    }
                })
        });
        $(document).on('click', 'a.tutorial-approv', function(event){
            var id = $(this).attr('data-id');
            var secret = $(this).attr('secret-id');

            var url = base_url+"/tutorial/action/"+id+"/"+secret;
            var options = {
                url: url,
                title:'Nominee Detatils',
                size: 'md',
                buttons: [
                    {text: 'Cancel', style: 'btn btn-secondary', close: true },
                    {text: 'Submit', style: 'btn btn-primary',   close: false, click: saveDocuments }
                ]
            };
            eModal.ajax(options);
        });
        function saveDocuments()
        {
            $('#document-form').submit();
            table.ajax.reload( null, false );
        }

	})(jQuery);
    eModal.setModalOptions({ backdrop: 'static', keyboard: false });
</script>
@endsection