@extends('admin.layouts.container')

@section('content')
    <div class="side-title">
        <h3>{{ $head ?? ''}}</h3>
    </div>

    <div class="border-item">
        <form class="form-row add_form form-submit-loader" method="post" action="{{ $action }}"
              enctype="multipart/form-data">
            @if($slider ?? ''  && $slider->id)
                @method('PUT')
            @endif
            @csrf

            <div class="form-group col-lg-12">
                <label>{{ meta('cat_slider_id', $lang) ?? __('sliders.cat_slider_id') }}</label>
                <select name="cat_slider_id"
                        class="form-control {{ $errors->has('cat_slider_id') ? 'is-invalid' : '' }}">
                    {{-- <option value="">{{__('sliders.cat_slider_id')}}</option> --}}
                    @foreach($categories as $category)
                        <option
                            {{old('cat_slider_id', $slider->cat_slider_id ?? null) == $category->id ? 'selected' : '' }}
                            value="{{ $category->id }}"
                            data-meta="{{ json_encode($category->meta) }}">
                            {{ $category->currentDescription->title ?? "" }}
                        </option>
                    @endforeach
                </select>
            </div> <!-- end of form-group -->

            <div class="row w-100 m-auto">
                @foreach($languages as $language)
                    <div class="form-group col-lg-6">
                        <label>{{ meta('title', $language->local) ?? __("sliders.title") }} {{ count($languages) > 1 ? "({$language->name})" : '' }} </label>
                        <input type="text"
                               class="form-control {{ $errors->has('title_'.$language->local) ? 'is-invalid' : '' }}"
                               name="title_{{ $language->local }}"
                               placeholder="{{ meta('title', $language->local) ?? __("sliders.title") }}"
                               value='{{ old("title_{$language->local}", $slider[$language->local]->title ?? "") }}'/>
                    </div>
                @endforeach

                @foreach(['subtitle', 'subtitle2'] as $moduleField)
                    @foreach($languages as $language)
                        <div class="form-group col-lg-6">
                            <label>
                                {{ meta($moduleField, $language->local) ?? __("sliders.$moduleField") }} {{ count($languages) > 1 ? "({$language->name})" : '' }}
                            </label>
                            <input type="text"
                                   class="form-control {{ $errors->has($moduleField.'_'.$language->local) ? 'is-invalid' : '' }}"
                                   name="{{ $moduleField }}_{{ $language->local }}"
                                   placeholder="{{ meta($moduleField, $language->local) ?? __("sliders.$moduleField") }}"
                                   value='{{ old($moduleField."_{$language->local}", $slider[$language->local]->{$moduleField} ?? "") }}'/>
                        </div>
                    @endforeach
                @endforeach

                @foreach($languages as $language)
                    <div class="form-group col-lg-6">
                        <label>{{ meta('description', $language->local) ?? __("sliders.description")}} {{ count($languages) > 1 ? "({$language->name})" : '' }} </label>
                        <textarea rows="5" id="description_{{ $language->local }}"
                                  name="description_{{ $language->local }}"
                                  class="form-control my-editor {{ $errors->has('description_'.$language->local) ? 'is-invalid' : '' }}"
                                  placeholder="{{ meta('description', $language->local) ?? __("sliders.description")}}">{{ old("description_{$language->local}", $slider[$language->local]->description ?? "") }}</textarea>
                    </div>
                @endforeach
            </div> <!-- end of row -->

            <div class="form-group col-lg-12">
                <label>{{ meta('type', $lang) ?? __("sliders.type") }} </label>
                <br/>
                @foreach(['photo', 'photo_link', 'photo_user'] as $type)
                    <div class="form-check form-check-inline">
                        <input class="form-check-input {{ $errors->has('type') ? 'is-invalid' : '' }}"
                               type="radio" name="type" id="exampleRadios{{ $type }}" value="{{ $type }}"
                            {{old('type', $slider->type ?? null) == $type ? 'checked' : '' }}>
                        <label class="form-check-label" for="exampleRadios{{ $type }}">
                            {{ __("sliders.type_$type") }}
                        </label>
                    </div>
                @endforeach
            </div> <!-- end of form-group -->

            <div class="form-group col-lg-12 full-width-select2 related_type type_photo_user">
                <label>{{ getUserRoleName('provider') }}</label>
                <select name="user_id" class="form-control select2 {{ $errors->has('user_id') ? 'is-invalid' : '' }}">
                    <option value="">{{ getUserRoleName('provider') }}</option>
                    @foreach($users as $user)
                        <option
                            {{old('user_id', $slider->user_id ?? null) == $user->id ? 'selected' : '' }} value="{{ $user->id }}">
                            {{ $user->name }}
                        </option>
                    @endforeach
                </select>
            </div> <!-- end of form-group -->

            <div class="form-group col-lg-12">
                <label>{{ meta('item_number', $lang) ?? __("sliders.item_number") }} </label>
                <input type="text"
                       class="form-control {{ $errors->has('item_number') ? 'is-invalid' : '' }}"
                       name="item_number"
                       placeholder="{{ meta('item_number', $lang) ?? __("sliders.item_number") }}"
                       value='{{ old("item_number", $slider->item_number ?? "") }}'/>
            </div> <!-- end of form-group -->

            <div class="form-group col-lg-12 related_type type_photo_link">
                <label>{{ meta('link', $lang) ?? __("sliders.link") }} </label>
                <input type="url"
                       class="form-control {{ $errors->has('link') ? 'is-invalid' : '' }}"
                       name="link"
                       placeholder="{{ meta('link', $lang) ?? __("sliders.link") }}"
                       value='{{ old("link", $slider->link ?? "") }}'/>
            </div> <!-- end of form-group -->

            <div class="form-group col-lg-12">
                <label>{{ meta('item_name', $lang) ?? __("sliders.item_name") }} </label>
                <input type="text"
                       class="form-control {{ $errors->has('item_name') ? 'is-invalid' : '' }}"
                       name="item_name"
                       placeholder="{{ meta('item_name', $lang) ?? __("sliders.item_name") }}"
                       value='{{ old("item_name", $slider->item_name ?? "") }}'/>
            </div> <!-- end of form-group -->

            @for($i = 2; $i <= $maxItemNames; $i++)
                <div class="form-group col-lg-12">
                    <label>{{ meta('item_name'.$i, $lang) ?? __("sliders.item_name$i") }} </label>
                    <input type="text"
                           class="form-control {{ $errors->has('item_name'.$i) ? 'is-invalid' : '' }}"
                           name="item_name{{ $i }}"
                           placeholder="{{ meta('item_name'.$i, $lang) ?? __("sliders.item_name$i") }}"
                           value='{{ old("item_name$i", $slider->{'item_name'.$i} ?? "") }}'/>
                </div> <!-- end of form-group -->
            @endfor

            @include('admin.partials._upload_photo', ['item_value'=>old('image', $slider->image ?? ''), 'label_name'=>meta('image', $lang) ?? __("sliders.image"), 'input_name'=>'image'])

            @for($i = 2; $i <= $maxImages; $i++)
                @include('admin.partials._upload_photo', [
                                'item_value' => old('image'.$i, $slider->{'image'.$i} ?? ''),
                                'label_name' => meta('image'.$i, $lang) ?? __("sliders.image$i"),
                                'input_name' => 'image'.$i,
                                'item_file_number' => $i,
                            ])
            @endfor

            {{-- <div class="form-group col-lg-12">
                <label>{{ meta('status', $lang) ?? __("sliders.status") }} </label>
                @foreach(['active', 'inactive'] as $status)
                    <div class="form-check">
                        <input class="form-check-input {{ $errors->has('status') ? 'is-invalid' : '' }}"
                               type="radio" name="status" id="exampleRadios{{ $status }}" value="{{ $status }}"
                                {{old('status', $slider->status ?? 'active') == $status ? 'checked' : '' }}>
                        <label class="form-check-label" for="exampleRadios{{ $status }}">
                            {{ __("general.$status") }}
                        </label>
                    </div>
                @endforeach
            </div> --}} <!-- end of form-group -->

            <div class="text-center mt-5 col-12">
                <button type="submit" class="butn add_button"><span>{{ __('dashboard.save') }}</span></button>
            </div>
        </form>
    </div>

@endsection

@section('inner_js')
    <!-- Editor JS files -->
    <script src="{{ asset('/assets/admin/js/lib/tinymce.min.js') }}"></script>
    <script>
        let route_prefix = "{{ url(config('lfm.prefix')) }}",
            url = "{{url('/')}}/",
            currentLanguage = "{{$lang}}",
            imagePath = "{{asset('')}}",
            inputName = null;
    </script>
    <script src="{{ asset('assets/admin/js/editor.js') }}"></script>

    <script>
        let catSelect = $('[name=cat_slider_id]');
        const sliderFields = {!! $sliderFields !!};
        const languages = {!! json_encode($languages) !!};
        catSelect.change(function () {
            let meta = $(this).find(':selected').data('meta');
            const langFields = ['description', 'subtitle', 'subtitle2'];
            if (sliderFields) {
                sliderFields.map(field => {
                    if (langFields.includes(field)) {
                        languages.map(lang => {
                            $(`[name=${field}_${lang.local}]`).closest('.form-group').hide();
                        });
                    } else {
                        $(`[name=${field}]`).closest('.form-group').hide();
                    }
                });
            }
            if (meta?.fields) {
                meta.fields.map(field => {
                    if (langFields.includes(field)) {
                        languages.map(lang => {
                            $(`[name=${field}_${lang.local}]`).closest('.form-group').show();
                        });
                    } else {
                        $(`[name=${field}]`).closest('.form-group').show();
                    }
                });
            }
        });
        catSelect.trigger("change");
    </script>

    <script>
        $("input[name=type]").change(function () {
            let typeValue = $(this).val();
            $('.related_type').hide();
            $(`.type_${typeValue}`).show();
        });
        $("input[name=type]:checked").trigger("change");
    </script>
@endsection