@extends('layouts.app')

@section('area', '| '.__('contacts'))

@section('specif-css-page')

@endsection

@section('main-content')

    <main>
        <section class="hero_in">
            <iframe title="Google Maps" src="{{ config('misc.google_maps_url') }}" style="border:0;"></iframe>
        </section>

        <div class="contact_info">
            <div class="container">
                <ul class="clearfix">
                    <li>
                        <i class="pe-7s-map-marker"></i>
                        <h4>{{ __('position') }}</h4>
                        <span>{!! __('location') !!}</span>
                    </li>
                    <li>
                        <i class="pe-7s-mail-open-file"></i>
                        <h4>{{ __('email_address') }}</h4>
                        <span>{{ config('contact.to') }}</span>

                    </li>
                    <li>
                        <i class="pe-7s-phone"></i>
                        <h4>{{ __('phone') }}</h4>
                        <span>{{ config('contact.phone') }}<br><small>{{ __('work_time') }}</small></span>
                    </li>
                </ul>
            </div>
        </div>

        <div class="bg_color_1">
            <div class="container margin_80_55">
                <div class="main_title_2">
                    <span><em></em></span>
                    <h2>{{ __('contacts') }}</h2>
                </div>
                <div class="row">
                    <div class="col-12">
                        <h4>{{ __('contacts_title') }}</h4>
                        <p>{{ __('contacts_header') }}</p>
                        <p><small id="form-warnings">{{ __('contacts_form_warning') }}</small></p>

                        @if (Session::has('message'))
                            <div class="alert alert-{!! Session::get('status') !!}">
                                <ul>
                                    <li>{{ Session::get('message') }}</li>
                                </ul>
                            </div>
                        @endif

                        @if($errors->any())
                                <ul class="alert alert-danger">
                                    @foreach ($errors->all() as $error)
                                        <li><small> {{ $error }} </small></li>
                                    @endforeach
                                </ul>
                        @endif

                        @if(Session::get('status') !== 'success')
                            <form method="POST" action="{{ route('status') }}" id="contactForm"
                                  autocomplete="on">
                                {{ csrf_field() }}
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="name">{{ __('name') }}</label>
                                            <input class="form-control" type="text" id="name" name="name"
                                                   value="{{ old('name') }}">
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="lastName">{{ __('surname') }}</label>
                                            <input class="form-control" type="text" id="lastName" name="lastName"
                                                   value="{{ old('lastName') }}">
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="email">{{ __('email') }}</label>
                                            <input class="form-control" type="email" id="email" name="email"
                                                   value="{{ old('email') }}">
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="form-group">
                                            <label for="phone">{{ __('phone') }}</label>
                                            <input class="form-control" type="text" id="phone" name="phone"
                                                   placeholder="+39..." value="{{ old('phone') }}">
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-12">
                                        <div class="form-group">
                                            <label for="message">{{ __('message') }}</label>
                                            <textarea rows="5" class="form-control" id="message"
                                                      name="message">{{ old('message') }}</textarea>
                                        </div>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col-md-12">
                                        <input
                                                type="submit"
                                                value="{{ __('send') }}"
                                                class="btn_1 full-width full-height"
                                                id="submit-contact"
                                                name="submitContact"
                                        >
                                        <input type="hidden" name="g-recaptcha-response" id="g-recaptcha-response">
                                    </div>
                                </div>
                            </form>
                        @endif
                    </div>
                </div>
            </div>
        </div>

    </main>
@endsection

@section('specific-js-page')
    <script>
        const recaptcha_site_key = '{{ config('misc.recaptcha.site_key') }}';
        const form = $('#contactForm');
    </script>
    <script src="https://www.google.com/recaptcha/api.js?render={{ config('misc.recaptcha.site_key') }}"></script>
    <script src="{{ URL::asset('js/contact-form-validation.js') }}"></script>
@endsection