@extends('admin.template.master')

@section('stylesheets')
    <style>
        .notActive {
            background-color: white;
            color: #333;
        }

        .notActive:hover {
            background-color: #eeeeee;
            color: #333;
        }

        .notActive:active {
            background-color: #dddddd !important;
            color: #333 !important;
        }

        .ck-editor__editable[role="textbox"] {
            /* editing area */
            min-height: 400px;
        }
        .ck-content .image {
            /* block images */
            max-width: 80%;
            margin: 20px auto;
        }
    </style>
@endsection

@section('title')
    <!-- Content Header (Page header) -->
    <section class="content-header">
        <h1>
            CMS Editor
            <small>insert and update cms editor</small>
        </h1>
        <ol class="breadcrumb">
            <li><a href="{!! url('admin/') !!}"><i class="fa fa-dashboard"></i> Home</a></li>
            <li><a href="{!! url('/admin/cms-editors') !!}">CMS Editor</a></li>
            <li class="active">Update</li>
        </ol>
    </section>
@endsection

@section('main-content')
    <!-- Main content -->
    <section class="content">
        <div class="row">
            <!-- left column -->
            <div class="col-md-12">
                <!-- general form elements -->
                <div class="box box-primary">
                    <div class="box-header with-border">
                        <h3 class="box-title">Entry</h3>
                    </div>
                    <!-- /.box-header -->
                    <!-- form start -->
                    {!! Form::open(['method' => 'PUT', 'url' => '/admin/cms-editors/' .$cmsEditor->cms_editor_id]) !!}
                    <div class="box-body">
                        <div class="nav-tabs-custom">
                            <ul class="nav nav-tabs">
                                <li class="active"><a href="#basic_settings" data-toggle="tab" aria-expanded="false">Basic
                                        Settings</a></li>
                                <li class=""><a href="#advanced_settings" data-toggle="tab" aria-expanded="true">Advanced
                                        Settings</a></li>
                            </ul>
                            <div class="tab-content">
                                {{--Basic Settings--}}
                                <div class="tab-pane active" id="basic_settings">
                                    <div class="form-group @if($errors->has('cms_editor_title')) has-error @endif">
                                        {!! Form::label('Title') !!}
                                        {!! Form::text('cms_editor_title', $cmsEditor->cms_editor_title, ['class' => 'form-control', 'placeholder' => 'Title', 'id' => 'cms_editor_title']) !!}
                                        @if ($errors->has('cms_editor_title'))
                                            <span class="help-block">{!! $errors->first('cms_editor_title') !!}</span>@endif
                                    </div>

                                    <div class="form-group @if($errors->has('cms_editor_slug')) has-error @endif">
                                        {!! Form::label('Slug') !!}
                                        {!! Form::text('cms_editor_slug', $cmsEditor->cms_editor_slug, ['class' => 'form-control', 'placeholder' => 'Slug', 'id' => 'cms_editor_slug']) !!}
                                        @if ($errors->has('cms_editor_slug'))
                                            <span class="help-block">{!! $errors->first('cms_editor_slug') !!}</span>@endif
                                    </div>

                                    <div class="form-group @if($errors->has('cms_editor_details')) has-error @endif">
                                        {!! Form::label('Details') !!}
                                        {!! Form::textarea('cms_editor_details', $cmsEditor->cms_editor_details, ['class' => 'form-control', 'rows' => 20,  'placeholder' => 'Details', 'id' => 'cms_editor_details']) !!}
                                        @if ($errors->has('cms_editor_details'))
                                            <span class="help-block">{!! $errors->first('cms_editor_details') !!}</span>@endif
                                    </div>

                                    <div class="form-group">
                                        {!! Form::label('Status') !!}
                                        {!! Form::select('cms_editor_is_exist', [1 => 'Active', 0 => 'Inactive'], isset($cmsEditor->cms_editor_is_exist) ? $cmsEditor->cms_editor_is_exist : null, ['class' => 'form-control']) !!}
                                    </div>
                                </div>
                                {{--Advanced Settings--}}
                                <div class="tab-pane" id="advanced_settings">
                                    <div class="form-group @if($errors->has('cms_meta_title')) has-error @endif">
                                        {!! Form::label('Meta Title') !!}
                                        {!! Form::text('cms_meta_title', $cmsEditor->cms_meta_title, ['class' => 'form-control', 'placeholder' => 'Enter Meta Title']) !!}
                                        @if ($errors->has('cms_meta_title'))
                                            <span class="help-block">{!! $errors->first('cms_meta_title') !!}</span>@endif
                                    </div>

                                    <div class="form-group @if($errors->has('cms_meta_keyword')) has-error @endif">
                                        {!! Form::label('Meta Keyword') !!}
                                        {!! Form::textarea('cms_meta_keyword', $cmsEditor->cms_meta_keyword, ['class' => 'form-control', 'placeholder' => 'Enter Meta Keyword']) !!}
                                        @if ($errors->has('cms_meta_keyword'))
                                            <span class="help-block">{!! $errors->first('cms_meta_keyword') !!}</span>@endif
                                    </div>

                                    <div class="form-group @if($errors->has('cms_meta_description')) has-error @endif">
                                        {!! Form::label('Meta Description') !!}
                                        {!! Form::textarea('cms_meta_description', $cmsEditor->cms_meta_description, ['class' => 'form-control', 'placeholder' => 'Enter Meta Description']) !!}
                                        @if ($errors->has('cms_meta_description'))
                                            <span class="help-block">{!! $errors->first('cms_meta_description') !!}</span>@endif
                                    </div>

                                    <div class="form-group @if($errors->has('cms_search_keyword')) has-error @endif">
                                        {!! Form::label('Search Keyword') !!}
                                        {!! Form::textarea('cms_search_keyword', $cmsEditor->cms_search_keyword, ['class' => 'form-control', 'placeholder' => 'Enter Meta Keyword']) !!}
                                        @if ($errors->has('cms_search_keyword'))
                                            <span class="help-block">{!! $errors->first('cms_search_keyword') !!}</span>@endif
                                    </div>
                                </div>
                            </div>
                        </div>

                    </div><!-- /.box-body -->
                    <div class="box-footer">
                        {!! Form::submit('Update',['class' => 'btn btn-warning']) !!}
                    </div>
                    {!! Form::close() !!}
                </div>
                <!-- /.box -->
            </div>
            <!--/.col (left) -->
        </div>
        <!-- /.row -->
    </section>
    <!-- /.content -->
@endsection

@section('javascripts')
    {{-- {!! Html::script('assets/admin/bower_components/ckeditor/ckeditor.js') !!} --}}
    {{-- {!! Html::script('assets/admin/ckeditor/ckeditor.js') !!} --}}

    <script src="https://cdn.ckeditor.com/ckeditor5/35.3.2/super-build/ckeditor.js"></script>
    <script>
        CKEDITOR.ClassicEditor.create(document.getElementById("cms_editor_details"), {
                // https://ckeditor.com/docs/ckeditor5/latest/features/toolbar/toolbar.html#extended-toolbar-configuration-format
                toolbar: {
                    items: [
                        // 'exportPDF','exportWord', '|',
                        'findAndReplace', 'selectAll', '|',
                        'heading', '|',
                        'bold', 'italic', 'strikethrough', 'underline', 'code', 'subscript', 'superscript', 'removeFormat', '|',
                        'bulletedList', 'numberedList', 'todoList', '|',
                        'outdent', 'indent', '|',
                        'undo', 'redo',
                        '-',
                        'fontSize', 'fontFamily', 'fontColor', 'fontBackgroundColor', 'highlight', '|',
                        'alignment', '|',
                        'link', 'insertImage', 'blockQuote', 'insertTable', 'mediaEmbed', 'codeBlock', 'htmlEmbed', '|',
                        'specialCharacters', 'horizontalLine', 'pageBreak', '|',
                        // 'textPartLanguage', '|',
                        'sourceEditing'
                    ],
                    shouldNotGroupWhenFull: true
                },
                // Changing the language of the interface requires loading the language file using the <script> tag.
                // language: 'es',
                list: {
                    properties: {
                        styles: true,
                        startIndex: true,
                        reversed: true
                    }
                },
                // https://ckeditor.com/docs/ckeditor5/latest/features/headings.html#configuration
                heading: {
                    options: [
                        { model: 'paragraph', title: 'Paragraph', class: 'ck-heading_paragraph' },
                        { model: 'heading1', view: 'h1', title: 'Heading 1', class: 'ck-heading_heading1' },
                        { model: 'heading2', view: 'h2', title: 'Heading 2', class: 'ck-heading_heading2' },
                        { model: 'heading3', view: 'h3', title: 'Heading 3', class: 'ck-heading_heading3' },
                        { model: 'heading4', view: 'h4', title: 'Heading 4', class: 'ck-heading_heading4' },
                        { model: 'heading5', view: 'h5', title: 'Heading 5', class: 'ck-heading_heading5' },
                        { model: 'heading6', view: 'h6', title: 'Heading 6', class: 'ck-heading_heading6' }
                    ]
                },
                // https://ckeditor.com/docs/ckeditor5/latest/features/editor-placeholder.html#using-the-editor-configuration
                placeholder: 'Long Description',
                // https://ckeditor.com/docs/ckeditor5/latest/features/font.html#configuring-the-font-family-feature
                fontFamily: {
                    options: [
                        'default',
                        'Arial, Helvetica, sans-serif',
                        'Courier New, Courier, monospace',
                        'Georgia, serif',
                        'Lucida Sans Unicode, Lucida Grande, sans-serif',
                        'Tahoma, Geneva, sans-serif',
                        'Times New Roman, Times, serif',
                        'Trebuchet MS, Helvetica, sans-serif',
                        'Verdana, Geneva, sans-serif'
                    ],
                    supportAllValues: true
                },
                // https://ckeditor.com/docs/ckeditor5/latest/features/font.html#configuring-the-font-size-feature
                fontSize: {
                    options: [ 10, 12, 14, 'default', 18, 20, 22 ],
                    supportAllValues: true
                },
                // Be careful with the setting below. It instructs CKEditor to accept ALL HTML markup.
                // https://ckeditor.com/docs/ckeditor5/latest/features/general-html-support.html#enabling-all-html-features
                htmlSupport: {
                    allow: [
                        {
                            name: /.*/,
                            attributes: true,
                            classes: true,
                            styles: true
                        }
                    ]
                },
                // Be careful with enabling previews
                // https://ckeditor.com/docs/ckeditor5/latest/features/html-embed.html#content-previews
                htmlEmbed: {
                    showPreviews: true
                },
                // https://ckeditor.com/docs/ckeditor5/latest/features/link.html#custom-link-attributes-decorators
                link: {
                    decorators: {
                        addTargetToExternalLinks: true,
                        defaultProtocol: 'https://',
                        toggleDownloadable: {
                            mode: 'manual',
                            label: 'Downloadable',
                            attributes: {
                                download: 'file'
                            }
                        }
                    }
                },
                // https://ckeditor.com/docs/ckeditor5/latest/features/mentions.html#configuration
                mention: {
                    feeds: [
                        {
                            marker: '@',
                            feed: [
                                '@apple', '@bears', '@brownie', '@cake', '@cake', '@candy', '@canes', '@chocolate', '@cookie', '@cotton', '@cream',
                                '@cupcake', '@danish', '@donut', '@dragée', '@fruitcake', '@gingerbread', '@gummi', '@ice', '@jelly-o',
                                '@liquorice', '@macaroon', '@marzipan', '@oat', '@pie', '@plum', '@pudding', '@sesame', '@snaps', '@soufflé',
                                '@sugar', '@sweet', '@topping', '@wafer'
                            ],
                            minimumCharacters: 1
                        }
                    ]
                },
                // The "super-build" contains more premium features that require additional configuration, disable them below.
                // Do not turn them on unless you read the documentation and know how to configure them and setup the editor.
                removePlugins: [
                    // These two are commercial, but you can try them out without registering to a trial.
                    // 'ExportPdf',
                    // 'ExportWord',
                    'CKBox',
                    'CKFinder',
                    'EasyImage',
                    // This sample uses the Base64UploadAdapter to handle image uploads as it requires no configuration.
                    // https://ckeditor.com/docs/ckeditor5/latest/features/images/image-upload/base64-upload-adapter.html
                    // Storing images as Base64 is usually a very bad idea.
                    // Replace it on production website with other solutions:
                    // https://ckeditor.com/docs/ckeditor5/latest/features/images/image-upload/image-upload.html
                    // 'Base64UploadAdapter',
                    'RealTimeCollaborativeComments',
                    'RealTimeCollaborativeTrackChanges',
                    'RealTimeCollaborativeRevisionHistory',
                    'PresenceList',
                    'Comments',
                    'TrackChanges',
                    'TrackChangesData',
                    'RevisionHistory',
                    'Pagination',
                    'WProofreader',
                    // Careful, with the Mathtype plugin CKEditor will not load when loading this sample
                    // from a local file system (file://) - load this site via HTTP server if you enable MathType
                    'MathType'
                ]
            });
    </script>

    <script type="text/javascript">
        $(function () {
            // CKEDITOR.replace( 'cms_editor_details', {
            //     height: 400,
            //     allowedContent: true,
            //     extraPlugins: 'pastefromword'
            // } );

            $('#radioBtn a').on('click', function () {
                var sel = $(this).data('title');
                var tog = $(this).data('toggle');
                $('#' + tog).prop('value', sel);

                $('a[data-toggle="' + tog + '"]').not('[data-title="' + sel + '"]').removeClass('active').addClass('notActive');
                $('a[data-toggle="' + tog + '"][data-title="' + sel + '"]').removeClass('notActive').addClass('active');
            });

            // Create slug
            function convertToSlug(Text) {
                return Text
                    .toLowerCase()
                    .replace(/ /g, '-')
                    .replace(/[^\w-]+/g, '')
                    ;
            }

            $("#cms_editor_title").blur(function () {
                var productName = $(this).val();
                var slug = convertToSlug(productName);
                $("#cms_editor_slug").val(slug);
            });
            // Create slug
        })
    </script>
@endsection