@extends('front.layouts.master')

@section('content')

    <section class="subpage-header">
        <div class="container">
            <div class="site-title clearfix">
                <h2>İletişim</h2>
            </div>
        </div>
    </section>
    <!-- İLETİŞİM İÇERİK -->
    <section>
        <div class="container">
            <div class="row">
                <div class="col-md-6 col-sm-6 animate fadeInLeft">
                    {!! $page->body !!}
                </div>
                <div class="col-md-6 col-sm-6 animate fadeInRight">
                    <p class="success" id="success" style="display:none;"></p>
                    <p class="error" id="error" style="display:none;"></p>
                    @if(Session('error'))
                        <p class="error" id="error">{!! Session('error') !!}</p>
                    @endif
                    @if(Session('success'))
                        <p class="success" id="success">{!! Session('success') !!}</p>
                    @endif
                    @if(count($errors))
                        <p class="error" id="error">
                            @foreach($errors->all() as $error)
                                <span>- {!! $error !!}</span><br>
                            @endforeach
                        </p>
                    @endif

                    {!! html()->form()->id('contact-form')->class('contact-form')->attribute('onSubmit', 'return false;')->open() !!}
                    <div class="row">
                        <div class="col-md-6">
                            {!! html()->text('name')->id('contact_name')->class('input')->placeholder('Adınız Soyadınız') !!}
                        </div>
                        <div class="col-md-6">
                            {!! html()->text('email')->id('contact_email')->class('input')->placeholder('E-mail Adresi') !!}
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-6">
                            {!! html()->text('phone')->id('contact_phone')->class('input')->placeholder('Telefon Numarası') !!}
                        </div>
                    </div>
                    {!! html()->textarea('body')->id('message')->class('input')->placeholder('Mesajınız') !!}
                    @if(config('services.recaptcha.key'))
                        <div class="g-recaptcha"
                             data-sitekey="{{config('services.recaptcha.key')}}">
                        </div>
                    @endif


                    <button class="btn btn-primary" name="" type="submit" data-text="Mesajı Gönder"
                            onClick="validateContact();">
                        Mesajı Gönder
                    </button>
                    {!! html()->form()->close() !!}

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

    <iframe
            src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3053.0948291209525!2d29.503978569957788!3d40.07329679326703!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x14ca3e6d81b9f5c5%3A0xbe2bf48f4dfa79c3!2zTWV0aW4gQXl0ZW11ciBIdWt1ayAmIERhbsSxxZ9tYW5sxLFr!5e0!3m2!1str!2sus!4v1600861740741!5m2!1str!2sus"
            width="100%" height="400" frameborder="0" style="border:0;" allowfullscreen="" aria-hidden="false"
            tabindex="0"></iframe>
    {{--    <div class="map" id="map"></div>--}}

    <script src='https://www.google.com/recaptcha/api.js'></script>
@endsection

@section('styles')
@endsection


{{--
@section('scripts')
    <script>
        function initMap() {

            var location = { lat: {{ getMapLocation('lat') }}, lng: {{ getMapLocation('lng') }} };

            // Create a map object and specify the DOM element for display.
            var map = new google.maps.Map(document.getElementById('map'), {
                center: location,
                scrollwheel: false,
                zoom: 16
            });

            var marker = new google.maps.Marker({
                position: location,
                map: map,
                title: 'Metin Aytemur Hukuk ve Danışmanlık Bürosu'
            });
        }
    </script>
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyC65NzKHCg9-cRLnfrT41AIhkxaPten6Q8&callback=initMap" async defer></script>
@endsection--}}