@extends('layouts.app')

@section('content')

    <div class="card"> <div class="card-header bg-success text-white">

            <h5  class="my-1 float-left">{{ !empty($flora->name) ? $flora->name : 'Flora' }} <div class="btn-group btn-group-sm float-right" role="group">

                <a href="{{ route('floras.flora.index') }}" class="btn btn-primary" title="แสดง พรรณไม้ ทั้งหมด">
                    <i class=" fas fa-fw fa-th-list" aria-hidden="true"></i>
                </a>

                <a href="{{ route('floras.flora.create') }}" class="btn btn-success" title="เพิ่ม พรรณไม้ ใหม่">
                    <i class=" fas fa-fw fa-plus" aria-hidden="true"></i>
                </a>

            </div></h5>

            
        </div>

        <div class="card-body">

            @if ($errors->any())
                <ul class="alert alert-danger">
                    @foreach ($errors->all() as $error)
                        <li>{{ $error }}</li>
                    @endforeach
                </ul>
            @endif

            <form method="POST" action="{{ route('floras.flora.update', $flora->id) }}" id="edit_flora_form" name="edit_flora_form" accept-charset="UTF-8" class="form-horizontal" enctype="multipart/form-data">
            {{ csrf_field() }}
            <input name="_method" type="hidden" value="PUT">
            @include ('floras.form', [
                                        'flora' => $flora,
                                      ])

                <div class="form-group">
                    <div align="center">
					<button class="btn btn-primary" type="submit">
					<i class="fas fa-fw fa-edit"></i> 
					ปรับปรุงข้อมูล</button>
					<button class="btn btn-light" type="reset">
					<i class="fas fa-fw fa-redo" aria-hidden="true"></i> 
					ยกเลิก</button>
				  </div>
                </div>
            </form>

        </div>
    </div>

@endsection
@section('script')

<script src="{{asset('ckeditor/ckeditor.js')}}"></script>
<script>
var url = "{{url('ckupload')}}?_token={{csrf_token()}}";
CKEDITOR.replace('detail', {
filebrowserImageUploadUrl: url,
filebrowserUploadUrl: url, 
 extraPlugins: 'uploadimage,image,youtube',
			height: 400,
			uploadUrl: "{{url('fastupload')}}?command=QuickUpload&type=Files&responseType=json&_token={{csrf_token()}}",
			stylesSet: [
				{ name: 'Narrow image', type: 'widget', widget: 'image', attributes: { 'class': 'image-narrow' } },
				{ name: 'Wide image', type: 'widget', widget: 'image', attributes: { 'class': 'image-wide' } }
			],	
			contentsCss: [ CKEDITOR.basePath + 'contents.css', 'http://sdk.ckeditor.com/samples/assets/css/widgetstyles.css' ],
			image2_alignClasses: [ 'image-align-left', 'image-align-center', 'image-align-right' ],
			image2_disableResizer: true ,
			removePlugins: 'elementspath',
    resize_enabled: true	 
		}); 
 
CKEDITOR.addCss(".cke_editable{border-color: #FF0000;}");  
$('img').css('max-width','100%');
$('img').css('height','');
</script>
@endsection