@include('modal.forgot_password_modal')
@include('modal.login_modal')
@include('modal.register_modal')
@include('modal.share_modal')
@include('modal.logout_modal')
@include('modal.send_documents_modal')
@include('modal.forgot_password_modal')
@include('modal.rate_us_modal')
@include('include.toaster.error')
@include('include.toaster.error2')
@include('include.toaster.error3')
@include('include.toaster.success')
@include('include.loader')
@include('modal.success_modal')
@include('modal.contact_us_modal')
@include('modal.spinner')
@include('modal.payment_modal')
@include('modal.confirmation_modal')
@include('modal.membership_expired_modal')


<script nonce="{{config('app.nonce')}}" src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script nonce="{{config('app.nonce')}}" src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.19.1/jquery.validate.min.js"></script>
<script nonce="{{config('app.nonce')}}" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.1/additional-methods.js"></script>
<script nonce="{{config('app.nonce')}}" type="text/javascript" src="https://rawgit.com/RobinHerbots/jquery.inputmask/3.x/dist/jquery.inputmask.bundle.js"></script>
<script nonce="{{config('app.nonce')}}" type="text/javascript" src="https://maps.google.com/maps/api/js?key={{env('GOOGLE_MAP_KEY')}}&libraries=places" ></script>

<script nonce="{{config('app.nonce')}}" src="{{asset('js/jquery.star-rating.js')}}"></script>
<script nonce="{{config('app.nonce')}}">
    $('#exp_date').inputmask({'mask': "99 / 99"});
    $('#phone_num').inputmask({'mask': "999-999-9999"});

    function showSuccessToaster(message) {
        $('#success-toaster .toaster-content').html(message);
        $('#success-toaster').show();

        setTimeout(function() {
            $('#success-toaster').fadeOut('fast');
        }, 750);
    }

    function showErrorToaster(message) {
        $('#error-toaster .toaster-content').html(message);
        $('#error-toaster').show();
        // alert('here');
        // setTimeout(function() {
        //     $('#error-toaster').hide();
        // }, 1500);
    }


    function showErrorToaster2(message) {
        $('#error-toaster2 .toaster-content2').html(message);
        $('#error-toaster2').show();
        // setTimeout(function() {
        //     $('#error-toaster2').hide();
        // }, 3500);
    }

    function showErrorToaster3(message) {
        $('#error-toaster3 .toaster-content3').html(message);
        $('#error-toaster3').show();
        // setTimeout(function() {
        //     $('#error-toaster2').hide();
        // }, 3500);
    }


    loggedInUrl = '{{route('policyholder.my_room')}}';
    baseUrl = '{{asset('/')}}';
    deleteImage = `<img src="{{asset('images/delete.png')}}">`;

</script>
<script nonce="{{config('app.nonce')}}" type="text/javascript"  src="{{ asset('js/auth.js')}}"></script>
<script nonce="{{config('app.nonce')}}" type="text/javascript"  src="{{ asset('js/profile.js').'?v='.time()}}"></script>


@yield('js_file')

<script nonce="{{config('app.nonce')}}">
    $(document).ready(function () {
        $("#latitudeArea").addClass("d-none");
        $("#longtitudeArea").addClass("d-none");

    });
    let autocomplete;
    let address1Field;
    let postalField;
</script>

{{--<script nonce="{{config('app.nonce')}}" type="text/javascript">--}}
{{--    $('#bcPaint').bcPaint();--}}
{{--</script>--}}
<script nonce="{{config('app.nonce')}}">
    google.maps.event.addDomListener(window, 'load', initAutocomplete);

    function initAutocomplete() {
        address1Field = document.querySelector("#address");
        // postalField = document.querySelector("#zip_code");

        autocomplete = new google.maps.places.Autocomplete(address1Field, {
            componentRestrictions: {country: ["us"]},
            fields: ["address_components","geometry"],
            types: ["address"],
        });
        // address1Field.focus();
        autocomplete.addListener("place_changed", fillInAddress);
    }

    function fillInAddress() {
        // Get the place details from the autocomplete object.
        const place = autocomplete.getPlace();
        console.log(place)
        let address1 = "";
        let postcode = "";

        for (const component of place.address_components) {
            const componentType = component.types[0];

            switch (componentType) {
                case "street_number": {
                    address1 = `${component.long_name} ${address1}`;
                    break;
                }

                case "route": {
                    address1 += component.long_name;
                    break;
                }
                case "neighborhood": {
                    address1 += ` ${component.long_name}`;
                    break;
                }

                case "postal_code": {
                    postcode = `${component.long_name}${postcode}`;
                    document.querySelector("#zip_code").value = postcode;
                    break;
                }

                case "postal_code_suffix": {
                    postcode = `${postcode}-${component.long_name}`;
                    document.querySelector("#zip_code").value = postcode;
                    break;
                }
                case "locality":
                    document.querySelector("#city").value = component.long_name;
                    break;
                case "administrative_area_level_1": {
                    // Set State
                    document.querySelector("#state").value = component.short_name;
                    break;
                }
                case "country":
                    // document.querySelector("#country").value = component.long_name;
                    break;
            }
        }

        $('#lat').val(place.geometry.location.lat());
        $('#long').val(place.geometry.location.lng());
        address1Field.value = address1;
        // postalField.value = postcode;
    }


</script>






<!--<script src="https://castagninomacro.org/library/jquery_plugins/fancybox/helpers/jquery.fancybox-thumbs.js"></script>-->
<script nonce="{{config('app.nonce')}}">
  $( function() {
    $( "#datepicker" ).datepicker({ dateFormat: 'yy-mm-dd' });
  });
  $( function() {
    $( "#datepicker1" ).datepicker({ dateFormat: 'yy-mm-dd' });
  });
  $('.menu-btn').click(function(){
    $('.main-menu').slideToggle();
  })
  $('.login-header').click(function(){
    $('.user-dropdown.menu-items').slideToggle();
  })
  $('.sidebar-icon div').click(function(){
    $('body').addClass('menu-open');
  });
  $('.sidebar-close-icon').click(function(){
    $('body.menu-open').removeClass('menu-open');
  });

    function show_loader(){
        $("#loader").addClass("loader");
        //event.preventDefault();
    }

    function hide_loader(){
        $("#loader").removeClass("loader");
        //event.preventDefault();
    }
  $( ".datepicker" ).datepicker({ dateFormat: 'm/d/yy',  maxDate: new Date() });



    $('input[name="purchased_date"]').on('change', function(){

        let dateString = this.value
        let today = new Date();
        let birthDate = new Date(dateString);
        let age = today.getFullYear() - birthDate.getFullYear();
        let m = today.getMonth() - birthDate.getMonth();
        if (m < 0 || (m === 0 && today.getDate() < birthDate.getDate())) {
            age--;
        }

        $('input[name="age_year"]').val(age);
        $('select[name="age_month"]').val(Math.abs(m));
        $('input[name="age_month"]').val(Math.abs(m));

    });
</script>

</body>