@extends('layouts.admin')
@section('title')
    تنظیمات بنر صفحه اصلی
@endsection
@section('content')
    <div class="page-wrapper">
        <!-- ============================================================== -->
        <!-- Container fluid  -->
        <!-- ============================================================== -->
        <div class="container-fluid">
            <!-- ============================================================== -->
            <!-- Start Page Content -->
            <!-- ============================================================== -->
            <div class="row">
                <div class="col-12">
                    <div class="card">
                        <div class="card-body">
                            <h4 class="card-title">تنظیمات بنر صفحه اصلی</h4>
                            @include('admin.index.messages')

                            <form class="m-t-30" action="/admin/news/banner-settings" method="post" enctype="multipart/form-data">
                                @csrf

                                <!-- Persian Language Section -->
                                <div class="row">
                                    <div class="col-md-12">
                                        <h5 class="mb-3">زبان فارسی</h5>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="form-group banner-input-group" data-setting-key="home_banner_banner_fa" data-current-value="{{ @$settings->where('name','home_banner_banner_fa')->first()->value }}">
                                            <label>بنر مناسبتی (فارسی)</label>
                                            <div class="mb-2">
                                                <label style="margin-left:10px">
                                                    <input type="radio" class="banner-input-type" name="home_banner_banner_fa_type" value="file"> تصویر
                                                </label>
                                                <label>
                                                    <input type="radio" class="banner-input-type" name="home_banner_banner_fa_type" value="iframe"> iFrame
                                                </label>
                                            </div>
                                            <input type="file" class="form-control file-upload banner-file-input" name="home_banner_banner_fa" id="home_banner_banner_fa">
                                            <input type="text" class="form-control banner-iframe-input" name="home_banner_banner_fa" value="{{ old('home_banner_banner_fa', @$settings->where('name','home_banner_banner_fa')->first()->value) }}" placeholder="کد iFrame را اینجا وارد کنید" style="margin-top:8px">
                                            @if($errors->has('home_banner_banner_fa'))
                                                <span class="text-danger">{{ $errors->first('home_banner_banner_fa') }}</span>
                                            @endif
                                            @php($__valFa = @$settings->where('name','home_banner_banner_fa')->first()->value)
                                            @if($__valFa && preg_match('/\.(jpg|jpeg|png|gif|webp|svg)$/i', $__valFa))
                                                <div class="mt-2">
                                                    <img src="{{ asset($__valFa) }}" style="max-height: 150px; max-width: 100%;">
                                                </div>
                                            @endif
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="home_banner_banner_text_fa">متن بنر مناسبتی (فارسی)</label>
                                            <input type="text" class="form-control" name="home_banner_banner_text_fa" value="{{ old('home_banner_banner_text_fa', @$settings->where('name','home_banner_banner_text_fa')->first()->value) }}" id="home_banner_banner_text_fa">
                                            @if($errors->has('home_banner_banner_text_fa'))
                                                <span class="text-danger">{{ $errors->first('home_banner_banner_text_fa') }}</span>
                                            @endif
                                        </div>
                                    </div>
                                </div>

                                <hr class="my-4">

                                <!-- English Language Section -->
                                <div class="row">
                                    <div class="col-md-12">
                                        <h5 class="mb-3">زبان انگلیسی</h5>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="form-group banner-input-group" data-setting-key="home_banner_banner_en" data-current-value="{{ @$settings->where('name','home_banner_banner_en')->first()->value }}">
                                            <label>بنر مناسبتی (انگلیسی)</label>
                                            <div class="mb-2">
                                                <label style="margin-left:10px">
                                                    <input type="radio" class="banner-input-type" name="home_banner_banner_en_type" value="file"> تصویر
                                                </label>
                                                <label>
                                                    <input type="radio" class="banner-input-type" name="home_banner_banner_en_type" value="iframe"> iFrame
                                                </label>
                                            </div>
                                            <input type="file" class="form-control file-upload banner-file-input" name="home_banner_banner_en" id="home_banner_banner_en">
                                            <input type="text" class="form-control banner-iframe-input" name="home_banner_banner_en" value="{{ old('home_banner_banner_en', @$settings->where('name','home_banner_banner_en')->first()->value) }}" placeholder="Paste iFrame code here" style="margin-top:8px">
                                            @if($errors->has('home_banner_banner_en'))
                                                <span class="text-danger">{{ $errors->first('home_banner_banner_en') }}</span>
                                            @endif
                                            @php($__valEn = @$settings->where('name','home_banner_banner_en')->first()->value)
                                            @if($__valEn && preg_match('/\.(jpg|jpeg|png|gif|webp|svg)$/i', $__valEn))
                                                <div class="mt-2">
                                                    <img src="{{ asset($__valEn) }}" style="max-height: 150px; max-width: 100%;">
                                                </div>
                                            @endif
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="home_banner_banner_text_en">متن بنر مناسبتی (انگلیسی)</label>
                                            <input type="text" class="form-control" name="home_banner_banner_text_en" value="{{ old('home_banner_banner_text_en', @$settings->where('name','home_banner_banner_text_en')->first()->value) }}" id="home_banner_banner_text_en">
                                            @if($errors->has('home_banner_banner_text_en'))
                                                <span class="text-danger">{{ $errors->first('home_banner_banner_text_en') }}</span>
                                            @endif
                                        </div>
                                    </div>
                                </div>

                                <hr class="my-4">

                                <!-- Russian Language Section -->
                                <div class="row">
                                    <div class="col-md-12">
                                        <h5 class="mb-3">زبان روسی</h5>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="form-group banner-input-group" data-setting-key="home_banner_banner_ru" data-current-value="{{ @$settings->where('name','home_banner_banner_ru')->first()->value }}">
                                            <label>بنر مناسبتی (روسی)</label>
                                            <div class="mb-2">
                                                <label style="margin-left:10px">
                                                    <input type="radio" class="banner-input-type" name="home_banner_banner_ru_type" value="file"> تصویر
                                                </label>
                                                <label>
                                                    <input type="radio" class="banner-input-type" name="home_banner_banner_ru_type" value="iframe"> iFrame
                                                </label>
                                            </div>
                                            <input type="file" class="form-control file-upload banner-file-input" name="home_banner_banner_ru" id="home_banner_banner_ru">
                                            <input type="text" class="form-control banner-iframe-input" name="home_banner_banner_ru" value="{{ old('home_banner_banner_ru', @$settings->where('name','home_banner_banner_ru')->first()->value) }}" placeholder="Вставьте код iFrame здесь" style="margin-top:8px">
                                            @if($errors->has('home_banner_banner_ru'))
                                                <span class="text-danger">{{ $errors->first('home_banner_banner_ru') }}</span>
                                            @endif
                                            @php($__valRu = @$settings->where('name','home_banner_banner_ru')->first()->value)
                                            @if($__valRu && preg_match('/\.(jpg|jpeg|png|gif|webp|svg)$/i', $__valRu))
                                                <div class="mt-2">
                                                    <img src="{{ asset($__valRu) }}" style="max-height: 150px; max-width: 100%;">
                                                </div>
                                            @endif
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="home_banner_banner_text_ru">متن بنر مناسبتی (روسی)</label>
                                            <input type="text" class="form-control" name="home_banner_banner_text_ru" value="{{ old('home_banner_banner_text_ru', @$settings->where('name','home_banner_banner_text_ru')->first()->value) }}" id="home_banner_banner_text_ru">
                                            @if($errors->has('home_banner_banner_text_ru'))
                                                <span class="text-danger">{{ $errors->first('home_banner_banner_text_ru') }}</span>
                                            @endif
                                        </div>
                                    </div>
                                </div>

                                <div class="form-actions">
                                    <div class="text-right">
                                        <button type="submit" class="btn btn-success">
                                            <i class="mdi mdi-check"></i> ذخیره تنظیمات
                                        </button>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

@endsection

@section('script')
    <script>
        $(function (){
            function initBannerInputGroup($group){
                var currentVal = ($group.data('current-value') || '').toString();
                var looksLikeImage = /\.(jpg|jpeg|png|gif|webp|svg)$/i.test(currentVal);
                var $fileInput = $group.find('.banner-file-input');
                var $iframeInput = $group.find('.banner-iframe-input');
                var $typeRadios = $group.find('.banner-input-type');

                function setMode(mode){
                    if(mode === 'file'){
                        $fileInput.prop('disabled', false).show();
                        $iframeInput.prop('disabled', true).hide();
                    } else {
                        $fileInput.prop('disabled', true).hide();
                        $iframeInput.prop('disabled', false).show();
                    }
                }

                if(currentVal && !looksLikeImage){
                    $typeRadios.filter('[value="iframe"]').prop('checked', true);
                    setMode('iframe');
                } else {
                    $typeRadios.filter('[value="file"]').prop('checked', true);
                    setMode('file');
                }

                $typeRadios.on('change', function(){
                    setMode($(this).val());
                });

                // When user types an iframe, send to settings
                $iframeInput.on('keyup change blur', function(){
                    var value = $(this).val();
                    var name = $(this).attr('name');
                    if(value && value.trim() !== ''){
                        $.ajax({
                            url: '/admin/setting',
                            type: 'POST',
                            data: { name: name, value: value, _token: '{{ csrf_token() }}' }
                        });
                    }
                });
            }

            $('.banner-input-group').each(function(){
                initBannerInputGroup($(this));
            });

            // Auto-save functionality for text fields
            $('.form-control[name*="text"]').on('blur', function() {
                let value = $(this).val();
                let name = $(this).attr('name');

                // Only send if value is not empty
                if (value && value.trim() !== '') {
                    $.ajax({
                        url: '/admin/setting',
                        type: "POST",
                        data: {
                            name: name,
                            value: value,
                            _token: '{{ csrf_token() }}'
                        }
                    });
                }
            });

            // Auto-upload functionality for file fields
            $('.file-upload').on('change', function () {
                let fileInput = this;
                let file = fileInput.files[0];
                let name = $(this).attr('name');

                if (!file) return;

                let formData = new FormData();
                formData.append('value', file);
                formData.append('name', name);
                formData.append('_token', '{{ csrf_token() }}');

                $.ajax({
                    url: '/admin/setting',
                    type: 'POST',
                    data: formData,
                    contentType: false,
                    processData: false,
                    success: function (response) {
                        location.reload();
                    }
                });
            });
        });
    </script>
@endsection