@extends('layouts.app_layout')

@section('content')
<x-page-header title="{{ $pageTitle }}" :backButton="true" />

<div class="row">
    <div class="col-12">
        <div class="card">
            <div class="card-body">
                <form id="site-settings-form" enctype="multipart/form-data">
                    @csrf
                    <div class="row">
                        <div class="form-group col-md-6 col-sm-12 col-12">
                            <label class="form-label" for="site_name">Site Name <span class="text-danger">*</span></label>
                            <input type="text" class="form-control" id="site_name" name="site_name" value="{{ $settings->site_name ?? '' }}" required>
                        </div>
                        <div class="form-group col-md-6 col-sm-12 col-12">
                            <label class="form-label" for="site_name_hi">Site Name (Hi) <span class="text-danger">*</span></label>
                            <input type="text" class="form-control" id="site_name_hi" name="site_name_hi" value="{{ $settings->site_name_hi ?? '' }}" required>
                        </div>
                        <div class="form-group col-md-6 col-sm-12 col-12">
                            <label class="form-label" for="site_tag_line">Site Tag Line</label>
                            <input type="text" class="form-control" id="site_tag_line" name="site_tag_line" value="{{ $settings->site_tag_line ?? '' }}">
                        </div>
                        <div class="form-group col-md-6 col-sm-12 col-12">
                            <label class="form-label" for="site_tag_line_hi">Site Tag Line (Hi)</label>
                            <input type="text" class="form-control" id="site_tag_line_hi" name="site_tag_line_hi" value="{{ $settings->site_tag_line_hi ?? '' }}">
                        </div>
                        <div class="form-group col-md-6 col-sm-12 col-12">
                            <label class="form-label" for="seo_keywords">SEO Keywords</label>
                            <input type="text" class="form-control" id="seo_keywords" name="seo_keywords" value="{{ $settings->seo_keywords ?? '' }}">
                        </div>
                        <div class="form-group col-md-6 col-sm-12 col-12">
                            <label class="form-label" for="seo_keywords_hi">SEO Keywords (Hi)</label>
                            <input type="text" class="form-control" id="seo_keywords_hi" name="seo_keywords_hi" value="{{ $settings->seo_keywords_hi ?? '' }}">
                        </div>
                        <div class="form-group col-md-6 col-sm-12 col-12">
                            <label class="form-label" for="seo_description">SEO Description</label>
                            <textarea class="form-control" id="seo_description" name="seo_description">{{ $settings->seo_description ?? '' }}</textarea>
                        </div>
                        <div class="form-group col-md-6 col-sm-12 col-12">
                            <label class="form-label" for="seo_description_hi">SEO Description (Hi)</label>
                            <textarea class="form-control" id="seo_description_hi" name="seo_description_hi">{{ $settings->seo_description_hi ?? '' }}</textarea>
                        </div>
                        <div class="col-12">
                            <div class="row">
                                <div class="col-md-3 col-sm-6 col-12">
                                    <div class="form-group">
                                        <label class="form-label" for="header_logo">Header Logo</label>
                                        <input type="file" class="form-control-file form-control" id="header_logo" name="header_logo">
                                        @if($settings->header_logo)
                                        <div>
                                            <img src="{{ asset('storage' . Config::get('file_paths')['SITE_HEADER_LOGO_PATH'].'/' . $settings->header_logo) }}" alt="Header" class="img-thumbnail" style="width: 150px;" />
                                        </div>
                                        @endif
                                    </div>
                                </div>

                                <div class="col-md-3 col-sm-6 col-12">
                                    <div class="form-group">
                                        <label class="form-label" for="header_logo_hi">Header Logo (Hi)</label>
                                        <input type="file" class="form-control-file form-control" id="header_logo_hi" name="header_logo_hi">
                                        @if($settings->header_logo_hi)
                                        <div>
                                            <img src="{{ asset('storage' . Config::get('file_paths')['SITE_HEADER_LOGO_PATH'].'/' . $settings->header_logo_hi) }}" alt="Header Logo for hindi" class="img-thumbnail" style="width: 150px;" />
                                        </div>
                                        @endif
                                    </div>
                                </div>
                                <div class="col-md-3 col-sm-6 col-12">
                                    <div class="form-group">
                                        <label class="form-label" for="footer_logo">Footer Logo</label>
                                        <input type="file" class="form-control-file form-control" id="footer_logo" name="footer_logo">
                                        @if($settings->footer_logo)
                                        <div>
                                            <img src="{{ asset('storage' . Config::get('file_paths')['SITE_FOOTER_LOGO_PATH'].'/' . $settings->footer_logo) }}" alt="Header" class="img-thumbnail" style="width: 150px;" />
                                        </div>
                                        @endif
                                    </div>
                                </div>
                                <div class="col-md-3 col-sm-6 col-12">
                                    <div class="form-group">
                                        <label class="form-label" for="favicon">FavIcon</label>
                                        <input type="file" class="form-control-file form-control" id="favicon" name="favicon">
                                        @if($settings->favicon)
                                        <div>
                                            <img src="{{ asset('storage' . Config::get('file_paths')['SITE_FAVICON_PATH'].'/' . $settings->favicon) }}" alt="Header" class="img-thumbnail" style="width: 150px;" />
                                        </div>
                                        @endif
                                    </div>
                                </div>
                                <div class="col-md-3 col-sm-6 col-12">
                                    <div class="form-group">
                                        <label class="form-label" for="admin_panel_logo">AdminPanel Logo </label>
                                        <input type="file" class="form-control-file form-control" id="admin_panel_logo" name="admin_panel_logo">
                                        @if($settings->admin_panel_logo)
                                        <div>
                                            <img src="{{ asset('storage' . Config::get('file_paths')['SITE_ADMIN_PANEL_LOGO_PATH'].'/' . $settings->admin_panel_logo) }}" alt="Header" class="img-thumbnail" style="width: 150px;" />
                                        </div>
                                        @endif
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="form-group col-md-6 col-sm-12 col-12">
                            <label class="form-label" for="copyright_text">Copyright Text</label>
                            <input type="text" class="form-control" id="copyright_text" name="copyright_text" value="{{ $settings->copyright_text ?? '' }}">
                        </div>

                        <div class="form-group col-md-6 col-sm-12 col-12">
                            <label class="form-label" for="copyright_text_hi">Copyright Text (Hi)</label>
                            <input type="text" class="form-control" id="copyright_text_hi" name="copyright_text_hi" value="{{ $settings->copyright_text_hi ?? '' }}">
                        </div>

                        <div class="form-group col-md-6 col-sm-12 col-12">
                            <label class="form-label" for="maintained_by_text">Maintained By Text</label>
                            <input type="text" class="form-control" id="maintained_by_text" name="maintained_by_text" value="{{ $settings->maintained_by_text ?? '' }}">
                        </div>

                        <div class="form-group col-md-6 col-sm-12 col-12">
                            <label class="form-label" for="maintained_by_text_hi">Maintained By Text (Hi)</label>
                            <input type="text" class="form-control" id="maintained_by_text_hi" name="maintained_by_text_hi" value="{{ $settings->maintained_by_text_hi ?? '' }}">
                        </div>

                        <div class="form-group col-md-6 col-sm-12 col-12">
                            <label class="form-label" for="accessibility_text">Accessibility Text</label>
                            <input type="text" class="form-control" id="accessibility_text" name="accessibility_text" value="{{ $settings->accessibility_text ?? '' }}">
                        </div>

                        <div class="form-group col-md-6 col-sm-12 col-12">
                            <label class="form-label" for="accessibility_text_hi">Accessibility Text (Hi)</label>
                            <input type="text" class="form-control" id="accessibility_text_hi" name="accessibility_text_hi" value="{{ $settings->accessibility_text_hi ?? '' }}">
                        </div>

                    </div>

                    <div class="text-center">
                        <button type="submit" class="btn btn-primary">
                            <i class="fa fa-save"></i> Save Settings</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
@endsection

@section('pages-scripts')
<script>
    $(document).ready(function() {
        $('#site-settings-form').validate({
            rules: {
                site_name: {
                    required: true,
                    minlength: 3
                },
                site_tag_line: {
                    required: false,
                    minlength: 3
                },
                seo_keywords: {
                    required: false
                },
                seo_description: {
                    required: false
                }
            },
            messages: {
                site_name: {
                    required: "Please enter the site name.",
                    minlength: "The site name must be at least 3 characters long."
                },
                site_tag_line: {
                    minlength: "The site tag line must be at least 3 characters long."
                },
            },
            submitHandler: function(form) {
                var formData = new FormData(form);
                formData.append('_method', 'PUT'); // Spoofing the PUT method
                $.ajax({
                    url: "{{ route('site-settings.update', $settings->id) }}",
                    type: "POST",
                    data: formData,
                    contentType: false,
                    processData: false,
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                    },
                    success: function(response) {
                        if (response.success) {
                            Swal.fire({
                                title: 'Success!',
                                text: response.message,
                                icon: 'success',
                                confirmButtonText: 'OK'
                            }).then((result) => {
                                if (result.isConfirmed) {
                                    location.reload();
                                }
                            });
                        } else {
                            toastr.error(response.message);
                        }
                    },
                    error: function(xhr) {
                        if (xhr.status === 422) {
                            let errors = xhr.responseJSON.errors;
                            let errorMessages = Object.values(errors).flat().join("<br>");
                            Swal.fire({
                                title: "Validation Error",
                                html: errorMessages,
                                icon: "error"
                            });
                        } else {
                            Swal.fire({
                                title: "Error!",
                                text: xhr.responseJSON.message || "Something went wrong. Please try again.",
                                icon: "error"
                            });
                        }
                    }
                });
            }
        });
    });
</script>
@endsection