@extends('layouts.app')

@section('page-title')
    <div class="bg-title">
        <h4 class="page-title"><i class="{{ $pageIcon }}"></i> @lang($pageTitle)</h4>
    </div>
@endsection

@push('head-script')
    <link rel="stylesheet" href="{{ asset('plugins/bower_components/switchery/dist/switchery.min.css') }}">
@endpush

@section('content')
    <div class="dash_panel">
        <div class="customCard">
            <div class="customvtab m-t-10">
                @include('sections.notification_settings_menu')
                <div class="tab-content m-0">
                    <div id="vhome3" class="tab-pane active">
                        <div class="row">
                            <div class="col-md-12">
                                <form id="updateCurrency" class="ajax-form" method="POST" autocomplete="off">
                                    @csrf
                                    @method('PUT')
                                    <div class="form-body">
                                        <div class="row">
                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="m-b-0">PUSHER APP ID</label>
                                                    <input type="text" readonly="readonly"
                                                        onfocus="this.removeAttribute('readonly');"
                                                        class="form-control auto-complete-off" id="pusher_app_id"
                                                        name="pusher_app_id" value="{{ $pusherSettings->pusher_app_id }}">
                                                </div>
                                            </div>

                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="m-b-0">PUSHER APP KEY</label>
                                                    <input type="password" class="form-control" id="pusher_app_key"
                                                        name="pusher_app_key" value="{{ $pusherSettings->pusher_app_key }}">
                                                    <span class="fa fa-fw fa-eye field-icon toggle-password"></span>
                                                </div>
                                            </div>
                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="m-b-0">PUSHER APP SECRET</label>
                                                    <input type="password" class="form-control" id="pusher_app_secret"
                                                        name="pusher_app_secret"
                                                        value="{{ $pusherSettings->pusher_app_secret }}">
                                                    <span class="fa fa-fw fa-eye field-icon toggle-password"></span>
                                                </div>
                                            </div>

                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="m-b-0">PUSHER CLUSTER</label>
                                                    <input type="text" class="form-control" id="pusher_cluster"
                                                        name="pusher_cluster" value="{{ $pusherSettings->pusher_cluster }}">
                                                </div>
                                            </div>
                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="m-b-0">Force TLS</label>
                                                    <select name="force_tls" id="force_tls" class="form-control">
                                                        <option value="0"
                                                            @if ($pusherSettings->force_tls == '0') selected @endif>False</option>
                                                        <option value="1"
                                                            @if ($pusherSettings->force_tls == '1') selected @endif>True</option>
                                                    </select>
                                                </div>
                                            </div>

                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="control-label">@lang('app.status')</label>
                                                    <div class="switchery-demo">
                                                        <input type="checkbox" name="status"
                                                            @if ($pusherSettings->status) checked @endif
                                                            class="js-switch " data-color="#00c292"
                                                            data-secondary-color="#f96262" />
                                                    </div>
                                                </div>
                                            </div>

                                            @if(hasAccessOf('pusher_settings')['is_write'])
                                                <div class="col-xs-12 d-flex gap-2">
                                                    <button type="submit" id="save-form" class="themeBtn">@lang('app.save')
                                                    </button>
                                                    <button type="reset"
                                                        class="themeBtnOutline">@lang('app.reset')</button>
                                                </div>
                                            @endif
                                        </div>
                                    </div>
                                    <!--/span-->

                                </form>
                            </div>
                            <!-- .row -->

                            <div class="clearfix"></div>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </div>

@endsection

@push('footer-script')
    <script src="{{ asset('plugins/bower_components/switchery/dist/switchery.min.js') }}"></script>
    <script>
        // Switchery
        var elems = Array.prototype.slice.call(document.querySelectorAll('.js-switch'));
        $('.js-switch').each(function() {
            new Switchery($(this)[0], $(this).data());
        });

        $('#save-form').click(function() {
            $.easyAjax({
                url: '{{ route('pusher-settings.update', $pusherSettings->id) }}',
                container: '#updateCurrency',
                type: "POST",
                data: $('#updateCurrency').serialize()
            })
        });
    </script>
@endpush