@extends('layouts.md-frontend-subpage')
@section('title', trans('cruds.researchArticle.title'))
@section('content')

    <section class="pt-3 pb-4" id="count-stats">
        <div class="container">
            <section class="py-1">
                <div class="container">
                    <div class="row">
                        <div class="col-md-10 mx-auto">
                            <div class="card-header p-0 position-relative z-index-2 bg-transparent">
                                <div class="bg-gradient-info shadow-info border-radius-lg py-2 px-4">
                                    <h4 class="text-white mb-0">{{ trans('global.advancedsearch') }}</h4>
                                </div>
                            </div>
                            <button class="accordion-button font-weight-bold text-start" type="button"
                                data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true"
                                aria-controls="collapseOne">
                                {{ trans('cruds.researchArticle.fields.author') }},
                                {{ trans('cruds.researchArticle.fields.keyword1') }},
                                {{ trans('cruds.researchArticle.fields.country') }}
                                {{ trans('global.search') }}
                                <i class="collapse-close fa fa-plus text-xs pt-1 position-absolute end-0"></i>
                                <i class="collapse-open fa fa-minus text-xs pt-1 position-absolute end-0"></i>
                            </button>
                            <div class="accordion-body text-sm opacity-8">
                                <form role="form" id="frmSearch1" name="frmSearch1" class="text-start"
                                    action="{{ route('search.research-articles') }}" method="GET">
                                    @csrf
                                    <div class="row">
                                        <div class="col-lg-5 col-sm-5 col-12">
                                            <div class="input-group input-group-outline mb-2">
                                                <label class="form-label"></label>
                                                <select class="form-control select2" name="type" id="ts">
                                                    <option value="">{{ trans('global.pleaseSelect') }}</option>
                                                    <option value="1">
                                                        {{ trans('cruds.researchArticle.fields.author') }}</option>
                                                    <option value="2">Scientific area of Research</option>
                                                    <option value="3">Keywords</option>
                                                    <option value="4">Country</option>

                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-gl-4 col-sm-4 col-12 mx-auto">
                                            <div class="input-group input-group-outline mb-2">
                                                <label class="form-label"></label>
                                                <input type="text" class="form-control"
                                                    placeholder="{{ trans('cruds.researchArticle.fields.type_here') }}"
                                                    value="" name="searchtext" id="searchtext" required
                                                    autocomplete="off" required>
                                            </div>
                                        </div>
                                        <div class="col-lg-3 col-sm-3 col-12">
                                            <div class="input-group input-group-outline mb-2">
                                                <label class="form-label"></label>

                                            </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-lg-1 col-sm-1 col-12">
                                            <div class="input-group input-group-outline mb-2">
                                                <label class="form-label"></label>
                                                <select name="and_or1" id="and_or1"
                                                    class="form-control select2 {{ $errors->has('and_or1') ? 'is-invalid' : '' }}">
                                                    <option value="">Select</option>
                                                    <option value="and">
                                                        {{ trans('cruds.slider.fields.and') }}</option>
                                                    <option value="or">
                                                        {{ trans('cruds.slider.fields.or') }}</option>
                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-lg-4 col-sm-4 col-12">
                                            <div class="input-group input-group-outline mb-2">
                                                <label class="form-label"></label>
                                                <select class="form-control select2" name="type" id="ts">
                                                    <option value="">{{ trans('global.pleaseSelect') }}</option>
                                                    <option value="1">
                                                        {{ trans('cruds.researchArticle.fields.author') }}</option>
                                                    <option value="2">Scientific area of Research</option>
                                                    <option value="3">Keywords</option>
                                                    <option value="4">Country</option>

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

                                        <div class="col-lg-4 col-sm-4 col-12">
                                            <div class="input-group input-group-outline mb-2">
                                                <label class="form-label"></label>
                                                <input type="text" class="form-control"
                                                    placeholder="{{ trans('cruds.researchArticle.fields.type_here') }}"
                                                    value="" name="searchtext" id="searchtext" required
                                                    autocomplete="off" required>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="row">
                                        <div class="col-lg-1 col-sm-1 col-12">
                                            <div class="input-group input-group-outline mb-2">
                                                <label class="form-label"></label>
                                                <select name="and_or2" id="and_or2"
                                                    class="form-control select2 {{ $errors->has('and_or2') ? 'is-invalid' : '' }}">
                                                    <option value="">Select
                                                    </option>
                                                    <option value="and">
                                                        {{ trans('cruds.slider.fields.and') }}</option>

                                                    <option value="or">
                                                        {{ trans('cruds.slider.fields.or') }}</option>
                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-lg-4 col-sm-4 col-12">
                                            <div class="input-group input-group-outline mb-2">
                                                <label class="form-label"></label>
                                                <select class="form-control select2" name="type" id="ts">
                                                    <option value="">{{ trans('global.pleaseSelect') }}</option>
                                                    <option value="1">
                                                        {{ trans('cruds.researchArticle.fields.author') }}</option>
                                                    <option value="2">Scientific area of Research</option>
                                                    <option value="3">Keywords</option>
                                                    <option value="4">Country</option>

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

                                        <div class="col-lg-4 col-sm-4 col-12">
                                            <div class="input-group input-group-outline mb-2">
                                                <label class="form-label"></label>
                                                <input type="text" class="form-control"
                                                    placeholder="{{ trans('cruds.researchArticle.fields.type_here') }}"
                                                    value="" name="searchtext" id="searchtext" required
                                                    autocomplete="off" required>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-md-3 mx-auto">

                                        <button type="submit" class="btn bg-gradient-info w-100 mb-0 mt-3 mt-lg-0"
                                            name="submit" id="submit">{{ trans('global.search') }}</button>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
        </div>
        </div>
    </section>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $("#frmSearch1").submit(function() {

                var authorEmpty = $('#author').val();
                var keywordsEmpty = $('#keywords').val();
                var countryEmpty = $('#country').val();

                if (authorEmpty == '' && keywordsEmpty == '' && countryEmpty == '') {
                    alert('Please select any one field (first row)');
                    return false;
                }

                /*  var author1Empty = $('#author1').val();
                 var country1Empty = $('#country1').val();
                 var andOr1 = $('#and_or1').val();

                 alert(andOr1);
                 return false; */
                //alert('1');
                var author1Empty = $('#author1').val();
                var country1Empty = $('#country1').val();
                var andOr1 = $('#and_or1').val();

                var author2Empty = $('#author2').val();
                var country2Empty = $('#country2').val();
                var andOr2 = $('#and_or2').val();

                // alert("author1: " + author1Empty);
                // alert("country1: " + country1Empty);

                if ((author1Empty != "" && country1Empty != "") && andOr1 == '') {
                    //$('#and_or1').attr('required', 'required');
                    alert('Please select AND/OR field!');
                    return false;
                }

                if ((author1Empty != "" || country1Empty != "") && andOr1 == '') {
                    //$('#and_or1').attr('required', 'required');
                    alert('Please select AND/OR field!');
                    return false;
                }


                if ((author2Empty != "" && country2Empty != "") && andOr2 == '') {
                    // $('#and_or1').attr('required', 'required');
                    alert('Please select AND/OR field!');
                    return false;
                }

                if ((author2Empty != "" || country2Empty != "") && andOr2 == '') {
                    //$('#and_or1').attr('required', 'required');
                    alert('Please select AND/OR field!');
                    return false;
                }

                $('#frmSearch1').submit(function() {
                    return true;
                });
                return true;

            });
        });
    </script>
@endsection

@section('scripts')

    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
    <script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $("#frmSearch").submit(function() {
                if ($('#searchtext').val().length < 5) {
                    Swal.fire({
                        title: `Please enter min. 5 characters atleast`,
                        icon: "warning",
                        confirmButtonText: 'Ok',
                        dangerMode: true,
                    })
                    return false;
                }

                $(this).submit(function() {
                    return false;
                });
                return true;
            });

        });
    </script>
@endsection