@extends('layouts.app')
@section('title','Add New')
@section('content')
    <div class="container-fluid">
        <h2 class="mt-4">News & Events</h2>
        <div class="d-flex justify-content-between py-4">
            <p class="page-title">Add New</p>
            <a class="btn btn-sm btn-warning" href="{{route('news-events.index')}}">View All</a>
        </div>
        <div class="card rounded-0">
            <div class="card-body">
                <div class="row">
                    <div class="col-md-12">
                        <form action="{{route('news-events.store')}}" method="post" enctype="multipart/form-data">
                            @csrf
                            <div class="form-group required row mt-3">
                            <input type="hidden" class="form-control" name="role_status" value="1">
                            <div class="row">
                                <div class="col-md-6 mb-3">
                                    <label class="form-label">Title*</label>
                                    <input type="text" class="form-control @error('title') is-invalid @enderror" name="title" onkeyup="listingslug(this.value)"  value="{{old('title')}}" placeholder="Enter Title">
                                    @error('title')
                                        <div class="alert text-danger m-0 p-0">{{ $message }}</div>
                                    @enderror
                                </div>
                                <!-- Slug -->
                                <div class="col-md-6 mb-3">
                                <label class="form-label" for="slug">Slug*</label>
                                <input type="text" class="form-control @error('slug') is-invalid @enderror" name="slug" id="slug" value="{{old('slug')}}">
                                </div>
                                  <!--Label For Date-->
                             <div class="col-md-6 mb-3">
                                <label class="form-label">Event Date</label>
                                   <div class="md-form md-outline input-with-post-icon datepicker my-0 px-0" id="select-date-input">
                                       <input placeholder="Select date" type="date" id="select-date-input" class="form-control" name="date">
                                   </div>
                                   @error('date')
                                       <div class="alert text-danger m-0 p-0">{{ $message }}</div>
                                   @enderror
                             </div>
                             <!--Label For Thumbnail-->
                             <div class="col-md-6 mb-3">
                                <label class="form-label">Attach Thumbnail*</label>
                                <input type="file" class="form-control @error('thumbnail') is-invalid @enderror" name="thumbnail" value="{{old('thumbnail')}}" placeholder="Attach Thumbnail">
                                @error('thumbnail')
                                    <div class="alert text-danger m-0 p-0">{{ $message }}</div>
                                @enderror
                            </div>
                              <!--Label For Description-->
                              <div class="col-md-12 mb-3">
                                <label class="form-label">Short Detail</label>
                                <textarea class="form-control" rows="3" cols="10"  name="short_description" value="{{old('description')}}"></textarea>
                              </div>
                                <!--Label For Description-->
                             <div class="col-md-12 mb-3">
                                <label class="form-label">Description</label>
                                <textarea class="form-control" rows="3" cols="10" id="description"  name="details" value="{{old('details')}}"></textarea>
                             </div>

                                <div class="col-md-12 mb-3">
                                    <input type="submit" class="btn btn-sm btn-success" value="Add New">
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection
@push('js')
<script src="{{ asset('ckeditor/ckeditor.js') }}"></script>
<script src="{{ asset('ckeditor/ckfinder/ckfinder.js') }}"></script>
<script src="{{ asset('ckeditor/samples/js/sample.js') }}"></script>
<!-- detail page -->
<script type="text/javascript">
    CKEDITOR.replace('description', {
        filebrowserUploadUrl: "{{route('ckeditor.upload', ['_token' => csrf_token() ])}}",
        filebrowserUploadMethod: 'form'
    });
</script>
<script>
    function slugify(text) {
      return text
        .toString()                     // Cast to string
        .toLowerCase()                  // Convert the string to lowercase letters
        .normalize('NFD')       // The normalize() method returns the Unicode Normalization Form of a given string.
        .trim()                         // Remove whitespace from both sides of a string
        .replace(/ /g, '-')
        .replace(/[^\w-]+/g, '')   // Remove all non-word chars
        .replace(/\-\-+/g, '-');        // Replace multiple - with single -
    }
    
    function listingslug(text) {
     document.getElementById("slug").value = slugify(text); 
    }
    </script>
@endpush