@extends('elibrary.staff.layouts.app')
@section('content')
<div class="row mt-3">
    <div class="col-md-12">
        <div class="heading">
            <h2>Add Book</h2>
        </div>
    </div>
    <div class="col-md-10 offset-md-1">
        <div class="form-part">
            <form action="{{isset($book)?route('book.update', $book):route('book.store')}}" method="POST" enctype="multipart/form-data">
                @csrf
                @if(isset($book))
                    @method('PATCH')
                @endif
                <div class="form-group">
                    <label for="name">Name <span>*</span></label>
                    <input type="text" class="form-control" id="name" name="name" value="{{old('name')?old('name'):(isset($book)?$book->name:'')}}" placeholder="Name">
                    @error('name')
                        <div class="text text-danger">
                            {{$message}}
                        </div>
                    @enderror
                </div>
                <div class="form-group">
                    <label for="isbn_no">ISBN No.</label>
                    <input type="text" class="form-control" id="isbn_no" name="isbn_no" value="{{old('isbn_no')?old('isbn_no'):(isset($book)?$book->isbn_no:'')}}" placeholder="ISBN No.">
                    @error('isbn_no')
                        <div class="text text-danger">
                            {{$errors->first('isbn_no')}}
                        </div>
                    @endif
                </div>
                <div class="form-group">
                    <label for="audio">Class</label>
                    <select class="form-control" aria-label="Default select example" name="class">
                        <option selected>Select Class</option>
                        @foreach(CLASSES as $class)
                        <option value="{{ $class }}" {{isset($book) && $book->class==$class ? 'selected' : ''}}>{{$class}}</option>
                        @endforeach
                    </select>
                    @error('class')
                        <div class="text text-danger">
                            {{$errors->first('class')}}
                        </div>
                    @endif
                </div>
                <div class="form-group files">
                    <label for="doc">Upload Your File <span>*</span></label>
                    <input id="file" type="file" name="doc" class="form-control">
                    @error('doc')
                        <div class="text text-danger">
                            * {{$errors->first('doc')}}
                        </div>
                    @endif
                </div>

                <div class="row col-md-12 mb-5">
                    <div class="col-md-4">
                        <label>Image<span class="required">*</span></label>
                    </div>
                    <div class="col-md-7 card p-3">
                        <img class="{{isset($book)?'d-block':'d-none'}} m-auto" id="image" src="{{isset($book) ? $book->image :''}}" width="150px" height="150px"/>
                        <input class="form-control mt-2" type="file" id="mediaFile" name="image"/>
                        @error('image')
                            <div class="text text-danger">
                                * {{$message}}
                            </div>
                        @endif
                    </div>
                </div>
                <div class="form-group">
                    <label for="description">Description</label>
                    <textarea name="description"
                              class="ckeditor form-control">{!! isset($book)?$book->description:(old('description') ?? '') !!}
                    </textarea>
                    @error('description')
                        <div class="text text-danger">
                            {{$message}}
                        </div>
                    @endif
                </div>
                <div class="form-group">
                    <div class="form-check form-switch">
                        <input type="hidden" name="status" value="0">
                        <input class="form-check-input" type="checkbox" name="status" id="flexSwitchCheckChecked" value="1"
                                {{ (isset($book) && $book->status == 1) || old('status') ? 'checked' : ''}}>
                        <label class="form-check-label" for="flexSwitchCheckChecked">Status</label>
                    </div>
                </div>
                <button type="submit" class="btn btn-primary">{{isset($book) ? 'Update' : 'Save'}}</button>
            </form>
        </div>
    </div>
</div>
@endsection
@section('js')
    <script>
        $('#mediaFile').on('change',function(){
            $('#image').removeClass('d-none').addClass('d-block');
            $('#image').attr('src',window.URL.createObjectURL(this.files[0]));
        });
    </script>
    <script src="//cdn.ckeditor.com/4.14.0/standard/ckeditor.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $('.ckeditor').ckeditor();
        });
    </script>
    <script>
        $(document).ready(function(){
            $(".files").attr('data-before',"Drag file here or click the above button");
            $('input[type="file"]').change(function(e){
                var fileName = e.target.files[0].name;
                $(".files").attr('data-before',fileName);
            });
        });
    </script>
@endsection