@extends("admin.template.layout")
@section('header')

@endsection
@section('content')
    <div class="container-xxl flex-grow-1 container-p-y">
        <div class="card">
            <div class="card-header d-flex justify-content-between align-items-center">
                <h5 class="mb-0">{{ $page_heading }}</h5>
            </div>
            <form id="admin_form" method="post" action="{{route('ads.settings.update')}}"
                  enctype="multipart/form-data">
                <div class="card-body">
                    @csrf
                    <div class="row">
                        <div class="col-md-3">
                            <div class="form-group">
                                <label for="social_ad_frequency">Social Ad Frequency <br>
                                    <small>Frequency to show social ads in feed.</small></label>
                                <input type="number" class="form-control" id="social_ad_frequency"
                                       name="social_ad_frequency"
                                       value="{{ $settings ? $settings->social_ad_frequency : old('social_ad_frequency') }}">
                            </div>
                        </div>

                        <div class="col-md-3">
                            <div class="form-group">
                                <label for="promotional_ad_frequency">Promotional Ads Count.
                                    <br><small>Number of promotional ads to show on feeds top.</small></label>
                                <input type="number" class="form-control" id="promotional_ad_frequency"
                                       name="promotional_ad_frequency"
                                       value="{{ $settings ? $settings->promotional_ad_frequency : old('promotional_ad_frequency') }}">
                            </div>
                        </div>

                        <div class="col-md-3">
                            <div class="form-group">
                                <label for="face_ad_frequency">Face Ad Frequency <br>
                                    <small>Frequency to show face ad.</small></label>
                                <input type="number" class="form-control" id="face_ad_frequency"
                                       name="face_ad_frequency"
                                       value="{{ $settings ? $settings->face_ad_frequency : old('face_ad_frequency') }}">
                            </div>
                        </div>

                        <div class="col-md-3">
                            <div class="form-group">
                                <label for="display_duration">Match Ad Display Duration <br><small>
                                        Time duration is seconds to show Match ad.
                                    </small></label>
                                <input type="number" class="form-control" id="display_duration"
                                       name="display_duration"
                                       value="{{ $settings ? $settings->display_duration : old('display_duration') }}">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="card-footer text-right">
                    <button type="submit" class="main-btn primary-btn btn-hover">Submit</button>
                </div>
            </form>
        </div>

        @stop

        @section('script')
            <script>
                $(document).ready(function () {
                    $('.select2').select2();
                    $('#venues_list').select2();
                    $('#community_list').select2();


                    $('#face_ads').select2();
                    $('#feed_ads').select2();
                    $('#promotional_ads').select2();


                    //disable previous dates in to_date
                    $('#start_date').on('change', function () {
                        $('#end_date').attr('min', $(this).val());
                    });
                    //disable previous dates in from_date
                    $('#start_date').attr('min', new Date().toISOString().split('T')[0]);

                    $('#days').datepicker({
                        daysOfWeekDisabled: [0, 6]
                    });
                });

                App.initFormView();
                let form_in_progress = 0;
                $('body').off('submit', '#admin_form');
                $('body').on('submit', '#admin_form', function (e) {
                    e.preventDefault();
                    var validation = $.Deferred();
                    var $form = $(this);
                    var formData = new FormData(this);

                    $form.validate({
                        rules: {},
                        errorElement: 'div',
                        errorPlacement: function (error, element) {
                            element.addClass('is-invalid');
                            error.addClass('error');
                            error.insertAfter(element);
                        }
                    });

                    // Bind extra rules. This must be called after .validate()
                    App.setJQueryValidationRules('#admin_form');

                    if ($form.valid()) {
                        validation.resolve();
                    } else {
                        var error = $form.find('.is-invalid').eq(0);
                        $('html, body').animate({
                            scrollTop: (error.offset().top - 100),
                        }, 500);
                        validation.reject();
                    }

                    validation.done(function () {
                        $form.find('.is-invalid').removeClass('is-invalid');
                        $form.find('div.error').remove();


                        App.button_loading(true);
                        //disable submit button
                        $form.find('button[type="submit"]').attr('disabled', true);

                        form_in_progress = 1;
                        $.ajax({
                            type: "POST",
                            enctype: 'multipart/form-data',
                            url: $form.attr('action'),
                            data: formData,
                            processData: false,
                            contentType: false,
                            cache: false,
                            timeout: 600000,
                            dataType: 'html',
                            success: function (res) {
                                res = JSON.parse(res);
                                console.log(res['status']);
                                form_in_progress = 0;
                                App.button_loading(false);
                                if (res['status'] == 0) {
                                    if (typeof res['errors'] !== 'undefined') {
                                        var error_def = $.Deferred();
                                        var error_index = 0;
                                        jQuery.each(res['errors'], function (e_field, e_message) {
                                            if (e_message != '') {
                                                $('[name="' + e_field + '"]').eq(0).addClass('is-invalid');
                                                $('<div class="error">' + e_message + '</div>').insertAfter($('[name="' + e_field + '"]').eq(0));
                                                if (error_index == 0) {
                                                    error_def.resolve();
                                                }
                                                error_index++;
                                            }
                                        });
                                        error_def.done(function () {
                                            var error = $form.find('.is-invalid').eq(0);
                                            $('html, body').animate({
                                                scrollTop: (error.offset().top - 100),
                                            }, 500);
                                        });
                                    } else {
                                        var m = res['message'] || 'Unable to save variation. Please try again later.';
                                        App.alert(m, 'Oops!', 'error');
                                    }
                                } else {
                                    App.alert(res['message'] || 'Record saved successfully', 'Success!', 'success');
                                    setTimeout(function () {
                                        window.location.href = res['oData']['redirect'];
                                    }, 2500);

                                }
                                //enable submit button
                                $form.find('button[type="submit"]').attr('disabled', false);
                            },
                            error: function (e) {
                                form_in_progress = 0;
                                App.button_loading(false);
                                console.log(e);
                                App.alert("Network error please try again", 'Oops!', 'error');
                                //enable submit button
                                $form.find('button[type="submit"]').attr('disabled', false);
                            }
                        });
                    });
                });
            </script>
@stop