<?php

if (isset($message)) {
    echo '<div class="alert alert-success" role="alert">' . $message . '</div>';
}

if (!empty($this->session->flashdata('message'))) {
    echo $this->session->flashdata('message');
}

?>
<div id="lec_msg"></div>
<div class="row">

    <?php if ($p_type == 'list') : ?>
        <div class="col-md-12">
            <div class="box box-primary">
                <div class="box-body">
                    <div class="row" style="border: 1px solid #ccc; margin: 0px 0px 0; padding: 8px 0px 2px 0px;">
                        <div class="col-md-12">
                            <!-- Sync BTN -->
                            <button class="btn btn-warning pull-left margin-r-5" type="button" id="syncvodserver">Sync VOD Server
                            </button>

                            <!-- Upload Video -->
                            <a href="<?php echo base_url(); ?>admin/vodserver/upload" class="btn btn-success pull-left" type="button">Upload VOD
                            </a>

                            <!-- Delete -->
                            <button class="btn btn-danger pull-right" id="all_delete">Delete Selected</button>
                        </div>

                        <br /><br />
                        <div class="col-md-12" id="filter_msg"></div>
                    </div>
                    <br />

                    <div class="table-responsive">
                        <table class="table table-bordered table-striped table-hover table-sm" id="check_permission_list">
                            <thead style="font-size: 12px;">
                                <th>
                                    <input type="checkbox" id="all_check_in" value="">
                                </th>
                                <th>ID</th>
                                <th>Library ID</th>
                                <th>Name</th>
                                <th>Duration</th>
                                <th>Date</th>
                                <th>Actions</th>
                            </thead>
                        </table>
                    </div>

                </div>
            </div>
        </div>
    <?php endif; ?>

</div>

<link rel="stylesheet" type="text/css" href="<?php echo base_url('assets/plugins/datatables/dataTables.bootstrap4.min.css'); ?>">
<link rel="stylesheet" type="text/css" href="<?php echo base_url('assets/plugins/datatables/responsive.bootstrap4.min.css'); ?>">
<link rel="stylesheet" type="text/css" href="<?php echo base_url('assets/plugins/datatables/buttons.bootstrap4.min.css'); ?>">
<script type="text/javascript" src="<?php echo base_url('assets/plugins/datatables/jquery.dataTables.min.js'); ?>">
</script>
<script type="text/javascript" src="<?php echo base_url('assets/plugins/datatables/dataTables.bootstrap4.min.js'); ?>">
</script>

<script type="text/javascript">
    $(document).ready(function() {

        $(document).on('click', '#syncvodserver', function() {

            // Sync VOD Server &nbsp; <i class="fa fa-spinner"></i>
            $.ajax({
                type: "POST",
                url: "<?php echo base_url(); ?>" + "admin/vodserver/sync_vod_server",
                data: {},
                beforeSend: function() {
                    $('#syncvodserver').empty();
                    $('#syncvodserver').html('<i class="fa fa-refresh fa-spin fa-1x fa-fw"></i> Please Wait..');
                },
                complete: function(data) {
                    $('#syncvodserver').empty();
                    $('#syncvodserver').html('Sync Done');
                    if (data) {
                        upload_lecture_list.draw();
                    }
                }
            });
            $(this).html('Please Wait <i class="fa fa-spinner fa-spin"></i>');
        });

        var upload_lecture_list = $('#check_permission_list').DataTable({
            "processing": true,
            "serverSide": true,
            "pageLength": 50,
            "lengthMenu": [
                [50, 100, 500, 1000, 5000],
                [50, 100, 500, 1000, 5000]
            ],


            "ajax": {
                "url": JS_BASE_URL + 'admin/vodserver/posts',
                "dataType": "json",
                "type": "POST",
                // "data": function(post_data) {

                // },
                // "success": function(data) {
                //     console.log(data);
                // },
                "async": true,
                "error": function(jqXHR, exception) {
                    console.log(jqXHR.responseText);
                }
            },

            "columns": [{
                    "data": "id"
                },
                {
                    "data": "video_id"
                },
                {
                    "data": "library_id"
                },
                {
                    "data": "name"
                },
                {
                    "data": "duration"
                },
                {
                    "data": "created"
                },
                {
                    "data": "actions"
                },
            ],

            "columnDefs": [{
                "targets": [0],
                "orderable": false,

            }]
        });

        upload_lecture_list.columns().every(function() {
            var that = this;
            var searchinput = $('#posts_filter').find('input');
            $(searchinput, this.footer()).on('change', function() {

                if (that.search() !== this.value) {
                    that.search(this.value).draw();
                }
            });
        });




        /**********************************************************************************/

        $(document).on('click', '#all_check_in', function() {
            var all_check_in = $(this),
                _check_in = $('._check_in');

            if (typeof _check_in !== 'undefined' || _check_in !== null) {
                if (all_check_in.prop('checked') == true) {
                    all_check_in.prop('checked', true);
                    all_check_in.parent().parent().css({
                        'background-color': '#000',
                        'color': '#fff'
                    });

                    _check_in.prop('checked', true);
                    _check_in.parent().parent().css({
                        'background-color': '#ccc'
                    });
                } else {
                    all_check_in.prop('checked', false);
                    all_check_in.parent().parent().removeAttr('style');

                    _check_in.prop('checked', false);
                    _check_in.parent().parent().removeAttr('style');
                }
            }
        });

        $(document).on('click', '._check_in', function() {
            var _check_in = $('._check_in');

            _check_in.each(function() {
                if ($(this).prop('checked') == true) {
                    $(this).parent().parent().css({
                        'background-color': '#ccc'
                    });
                } else {
                    $(this).parent().parent().removeAttr('style');
                }
            });
        });

        /**********************************************************************************/




        $(document).on('click', '#all_delete', function() {

            if (confirm('Are you sure! you want to delete selected files?')) {
                var _check_in = $('._check_in'),
                    lec_msg = $('#lec_msg'),
                    _selected = [];

                if (typeof _check_in !== 'undefined' || _check_in !== null) {
                    $('._check_in:checked').each(function() {
                        _selected.push($(this).val());
                    });

                    if (_selected.length !== 0) {
                        $.ajax({
                            url: JS_BASE_URL + 'admin/vodserver/delete_all',
                            type: 'POST',
                            data: {
                                video_ids: _selected
                            },
                            dataType: 'json',
                            async: true,

                            beforeSend: function() {
                                lec_msg.empty();
                                lec_msg.append(
                                    '<div class="alert alert-warning" role="alert">Deleting records please wait ...</div>'
                                );
                            },

                            success: function(data) {
                                window.location.reload(true);
                            },

                            error: function(jqXHR, exception) {
                                console.log(jqXHR.responseText);
                            }
                        });
                    } else {
                        alert('Select item for delete!');
                    }
                }
            }
        });

        /**********************************************************************************/

        $(document).on('click', '#clear_filter', function() {
            course_id = $("#course_id");
            subject_id = $("#subject_id");
            chapter_id = $("#chapter_id");

            course_id.val("");
            subject_id.val("");
            chapter_id.val("");

            upload_lecture_list.draw();
        });

    });
</script>