@extends('client.layouts.app')

@section('page_title', __('client.navigation.text_blocks'))

@section('content')
<div class="processes processes--create">
    <div class="container-fluid">
        <h1 class="page-title">{{ __('client.navigation.text_blocks') }}</h1>

        <div class="processes__create-form-wrapper">
            <form action="{{ route('client.settings.text_blocks.update', ['textBlock' => $item]) }}" method="POST">

                @method('PUT')
                @csrf
                @foreach(getLanguages() as $locale => $language)
                <h2 class="page-title">{{ $language }}</h2>
                                <div class="form-group row">
                    <label for="id-{{$nameField}}" class="col-12 col-form-label col-form-label--required">{{ __('client.global.' . $nameField) }}</label>

                    <div class="col-6">
                        <textarea id="id_{{ $locale }}" rows="8" class="form-control" name="{{ $locale }}[{{$nameField}}]">{{ old("$locale.$nameField", ($item->translate($locale) ? $item->translate($locale)->{$nameField} : '')) }}</textarea>
                        @error($nameField)
                        <span class="invalid-feedback" role="alert">
                        <strong>{{ $message }}</strong>
                    </span>
                        @enderror
                    </div>
                </div>
                @endforeach
                <div class="form-group row mb-3">
                    <div class="col-12 d-flex">
                        <button type="submit" class="btn btn--dark-red d-flex justify-content-center align-items-center">
                            {{ __('client.buttons.save') }}
                        </button>
                        <button type="button" onclick="window.location='{{route('client.settings.text_blocks.index')}}'" class="btn btn--cancel d-flex justify-content-center align-items-center">
                            {{ __('client.buttons.cancel') }}
                        </button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
@endsection
@section('custom_scripts')
    <script src="{{ asset('js/tinymce/tinymce.min.js') }}"></script>
    <script>
        tinymce.init({
            selector: 'textarea',
            branding: false,
            plugins: 'link image',
            height: 400,
            menubar: false,
            paste_data_images: true,
            toolbar: 'image | styleselect | bold italic underline | link | alignleft aligncenter alignright alignjustify | undo redo',
            image_advtab: true,
            file_picker_callback: function(callback, value, meta) {
                if (meta.filetype == 'image') {
                    $('#upload').trigger('click');
                    $('#upload').on('change', function() {
                        var file = this.files[0];
                        var reader = new FileReader();
                        reader.onload = function(e) {
                            callback(e.target.result, {
                                alt: ''
                            });
                        };
                        reader.readAsDataURL(file);
                    });
                }
            },
        });
    </script>

@endsection