@extends('front.layouts.app')
@section('title', 'Contact Us')

@section('content')
    
    <div class="main-slider innerBanner">
        <div id="carouselExampleControls" class="carousel slide" data-ride="carousel">
            <div class="carousel-inner">
                <div class="carousel-item active" data-wow-delay="0.5s">
                    <img class="img-fluid w-100 wow fadeInRight" src="{{ asset('front/images/aboutBanner.png') }}" alt="First slide">
                    <div class="carousel-caption">
                        <div class="container">
                            <div class="slideContent">
                                <h2 class="headOne wow fadeInLeft">Contact Us</h2>
                                <img src="{{ asset('front/images/innerBannerLogo.png') }}" class="img-fluid"/>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- END: Inner Slider -->


    <section class="conInner">
        <div class="container">
            <div class="row">
                <div class="col-md-4">
                    <div class="cfContent">
                        <div class="cont-Icon">
                            <a href="javascript:;" class="cfIcon"><i class="fas fa-map-marker-alt"></i></a>
                            <div class="fiCont">
                                <h5>Location :</h5>
                                <p>{{$setting->address}}</p>
                            </div>
                        </div>
                        <div class="cont-Icon">
                            <a href="tel:(419) 427-1500" class="cfIcon"><i class="fas fa-phone-alt"></i></a>
                            <div class="fiCont">
                                <h5>Phone :</h5>
                                <p>{{$setting->phone_no_1}}</p>
                            </div>
                        </div>

                        <div class="cont-Icon">
                            <a href="mailto:Bill@andersondentalfindlay.com" class="cfIcon"><i
                                    class="fas fa-envelope"></i></a>
                            <div class="fiCont">
                                <h5>Email :</h5>
                                <p>{{$setting->email}}</p>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-7">
                    <div id="my_form" class="cfContent">

                        <!--<form class="contactForm">-->
                        <!--    <div class="form-row">-->
                        <!--        <div class="form-group col-md-6">-->
                        <!--            <div class="input-group mb-3">-->
                        <!--                <div class="input-group-prepend ">-->
                        <!--                    <span class="input-group-text inSpan"><i class="fas fa-user"></i></span>-->
                        <!--                </div>-->
                        <!--                <input type="text" class="form-control inSize" placeholder="First Name" name="fname">-->
                        <!--            </div>-->
                        <!--        </div>-->
                        <!--        <div class="form-group col-md-6">-->
                        <!--            <div class="input-group mb-3">-->
                        <!--                <div class="input-group-prepend">-->
                        <!--                    <span class="input-group-text inSpan"><i class="fas fa-user"></i></span>-->
                        <!--                </div>-->
                        <!--                <input type="text" class="form-control inSize" placeholder="Last Name" name="lname">-->
                        <!--            </div>-->
                        <!--        </div>-->
                        <!--    </div>-->
                        <!--    <div class="form-row">-->
                        <!--        <div class="form-group col-md-6">-->
                        <!--            <div class="input-group mb-3">-->
                        <!--                <div class="input-group-prepend">-->
                        <!--                    <span class="input-group-text inSpan"><i class="fas fa-mobile-android"></i></span>-->
                        <!--                </div>-->
                        <!--                <input type="text" class="form-control inSize" placeholder="Phone Num" name="phNumer">-->
                        <!--            </div>-->
                        <!--        </div>-->
                        <!--        <div class="form-group col-md-6">-->
                        <!--            <div class="input-group mb-3">-->
                        <!--                <div class="input-group-prepend">-->
                        <!--                    <span class="input-group-text inSpan"><i class="fas fa-envelope"></i></span>-->
                        <!--                </div>-->
                        <!--                <input type="email" class="form-control inSize" placeholder="Email" name="email">-->
                        <!--            </div>-->
                        <!--        </div>-->
                        <!--    </div>-->
                        <!--    <div class="form-row">-->
                        <!--        <div class="form-group col-md-6">-->
                        <!--            <div class="input-group mb-3">-->
                        <!--                <div class="input-group-prepend">-->
                        <!--                    <span class="input-group-text inSpan"><i class="far fa-user-plus"></i></span>-->
                        <!--                </div>-->
                        <!--                <input type="text" class="form-control inSize" placeholder="Position" name="position">-->
                        <!--            </div>-->
                        <!--        </div>-->
                        <!--        <div class="form-group col-md-6">-->
                        <!--            <div class="input-group mb-3">-->
                        <!--                <div class="input-group-prepend">-->
                        <!--                    <span class="input-group-text inSpan"><i class="fal fa-building"></i></span>-->
                        <!--                </div>-->
                        <!--                <input type="text" class="form-control inSize" placeholder="Company Name" name="cname">-->
                        <!--            </div>-->
                        <!--        </div>-->
                        <!--    </div>-->
                        <!--    <div class="form-row">-->
                        <!--        <div class="form-group col-md-12">-->
                        <!--            <select name="employees" class="form-control inSize selectDd">-->
                        <!--                <option selected disabled>How Many Employees?</option>-->
                        <!--                <option>1 - 20</option>-->
                        <!--                <option>21 - 50</option>-->
                        <!--                <option>51 - 200</option>-->
                        <!--                <option>201 - 750</option>-->
                        <!--                <option>751 - 1000</option>-->
                        <!--                <option>More than 1000</option>-->
                        <!--            </select>-->
                        <!--        </div>-->
                        <!--    </div>-->
                        <!--    <div class="input-group">-->
                        <!--        <div class="input-group-prepend">-->
                        <!--            <span class="input-group-text txSpan"><i class="fas fa-comments-alt"></i></span>-->
                        <!--        </div>-->
                        <!--        <textarea class="form-control txSize" placeholder="Messages" name="msg"></textarea>-->
                        <!--    </div>-->
                        <!--    <button type="submit" class="contactBtn">Submit</button>-->
                        <!--</form>-->

                        <!--  ----------------------------------------------------------------------  -->

                        <!--  NOTE: Please add the following <FORM> element to your page.             -->

                        <!--  ----------------------------------------------------------------------  -->
                    

                    <!--<form action="https://webto.salesforce.com/servlet/servlet.WebToLead?encoding=UTF-8" method="POST" id="form1">-->
                        <form id="new-form" method="POST" action="">


                            <input type=hidden name="oid" value="00D8V000000jZJH">

                            <input type=hidden name="retURL" value="http://https://laborpay.com/">


                            <label for="first_name">First Name</label><input id="first_name" maxlength="40"
                                                                             name="first_name" size="20" type="text"
                                                                             required/><br>

                            <input type="hidden" id="recaptcha_response" name="recaptcha_response" value="">

                            <label for="last_name">Last Name</label><input id="last_name" maxlength="80"
                                                                           name="last_name" size="20" type="text"
                                                                           required/><br>


                            <label for="phone">Phone</label><input id="phone" maxlength="40" name="phone" size="20"
                                                                   type="tel" required/><br>


                            <label for="email">Email</label><input id="email" maxlength="80" name="email" size="20"
                                                                   type="email" required/><br>


                            <label>Position:</label>
                            <input id="00N8V00000HgLfw" maxlength="255" name="00N8V00000HgLfw" size="20"
                                   type="text"/><br>


                            <label for="company">Company</label><input id="company" maxlength="40" name="company"
                                                                       size="20" type="text"/><br>


                            <label> How many employees?:</label>
                            <select id="00N8V00000HgLWK" name="00N8V00000HgLWK" title="How many employees?">
                                <option value="">--None--</option>
                                <option value="1 - 20">1 - 20</option>

                                <option value="21 - 50">21 - 50</option>

                                <option value="51 - 200">51 - 200</option>

                                <option value="201 - 750">201 - 750</option>

                                <option value="751 - 100">751 - 100</option>

                                <option value="More than 1000">More than 1000</option>

                            </select><br>


                            <label>Messages:</label>
                            <textarea id="00N8V00000HgLfr" name="00N8V00000HgLfr" rows="3" type="text" wrap="soft"
                                      name="message"></textarea><br>

                            <!--<button id="nextStep">Submit</button>-->

                            <input type="submit" class="laBtn" name="submit" id="btn_submit">


                        </form>
                        <div id="thank_you" style="display: none;">
                            <p>Thanks for filling up the form!</p>
                            <button type="submit">Close</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </section>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
    <script src="https://www.google.com/recaptcha/api.js?render=6LfKpr4lAAAAAJy0UwVMiGAhRV4kk6hH329-pd73"></script>

    <script>
        var check = false;
        // grecaptcha.ready(function() {
        //     grecaptcha.execute('6LfKpr4lAAAAAJy0UwVMiGAhRV4kk6hH329-pd73', {action: 'contact'}).then(function(token) {
        //         document.getElementById('recaptcha_response').value = token;
        //     });
        // });

        document.getElementById('new-form').addEventListener("submit", function (event) {
            if (!check) {
                event.preventDefault();
                grecaptcha.execute('6LfKpr4lAAAAAJy0UwVMiGAhRV4kk6hH329-pd73', {action: 'contact'}).then(function (token) {
                    document.getElementById("recaptcha_response").value = token;
                    check = true;
                    $('#btn_submit').click();
                });
            }
        }, false);
    </script>

{{--    <section class="subSec">--}}
{{--        <div class="container">--}}
{{--            <div class="row">--}}
{{--                <div class="col-md-4 wow fadeInLeft">--}}
{{--                    <div class="subCont">--}}
{{--                        <h2>Subscribe Now!</h2>--}}
{{--                        <h3>Laborpay</h3>--}}
{{--                    </div>--}}
{{--                </div>--}}
{{--                <div class="col-md-8 wow fadeInRight">--}}
{{--                    <div class="subForm">--}}
{{--                        <form>--}}
{{--                            <div class="input-group mb-3">--}}
{{--                                <input type="text" class="form-control" placeholder="Email Address:"--}}
{{--                                       aria-label="Recipient's username" aria-describedby="basic-addon2">--}}
{{--                                <div class="input-group-append">--}}
{{--                                    <button class="btn btn-outline-secondary" type="button">Send Now</button>--}}
{{--                                </div>--}}
{{--                            </div>--}}
{{--                        </form>--}}
{{--                    </div>--}}
{{--                </div>--}}
{{--            </div>--}}
{{--        </div>--}}
{{--    </section>--}}
@endsection