@extends('layouts.admin')

@section('title', 'Edit About')

@section('breadcrumbs', 'About')

@section('second-breadcrumb')
    <li> Edit About</li>
@endsection

@section('content')
    <div class="row">
        <div class="col-md-12">
            <div class="card bg-dark text-white"> <div class="card-body">
                    @if (session('success'))
                        <div class="alert alert-success alert-dismissible fade show" role="alert">
                            {{session('success')}}
                            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                <span aria-hidden="true">&times;</span>
                            </button>
                        </div>
                    @endif
                    
                    <h3 class="text-center mt-3 mb-5" style="color: #d4af37;">Manajemen Konten Utama (Lampung Wedding Light)</h3>
                    
                    <form action="{{route('heros.update', [$heros->id])}}" method="POST" enctype="multipart/form-data">
                        @csrf
                        @method('PUT')

                        <div class="row">
                            <div class="col-12 mb-5">
                                <h5 style="border-left: 4px solid #d4af37; padding-left: 10px;">Pengaturan Hero (Banner Utama)</h5>
                                <div class="row mt-3">
                                    <div class="col-md-4">
                                        <p>Background Hero Saat Ini:</p>
                                        <div class="card shadow">
                                            <img src="{{asset('user/images/'.$heros->image)}}" class="card-img-top" style="height: 150px; object-fit: cover;">
                                        </div>
                                        <input type="file" name="image" class="mt-2">
                                    </div>
                                    <div class="col-md-8">
                                        <div class="form-group">
                                            <label>Judul Hero (Heading 1)</label>
                                            <input type="text" name="title" class="form-control" value="{{$heros->title}}">
                                        </div>
                                        <div class="form-group">
                                            <label>Sub-Judul Hero (Heading 2)</label>
                                            <textarea name="subtitle" class="form-control" rows="2">{{$heros->subtitle}}</textarea>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <hr style="border-color: #333; width: 100%;">

                            <div class="col-12 mt-4">
                                    <div class="col-md-9">
                                        <div class="mt-4 text-right">
                                            <button type="submit" class="btn btn-success btn-lg px-5"> Simpan Perubahan</button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('script')
    {{-- ckeditor --}}
    <script src="/templateEditor/ckeditor/ckeditor.js"></script> 
    <script src="/templateEditor/ckeditor/config.js"></script>
    <script>
        
        // CKEDITOR.replace( 'content', {
        //     filebrowserUploadUrl    : "{{route('articles.upload', ['_token' => csrf_token()])}}",
        //     filebrowserUploadMethod : 'form',
        //     height: 100,
        //     removeButtons : 'Source,Save,NewPage,Print,Templates,Cut,Copy,Paste,PasteText,PasteFromWord,Undo,Redo,SelectAll,Form,Checkbox,Radio,TextField,Textarea,Button,ImageButton,HiddenField,RemoveFormat,CreateDiv,Anchor,Image,Flash,Table,Iframe,InsertPre,HorizontalRule' 
        // });

        CKEDITOR.replace('content', {
            filebrowserUploadUrl    : "{{route('articles.upload', ['_token' => csrf_token()])}}",
            filebrowserUploadMethod : 'form',
            height: 150,
            // Define the toolbar groups as it is a more accessible solution.
            toolbarGroups: [{
                "name": "basicstyles",
                "groups": ["basicstyles"]
                },
                {
                "name": "links",
                "groups": ["links"]
                },
                {
                "name": "paragraph",
                "groups": ["list", "blocks"]
                },
                {
                "name": "document",
                "groups": ["mode"]
                },
                {
                "name": "insert",
                "groups": ["insert"]
                },
                {
                "name": "styles",
                "groups": ["styles"]
                },
                {
                "name": "about",
                "groups": ["about"]
                }
            ],
            // Remove the redundant buttons from toolbar groups defined above.
            removeButtons: 'Strike,Subscript,Superscript,Anchor,Specialchar,Image,Print,Save,NewPage,Source,Table,Iframe,PageBreak,CreateDiv'
            });

              

    </script>
@endsection