@php
$breadcrumb = [
['label' => 'Dashboard', 'url' => route('admin.dashboard')],
['label' => 'CMS Pages', 'url' => route('admin.cms')],
['label' => 'Edit Inner Page Details']
];
@endphp

@extends('admin.layouts.app')
@section('title', 'Edit ' . $cms['name'])
@section('content')


<form id="innerPageForm" action="">
    <div class="row mt-4">
        <div class="col-md-12">
            <div class="card border-primary" style="border-left: solid 3px;">
                <div class="card-body">
                    <div class="d-flex justify-content-between">
                        <span class="d-block fs-4 fw-bold text-dark mb-3 pb-2">
                            Banner Section
                        </span>
                    </div>
                    <input type="hidden" id="pagename" value="{{ $cms['name'] }}">
                    <section class="container-fluid py-4">
                        <div class="row">
                            <div class="col-12">
                                <input id="banner_image_input" class="form-control banner_image_input d-none _image" type="file" name="banner_image_input" accept="image/*">
                                <label for="banner_image_input" class="form-label mt-2" style="cursor:pointer; width: 100%;">Banner Image
                                    <img class="banner_image_preview w-100 shadow-sm mb-2 mt-2 object-fit-cover rounded-3"
                                        src="{{!empty($innerpagedetails['banner_image']) ? asset('storage/'.$innerpagedetails['banner_image'])  : asset('backend/assets/img/image_placeholder.svg')}}"
                                        alt="Preview" style="height: 300px;">
                                </label>
                            </div>
                            <div class="col-12">
                                <label for="banner_title">Banner Title</label>
                                <input class="form-control _heading" id="banner_title" type="text" value="{{ $innerpagedetails['banner_title'] }}">
                            </div>
                        </div>
                    </section>
                </div>
            </div>
            <div class="card border-primary mt-4 {{ !( $cms['name'] == 'Our Journey' || $cms['name'] == 'Leadership' || $cms['name'] == 'Tribute' || $cms['name'] == 'Privacy Policy' || $cms['name'] == 'Terms Of Use' || $cms['name'] == 'Contact Us') ? 'd-none' : ''}}" style="border-left: solid 3px;">
                <div class="card-body">
                    <div class="d-flex justify-content-between">
                        <span class="d-block fs-4 fw-bold text-dark mb-3 pb-2">
                            Content Section
                        </span>
                    </div>

                    <section class="container-fluid py-4">
                        <div class="row">
                            <div class="col-12 {{ !( $cms['name'] == 'Our Journey' || $cms['name'] == 'Tribute' || $cms['name'] == 'Leadership') ? 'd-none' : '' }}">
                                <input id="image_input" class="form-control image_input d-none _image" type="file" name="image_input" accept="image/*">
                                <label for="image_input" class="form-label mt-2" style="cursor:pointer; width: 100%;">Image
                                    <div>
                                        <img class="image_preview w-1/4 shadow-sm mb-2 mt-2 object-fit-cover rounded-3"
                                            src="{{!empty($innerpagedetails['image']) ? asset('storage/'.$innerpagedetails['image'])  : asset('backend/assets/img/image_placeholder.svg')}}"
                                            alt="Preview" style="height: 200px;">
                                    </div>
                                </label>
                            </div>
                            <div class="col-12 {{ !( $cms['name'] == 'Tribute' || $cms['name'] == 'Leadership') ? 'd-none' : ''}}">
                                <label for="section_heading">Section Heading</label>
                                <input class="form-control _heading" id="section_heading" type="text" value="{{ $innerpagedetails['section_heading'] }}">
                            </div>
                            <div class="col-12 mt-2 {{ !( $cms['name'] == 'Our Journey' || $cms['name'] == 'Tribute' || $cms['name'] == 'Leadership') ? 'd-none' : '' }}">
                                <label for="main_heading">Main Heading</label>
                                <input class="form-control _heading" id="main_heading" type="text" value="{{ $innerpagedetails['main_heading'] }}">
                            </div>
                            <div class="col-12 mt-2 {{ !( $cms['name'] == 'Our Journey' || $cms['name'] == 'Tribute' || $cms['name'] == 'Leadership' || $cms['name'] == 'Privacy Policy' || $cms['name'] == 'Terms Of Use') ? 'd-none' : ''}}">
                                <label for="description">Description</label>
                                <textarea name="description" id="description">{{ $innerpagedetails['description'] }}</textarea>
                            </div>
                            <div class="col-12 mt-2 d-flex justify-content-start gap-4 {{ !( $cms['name'] == 'Our Journey') ? 'd-none' : ''}}">
                                <div class="col-5">
                                                                        <label for="cta_text">Button Text</label>
                                    <input class="form-control _textOnly" id="cta_text" type="text" value="{{ !empty($buttons[0]['text']) ? $buttons[0]['text'] : '' }}">
                                </div>
                                <div class="col-5">
                                    <label for="cta_link">Button Link</label>
                                    <input class="form-control _path" id="cta_link" type="text" value="{{ !empty($buttons[0]['link']) ? $buttons[0]['link'] : '' }}">
                                </div>
                            </div>
                            <div class="col-12 mt-2 d-flex justify-content-start gap-4 {{ !( $cms['name'] == 'Our Journey') ? 'd-none' : ''}}">
                                <div class="col-5">
                                    <label for="cta_text2">Button Text 2</label>
                                    <input class="form-control _textOnly" id="cta_text2" type="text" value="{{ !empty($buttons[1]['text']) ? $buttons[1]['text'] : '' }}">
                                </div>
                                <div class="col-5">
                                    <label for="cta_link2">Button Link 2</label>
                                    <input class="form-control _path" id="cta_link2" type="text" value="{{ !empty($buttons[1]['link']) ? $buttons[1]['link'] : '' }}">
                                </div>
                            </div>
                            
                            <div class="col-12 mt-2 {{ !( $cms['name'] == 'Contact Us') ? 'd-none' : ''}}">

                                <div class="col-12 mt-2 d-flex justify-content-start gap-2">
                                    <div class="col-2">
                                        <label for="location_heading">Location Heading</label>
                                        <input class="form-control _heading" id="location_heading" type="text" value="{{ !empty($contact_us['location_heading']) ? $contact_us['location_heading'] : '' }}">
                                    </div>
                                    <div class="col-10">
                                        <label for="location">Location</label>
                                        <input class="form-control _info" id="location" type="text" value="{{ !empty($contact_us['location']) ? $contact_us['location'] : '' }}">
                                    </div>
                                </div>
                                <div class="col-12 mt-2 d-flex justify-content-between gap-2 ">
                                    <div class="col-4">
                                        <label for="cu_heading">Call Us Heading</label>
                                        <input class="form-control _heading" id="cu_heading" type="text" value="{{ !empty($contact_us['cu_heading']) ? $contact_us['cu_heading'] : '' }}">
                                    </div>
                                    <div class="col-4">
                                        <label for="mobile1">Mobile 1</label>
                                        <input class="form-control _phone" id="mobile1" type="text" value="{{ !empty($contact_us['mobile1']) ? $contact_us['mobile1'] : '' }}">
                                    </div>
                                    <div class="col-4">
                                        <label for="mobile2">Mobile 2</label>
                                        <input class="form-control _phone" id="mobile2" type="text" value="{{ !empty($contact_us['mobile2']) ? $contact_us['mobile2'] : '' }}">
                                    </div>
                                </div>
                                <div class="col-12 mt-2 d-flex justify-content-between gap-2 ">
                                    <div class="col-5">
                                        <label for="mu_heading">Mail Us</label>
                                        <input class="form-control _heading" id="mu_heading" type="text" value="{{ !empty($contact_us['mu_heading']) ? $contact_us['mu_heading'] : '' }}">
                                    </div>
                                    <div class="col-5">
                                        <label for="mu_email">Email</label>
                                        <input class="form-control _email" id="mu_email" type="text" value="{{ !empty($contact_us['mu_email']) ? $contact_us['mu_email'] : '' }}">
                                    </div>
                                    
                                </div>
                            </div>
                        </div>
                    </section>
                </div>
            </div>
        </div>
    </div>

    <div class="mt-2 d-flex justify-content-end">
        <button id="submit-form" class="btn btn-primary" type="button">Submit</button>
    </div>
</form>


@endsection

@push('scripts')
<script>
    var editUrl = "{{ route('admin.cms.edit') }}";
</script>
<script src="{{ asset('backend/assets/tinymce/tinymce.min.js')}}"></script>
<script src="{{ asset('backend/assets/tinymce/jquery.tinymce.min.js')}}"></script>
<script>
    tinymce.init({
        selector: '#description',
        height: 300,
        plugins: 'link image code table lists',
        toolbar: ['code preview image removeformat link h2 h3 h4 h5 forecolor| bold italic underline fontsizeselect| subscript superscript charmap | alignleft aligncenter alignright outdent indent | bullist numlist  selectall fullscreen', ],
        menubar: false,
        file_picker_types: 'image',
        contextmenu: "link image imagetools table spellchecker",
        quickbars_selection_toolbar: 'bold italic | quicklink h1 h2 h3',
        toolbar_drawer: 'sliding',
        menubar: false,
        relative_urls: false,
        remote_scripts_host: false,
        convert_urls: true,
        setup: function(ed) {
            ed.on('init', function() {
                ourJourneyDetails = ed.getContent(); // catch initial DB content
            });

            ed.on('keyup change', function() {
                ourJourneyDetails = ed.getContent(); // catch updates
            });
        },
        automatic_uploads: false,
        media_alt_source: false
    });
</script>
<script src="{{asset('backend/assets/js/admin/skj-validations@v1.js')}}"></script>
<script src="{{asset('backend/assets/js/admin/inner_page_edit.js')}}"></script>
@endpush