@extends('layouts.admin.app')
@section('title', __('trans.setting.title'))

@section('content')
    <div class="card mb-4">
        {{-- <h5 class="card-header">@yield('title')</h5> --}}
        <div class="card-body">
            <form action="{{ url()->current() }}" method="post">@csrf

                <div class="row">

                    <div class="col-12">
                        <div class="divider divider-primary">
                            <div class="divider-text text-primary">{{ __('trans.setting.general') }}</div>
                        </div>
                    </div>

                    <div class="col-md-4 mb-3">
                        <label class="form-label">{{ __('trans.setting.name') }} <b class="text-danger">*</b></label>
                        <input type="text" class="form-control" required name="name"
                            value="{{ old('name', setting()->name) }}" />
                    </div>

                    <div class="col-md-4 mb-3">
                        <label class="form-label">{{ __('trans.setting.description') }} <b class="text-danger">*</b></label>
                        <textarea name="description" class="form-control" required rows="5">{{ old('description', setting()->description) }}</textarea>
                    </div>

                    <div class="col-md-4 mb-3">
                        <label class="form-label">{{ __('trans.setting.app_repair') }} <strong
                                class="text-danger">*</strong></label>
                        <select name="app_repair" class="form-select" required>
                            <option @if (setting()->app_repair == '0') selected @endif value="0">
                                {{ __('trans.no') }}</option>
                            <option @if (setting()->app_repair == '1') selected @endif value="1">
                                {{ __('trans.yes') }}</option>
                        </select>
                    </div>

                    <div class="col-12">
                        <div class="divider divider-danger">
                            <div class="divider-text text-danger">{{ __('trans.setting.important') }}</div>
                        </div>
                    </div>

                    <div class="col-md-3 mb-3">
                        <label class="form-label">{{ __('trans.setting.timezone') }} <strong
                                class="text-danger">*</strong></label>
                        <select name="timezone" class="select2 form-select" required>
                            @foreach ($timezone_identifiers as $item)
                                <option @if (date_default_timezone_get() == $item) selected @endif value="{{ $item }}">
                                    {{ $item }}</option>
                            @endforeach
                        </select>
                    </div>

                    <div class="col-md-3 mb-3">
                        <label class="form-label">{{ __('trans.setting.app_env') }} <strong
                                class="text-danger">*</strong></label>
                        <select name="app_env" class="form-select" required>
                            <option @if (env('APP_ENV') == 'local') selected @endif value="local">
                                {{ __('trans.setting.local') }}</option>
                            <option @if (env('APP_ENV') == 'production') selected @endif value="production">
                                {{ __('trans.setting.production') }}</option>
                        </select>
                    </div>

                    <div class="col-md-3 mb-3">
                        <label class="form-label">{{ __('trans.setting.locale') }} <strong
                                class="text-danger">*</strong></label>
                        <select name="locale" class="form-select" required>
                            <option @if (env('APP_LOCALE') == 'en') selected @endif value="en">
                                {{ __('trans.setting.english') }}</option>
                            <option @if (env('APP_LOCALE') == 'ar') selected @endif value="ar">
                                {{ __('trans.setting.arabic') }}</option>
                        </select>
                    </div>

                    <div class="col-12">
                        <div class="divider divider-info">
                            <div class="divider-text text-info">{{ __('trans.setting.mobile_app') }}</div>
                        </div>
                    </div>

                    <div class="col-md-3 mb-3">
                        <label class="form-label">{{ __('trans.setting.ios_version') }} <b
                                class="text-danger">*</b></label>
                        <input type="text" class="form-control" required name="ios_version"
                            value="{{ old('ios_version', setting()->ios_version) }}" />
                    </div>

                    <div class="col-md-3 mb-3">
                        <label class="form-label">{{ __('trans.setting.android_version') }} <b
                                class="text-danger">*</b></label>
                        <input type="text" class="form-control" required name="android_version"
                            value="{{ old('android_version', setting()->android_version) }}" />
                    </div>

                    <div class="col-md-3 mb-3">
                        <label class="form-label">{{ __('trans.setting.in_review') }} <strong
                                class="text-danger">*</strong></label>
                        <select name="in_review" class="form-select" required>
                            <option @if (setting()->in_review == '0') selected @endif value="0">
                                {{ __('trans.no') }}</option>
                            <option @if (setting()->in_review == '1') selected @endif value="1">
                                {{ __('trans.yes') }}</option>
                        </select>
                    </div>

                    <div class="col-md-3 mb-3">
                        <label class="form-label">{{ __('trans.setting.value') }} <b class="text-danger">*</b></label>
                        <input type="text" class="form-control" required name="value"
                            value="{{ old('value', setting()->value) }}"
                            oninput="this.value = this.value.replace(/[^0-9]/g, '')" />
                    </div>

                    <div class="col-12">
                        <div class="divider divider-success">
                            <div class="divider-text text-success">{{ __('trans.setting.logo') }} &
                                {{ __('trans.setting.icon') }}</div>
                        </div>
                    </div>

                    <div class="col-md-6 mb-3">
                        <label class="form-label">{{ __('trans.setting.logo') }} <b class="text-danger">*</b></label>
                        <div class="input-group">
                            <span class="input-group-btn">
                                <a data-input="thumbnail" data-preview="holder"
                                    class="UploadFile btn btn-primary text-white">
                                    {{ __('trans.choose') }}
                                </a>
                            </span>
                            <input id="thumbnail" dir="ltr" required class="form-control" type="text" name="logo"
                                value="{{ old('logo', setting()->logo) }}" readonly />
                        </div>
                        <div id="holder" style="margin-top:15px;max-height:100px;">
                            @if (!empty(old('logo', setting()->logo)))
                                <img src="{{ old('logo', setting()->logo) }}" style="height: 5rem;">
                            @endif
                        </div>
                    </div>

                    <div class="col-md-6 mb-3">
                        <label class="form-label">{{ __('trans.setting.icon') }} <b class="text-danger">*</b></label>
                        <div class="input-group">
                            <span class="input-group-btn">
                                <a data-input="thumbnail2" data-preview="holder2"
                                    class="UploadFile btn btn-primary text-white">
                                    {{ __('trans.choose') }}
                                </a>
                            </span>
                            <input id="thumbnail2" dir="ltr" required class="form-control" type="text"
                                name="icon" value="{{ old('icon', setting()->icon) }}" readonly />
                        </div>
                        <div id="holder2" style="margin-top:15px;max-height:100px;">
                            @if (!empty(old('icon', setting()->icon)))
                                <img src="{{ old('icon', setting()->icon) }}" style="height: 5rem;">
                            @endif
                        </div>
                    </div>

                    {{-- <div class="col-12">
                        <div class="divider divider-danger">
                            <div class="divider-text text-danger">{{ __('trans.setting.code_title') }}</div>
                        </div>
                    </div>

                    <div class="col-md-6 mb-3">
                        <label>{{ __('trans.setting.head_code') }}</label>
                        <textarea name="head_code" class="form-control head_code">{{ old('head_code', setting()->head_code) }}</textarea>
                    </div>

                    <div class="col-md-6 mb-3">
                        <label>{{ __('trans.setting.footer_code') }}</label>
                        <textarea name="footer_code" class="form-control footer_code">{{ old('footer_code', setting()->footer_code) }}</textarea>
                    </div> --}}


                    <div class="col-12">
                        <div class="divider divider-warning">
                            <div class="divider-text text-warning">{{ __('trans.setting.social_media') }}</div>
                        </div>
                    </div>

                    <div class="col-md-4 mb-3">
                        <label class="form-label"><i class="fa-regular fa-address-book fa-fw"></i>
                            {{ __('trans.setting.address') }}</label>
                        <input type="text" class="form-control" name="address"
                            value="{{ old('address', setting()->address) }}" />
                    </div>

                    <div class="col-md-4 mb-3">
                        <label class="form-label"><i class="fa-regular fa-envelope fa-fw"></i>
                            {{ __('trans.setting.email') }}</label>
                        <input type="email" class="form-control" name="email"
                            value="{{ old('email', setting()->email) }}" />
                    </div>

                    <div class="col-md-4 mb-3">
                        <label class="form-label"><i class="fa-solid fa-mobile fa-fw"></i>
                            {{ __('trans.setting.phone') }}</label>
                        <input type="tel" dir="ltr" class="form-control" name="phone"
                            value="{{ old('phone', setting()->phone) }}" />
                    </div>

                    <div class="col-md-4 mb-3">
                        <label><i class="fa-brands fa-fw fa-facebook"></i> Facebook</label>
                        <input type="url" class="form-control" name="facebook"
                            value="{{ old('facebook', setting()->facebook) }}" />
                    </div>

                    <div class="col-md-4 mb-3">
                        <label><i class="fa-brands fa-fw fa-instagram"></i> instagram</label>
                        <input type="url" class="form-control" name="instagram"
                            value="{{ old('instagram', setting()->instagram) }}" />
                    </div>

                    <div class="col-md-4 mb-3">
                        <label><i class="fa-brands fa-fw fa-x-twitter"></i> twitter</label>
                        <input type="url" class="form-control" name="twitter"
                            value="{{ old('twitter', setting()->twitter) }}" />
                    </div>

                    <div class="col-md-4 mb-3">
                        <label><i class="fa-brands fa-fw fa-linkedin"></i> linkedIn</label>
                        <input type="url" class="form-control" name="linkedIn"
                            value="{{ old('linkedIn', setting()->linkedIn) }}" />
                    </div>

                    <div class="col-md-4 mb-3">
                        <label><i class="fa-brands fa-fw fa-snapchat"></i> snapchat</label>
                        <input type="url" class="form-control" name="snapchat"
                            value="{{ old('snapchat', setting()->snapchat) }}" />
                    </div>

                    <div class="col-md-4 mb-3">
                        <label><i class="fa-brands fa-fw fa-pinterest"></i> pinterest</label>
                        <input type="url" class="form-control" name="pinterest"
                            value="{{ old('pinterest', setting()->pinterest) }}" />
                    </div>

                    <div class="col-md-4 mb-3">
                        <label><i class="fa-brands fa-fw fa-tiktok"></i> tiktok</label>
                        <input type="url" class="form-control" name="tiktok"
                            value="{{ old('tiktok', setting()->tiktok) }}" />
                    </div>

                    <div class="col-md-4 mb-3">
                        <label><i class="fa-brands fa-fw fa-youtube"></i> youtube</label>
                        <input type="url" class="form-control" name="youtube"
                            value="{{ old('youtube', setting()->youtube) }}" />
                    </div>

                    <div class="col-md-4 mb-3">
                        <label><i class="fa-brands fa-fw fa-telegram"></i> telegram</label>
                        <input type="url" class="form-control" name="telegram"
                            value="{{ old('telegram', setting()->telegram) }}" />
                    </div>

                    <div class="col-md-4 mb-3">
                        <label><i class="fa-brands fa-fw fa-whatsapp"></i> whatsapp</label>
                        <input type="url" class="form-control" name="whatsapp"
                            value="{{ old('whatsapp', setting()->whatsapp) }}" />
                    </div>

                    {{-- <div class="col-12">
                    <div class="divider divider-info">
                        <div class="divider-text text-info">{{__('trans.setting.config_email')}}</div>
                    </div>
                </div>

                <div class="col-md-3 mb-3">
                    <label>Mail Protocol</label>
                    <select name="MAIL_MAILER" class="form-select">
                        <option @if (env('MAIL_MAILER') == 'log') selected @endif value="log">Log</option>
                        <option @if (env('MAIL_MAILER') == 'smtp') selected @endif value="smtp">SMTP</option>
                        <option @if (env('MAIL_MAILER') == 'mail') selected @endif value="mail">Mail</option>
                    </select>
                </div>

                <div class="col-md-3 mb-3">
                    <label>Mail Host</label>
                    <input type="text" dir="ltr" name="MAIL_HOST" class="form-control" value="{{env('MAIL_HOST')}}" />
                </div>

                <div class="col-md-3 mb-3">
                    <label>Mail Username</label>
                    <input type="text" dir="ltr" name="MAIL_USERNAME" class="form-control" value="{{env('MAIL_USERNAME')}}" />
                </div>

                <div class="col-md-3 mb-3">
                    <label>Mail Password</label>
                    <input type="text" dir="ltr" name="MAIL_PASSWORD" class="form-control" value="{{env('MAIL_PASSWORD')}}" />
                </div>

                <div class="col-md-3 mb-3">
                    <label>Mail Port</label>
                    <input type="number" dir="ltr" name="MAIL_PORT" class="form-control" value="{{env('MAIL_PORT')}}" />
                </div>

                <div class="col-md-3 mb-3">
                    <label>Mail Encryption</label>
                    <select name="MAIL_ENCRYPTION" class="form-select">
                        <option @if (env('MAIL_ENCRYPTION') == 'null') selected @endif value="null">NULL</option>
                        <option @if (env('MAIL_ENCRYPTION') == 'tls') selected @endif value="tls">TLS</option>
                        <option @if (env('MAIL_ENCRYPTION') == 'ssl') selected @endif value="ssl">SSL</option>
                    </select>
                </div>

                <div class="col-md-3 mb-3">
                    <label>Mail From Address</label>
                    <input type="email" dir="ltr" name="MAIL_FROM_ADDRESS" class="form-control" value="{{env('MAIL_FROM_ADDRESS')}}" />
                </div>

                <div class="col-md-3 mb-3">
                    <label>Mail From Name</label>
                    <input type="text" name="MAIL_FROM_NAME" class="form-control" value="{{env('MAIL_FROM_NAME')}}" />
                </div>
                        --}}

                    <div class="col-md-12 mt-4">
                        <button class="btn btn-primary btn-update">{{ __('trans.save') }}</button>
                    </div>

                </div>
            </form>
        </div>
    </div>
@endsection


@section('css')
    {{-- <link rel="stylesheet" href="{{ asset('admin/vendor/libs/select2/select2.css') }}" /> --}}
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.5/codemirror.min.css">

    <!-- تضمين بعض الثيمات الخاصة بـ CodeMirror -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.5/theme/dracula.min.css">
    <style>
        .cm-s-dracula .CodeMirror-gutters,
        .cm-s-dracula.CodeMirror {
            text-align: left !important;
            direction: ltr !important;
        }
    </style>
@endsection



@section('js')
    {{-- <script src="{{ asset('admin/vendor/libs/select2/select2.js') }}"></script> --}}
    <script>
        $('.select2').select2();
    </script>

    <!-- تضمين ملفات JavaScript الخاصة بـ CodeMirror -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.5/codemirror.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.5/mode/xml/xml.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.5/mode/javascript/javascript.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.5/mode/css/css.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.65.5/mode/htmlmixed/htmlmixed.min.js"></script>

    {{-- <script>
        var head_code = CodeMirror.fromTextArea(document.getElementsByClassName('head_code')[0], {
            lineNumbers: true,
            mode: 'htmlmixed',
            matchBrackets: true,
            theme: 'dracula',
            direction: 'ltr'
        });
        var footer_code = CodeMirror.fromTextArea(document.getElementsByClassName('footer_code')[0], {
            lineNumbers: true,
            mode: 'htmlmixed',
            matchBrackets: true,
            theme: 'dracula',
            direction: 'ltr'
        });
    </script> --}}
@endsection