@extends('admin.layout')
@section('content')

    <!-- begin::main content -->
    <main class="main-content">
        <div class="container">
            <!-- begin::page header -->
            <div class="page-header">
                <h3>{{ $chapter->chapters }} | Add Material File</h3>
                <nav aria-label="breadcrumb">
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item">
                            <a href="#">Dashboard</a>
                        </li>
                        <li class="breadcrumb-item">
                            <a href="{{ asset('admin/product-list') }}">{{ $info->name }}</a>
                        </li>
                        <li class="breadcrumb-item">
                            <a href="{{ asset('admin/material-list/' . $info->id) }}">Material Chapter List</a>
                        </li>
                        <li class="breadcrumb-item">
                            <a href="{{ asset('admin/material-file-list/' . Request::segment(3) . '/' . $info->id) }}">
                                Material File List</a>
                        </li>
                        <li class="breadcrumb-item active" aria-current="page">Add Material File</li>
                    </ol>
                </nav>
            </div>
            <!-- end::page header -->
            <x-flashMessage />
            <div class="row">
                <div class="col-md-6">

                    <div class="card">
                        <div class="card-header">
                            <h5 class="card-title pull-left m-t-10">Add Material File</h5>
                            <a href="{{ asset('admin/material-file-list/' . Request::segment(3) . '/' . $info->id) }}"
                                class="btn btn-primary text-white pull-right"><i class="fa fa-list"></i>&nbsp; Material
                                File List</a>

                        </div>
                        <div class="card-body">

                            <form action="{{ asset('admin/save-material-file/' . Request::segment(3)) }}" method="post"
                                enctype="multipart/form-data">
                                @csrf

                                <div class="form-group">
                                    <label for="name">File Name</label>
                                    <input type="text" class="form-control" name="file_name" value="" id="file_name"
                                        placeholder="Type file name">

                                    @if ($errors->has('file_name'))
                                        <div class="error">
                                            {{ $errors->first('file_name') }}
                                        </div>
                                    @endif

                                </div>

                                <div class="form-group">
                                    <label for="search_p_c">Search Public Content</label>
                                    <span id="search_p_c_spin"></span>
                                    <input type="text" class="form-control" name="search_p_c" value="" id="search_p_c"
                                        placeholder="Search Public Contents">
                                </div>

                                <div class="form-group">
                                    <select id="public_content" class="js-example-basic-single public_content select-item"
                                        name="public_content">
                                    </select>

                                    @if ($errors->has('public_content'))
                                        <div class="error">
                                            {{ $errors->first('public_content') }}
                                        </div>
                                    @endif
                                </div>

                                <button type="submit" class="btn btn-primary">Submit</button>
                            </form>
                        </div>
                    </div>



                </div>

            </div>

        </div>

    </main>
    <!-- end::main content -->

@endsection
@push('footer-script')
    <!-- begin::select2 -->
    <!-- begin::select2 -->
    <link rel="stylesheet" href="{{ asset('public/admin/vendors/select2/css/select2.min.css') }}" type="text/css">
    <!-- end::select2 -->

    <script src="{{ asset('public/admin/vendors/select2/js/select2.min.js') }}"></script>
    <script src="{{ asset('public/admin/js/examples/select2.js') }}"></script>
    <script>
        $(document).ready(function() {
            $('#search_p_c').change(function() {
                var type = $(this).val();
                $.ajaxSetup({
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    }
                });

                $.ajax({
                    type: "post",
                    data: {
                        'search': type,
                    },
                    datatype: "text",
                    url: "{{ asset('admin/search-public-file') }}",
                    beforeSend: function() {
                        $('#search_p_c_spin').empty();
                        $('#search_p_c_spin').append("<i class='fa fa-spinner fa-pulse'></i>");

                        $('#public_content').html('').select2({
                            data: []
                        });
                    },
                    success: function(result) {
                        if (result.public_content) {
                            var obj = jQuery.parseJSON(result.public_content);
                            $.each(obj, function(key, value) {
                                $("#public_content").append(
                                    '<option value="' + value.path + '">' + value
                                    .filename + '</option>');

                            });
                            $('#search_p_c_spin').empty();
                            // console.log(obj);
                        }
                    }
                });
            });
        });
    </script>

@endpush