@php
$title = $blade_data['title'];
$routeLink = $blade_data['routeLink'];
$positions = isset($form_data->positions)&&!empty($form_data->positions)?explode(',',$form_data->positions):[];
@endphp

@extends('admin.layouts.app')
@section('page-title',$title)
@section('breadcrumb')
<x-breadcrumb :blades="$blade_data" />
@endsection

@section('content')

<div class=" ">
    <div class="card rounded-0 mb-2">
        <div class="card-body">

            <form
                action="{{$form_data->id?route($routeLink.'.update',['id'=>$form_data->id]):route($routeLink.'.store')}}"
                method="POST" class="edit-form" enctype="multipart/form-data">
                @csrf

                <div class="form-group row">     
                    <div class="col-sm-3 mb-3">
                        <label class="">{{__('Sort Order')}}</label>
                        <div class="">
                            <input type="number" name="sort_order" value="{{old('sort_order',$form_data->sort_order)}}"
                                class="form-control @error('name') is-invalid @enderror" required>
                            @error('name')
                            <span class="invalid-feedback" role="alert">
                                <strong>{{ $message }}</strong>
                            </span>
                            @enderror
                        </div>
                    </div>
                    
                    <div class="col-sm-3 mb-3">
                        <label class="">{{__('Page')}}</label>
                        <div class="">
                            <select name='page_template' class="form-control i-page_template" onchange="select_type()" >
                                @foreach ($pageTemplate as $item)
                                <option value="{{$item}}" {{$form_data->page_template==$item?'selected':''}}>{{$item}}</option>                                
                                @endforeach                            
                        </select>
                        
                            @error('page_template')
                            <span class="invalid-feedback" role="alert">
                                <strong>{{ $message }}</strong>
                            </span>
                            @enderror
                        </div>
                    </div>

                    <div class="col-sm-3 mb-3 ">
                        <label class="">Slug</label>
                        <div class="">
                            <input type="text" name="slug" value="{{old('slug',$form_data->slug)}}"
                                class="form-control @error('slug') is-invalid @enderror" required>
                            @error('slug')
                            <span class="invalid-feedback" role="alert">
                                <strong>{{ $message }}</strong>
                            </span>
                            @enderror
                        </div>
                    </div>
                    
                    <div class="col-sm-3 mb-3">
                        <label class="">Name</label>
                        <div class="">
                            <input type="text" name="name" value="{{old('name',$form_data->name)}}"
                                class="form-control @error('name') is-invalid @enderror" required>
                            @error('name')
                            <span class="invalid-feedback" role="alert">
                                <strong>{{ $message }}</strong>
                            </span>
                            @enderror
                        </div>
                    </div>


                    <div class="col-sm-7 mb-3 link-field" style="display: none">
                        <label class="">Link</label>
                        <div class="">
                            <input type="text" name="link" value="{{old('link',$form_data->link)}}"
                                class="form-control @error('link') is-invalid @enderror" required>
                            @error('link')
                            <span class="invalid-feedback" role="alert">
                                <strong>{{ $message }}</strong>
                            </span>
                            @enderror
                        </div>
                    </div>
                    <div class="col-md-12 mb-3">
                        {{-- <textarea name="message" style="display:none" id="hiddenArea">{!!$email->message!!}</textarea>
                        <div id="lr-editor" style="height: 340px;">{!!$email->message!!}</div> --}}
    
                        <textarea name="description" id="lv-editor" class="form-control">{!!$form_data->description!!}</textarea>
                    </div>

                    <div class="col-sm-12">
                        <label class=" col-form-label">Show In</label>
                        <div class="">
                            <div class=" row">
                                @foreach ($pagePosition as $key=>$item)
                                <div class="col-sm-3">
                                    <label for="">
                                        <input type="checkbox" name="positions[]" value="{{$key}}" {{in_array($key,$positions)?'checked':''}} /> {{$item}}
                                    </label>
                                </div>
                                @endforeach
                            </div>
    
                        </div>
                    </div>
    
                    
                </div>

                <div class="row mt-3">
                    <div class="col-md-3">
                        <button type="submit" class="btn btn-sm btn-primary submitBtn">Save</button>
                        <a href="{{route($routeLink.'.index')}}" class="btn btn-sm btn-secondary">Back</a>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

@endsection


@push('scripts')

<script src="{{asset('plugins/jquery.validate.js')}}"></script>
<script src="{{asset('plugins/ckeditor/ckeditor.js')}}" type="text/javascript"></script>
<script src="{{asset('plugins/ckeditor/adapters/jquery.js')}}" type="text/javascript"></script>

<script>
    CKEDITOR.replace('lv-editor',{
        height: 500,
        allowedContent: true,
        toolbar: [
            { name: 'document', groups: [ 'mode', 'document', 'doctools' ], items: [ 'Source',] },
            { name: 'clipboard', groups: [ 'clipboard', 'undo' ], items: [ 'Cut', 'Copy', 'Paste', 'PasteText', 'PasteFromWord', '-', 'Undo', 'Redo' ] },
            '/',
            { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ], items: [ 'Bold', 'Italic', 'Underline', 'Strike', 'Subscript', 'Superscript', '-', 'RemoveFormat' ] },
            { name: 'paragraph', groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ], items: [ 'NumberedList', 'BulletedList', '-', 'Outdent', 'Indent', '-', 'Blockquote', 'CreateDiv', '-', 'JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock', '-', 'BidiLtr', 'BidiRtl' ] },
            { name: 'links', items: [ 'Link', 'Unlink', ] },
            { name: 'insert', items: [ 'Table', 'HorizontalRule', 'Smiley', 'SpecialChar', 'PageBreak', 'Iframe' ] },
            '/',
            { name: 'styles', items: [ 'Styles', 'Format', 'Font', 'FontSize' ] },
            { name: 'colors', items: [ 'TextColor', 'BGColor' ] },
            { name: 'tools', items: [ 'Maximize', 'ShowBlocks' ] },        
        ],
     
     },);

    var oEditor = CKEDITOR.instances.editor;

    $(".edit-form" ).validate({
    //     highlight: function(element) {
		// 	$(element).closest('.form-control').removeClass('is-valid').addClass('is-invalid'); // add the Bootstrap error class to the control group
		// },
		// ignore: ":hidden, [contenteditable='true']",
		// unhighlight: function(element) {
		// 	$(element).closest('.form-control').removeClass('is-invalid').addClass('is-valid');
		// },
		// success: function(element) {
		// 	$(element).closest('.form-control').removeClass('is-invalid').addClass('is-valid'); // remove the Boostrap error class from the control group
		// },
        submitHandler: function (form) {
            var loadingText = '<i class="fa fa-circle-notch fa-spin"></i> Saving..';
            $('.edit-form  .submitBtn').html(loadingText).prop('disabled', true);    
            return true;            
        }
    });

function select_type(){
    var val = $('.i-page_template').val();
    if(val=='link'){
        $('.link-field').show();
        $('.link-field .form-control').attr('required',true);
    }
    else{
        $('.link-field').hide();
        $('.link-field .form-control').attr('required',false);
    }
}
select_type();
</script>
@endpush