{{--*/ $redes_sociales = \App\Http\Utils\Util::getRedesSociales() /*--}}
@extends('templates.public.public-template')
@section('css')
@endsection
@section('js')
    {!!Html::script('js/general/ajax.js')!!}
    {!!Html::script('js/general/alert-message.js') !!}
    {!!Html::script('js/general/jquery.functions.js')!!}
    <script>
        $(document).on('click', '#btn-enviar-mensaje', function () {
            var btn = $(this);
            var form = $('#formulario-contacto');
            var data = form.serialize();

            form.find('.alert').remove();
            form.find('*').attr('disabled', 'disabled');
            btn.find('b').removeClass('glyphicon-send').addClass('glyphicon-refresh gly-spin');
            $.ajax({
                url: '{{ route('post-contacto-enviar-contacto') }}',
                type: 'post',
                data: data
            }).done(function (json) {
                var message = json.messages.join('<br>');
                if (json.success == true) {
                    form[0].reset();
                    form.find('.mensaj').prepend('<div class="alert alert-success" role="alert">' + message + '</div>');
                } else {

                    form.find('.mensaj').prepend('<div class="alert alert-danger" role="alert">' + message + '</div>');
                }
                form.find('*').removeAttr('disabled');
                btn.find('b').removeClass('glyphicon-refresh gly-spin').addClass('glyphicon glyphicon-envelope');
            }).fail(function () {
                btn.find('b').removeClass('glyphicon-refresh gly-spin').addClass('glyphicon glyphicon-envelope');
            });
        });
    </script>
    <script src='https://www.google.com/recaptcha/api.js?hl=es'></script>
@endsection

@section('contenido')
    <div class="container">
        <div class="row duddy">
            <div class="col-md-8 col-sm-8 col-xs-12">
                <div class="col-md-6 col-sm-6 col-xs-12">
                    <h2 class="text-left titulo blue">{{ 'Comunícate con nosotros' }}</h2>
                </div>
                {!! Form::open(['method' => 'POST', 'id' => 'formulario-contacto', 'autocomplete' => 'off', 'class' => '']) !!}
                <div class="col-md-6 col-sm-6 col-xs-12 titulo-black">
                    <div for="nombre-apellido" class="form-control-contacto">
                        <b class="texto black">{{'Nombre y apellido'}}&nbsp;*</b>
                        {!! Form::text('nombre-apellido', null, ['class' => 'form-control input-sm']) !!}
                    </div>
                    <div for="correo-electronico" class="form-control-contacto">
                        <b class="texto black"> {{'Correo electronico'}}&nbsp;*</b>
                        {!! Form::email('correo-electronico', null, ['class' => 'form-control input-sm']) !!}
                    </div>
                    <div for="telefono" class="form-control-contacto">
                        <b>{{'Teléfono'}}&nbsp;*</b>
                        {!! Form::tel('telefono', null, ['class' => 'form-control input-sm']) !!}
                    </div>
                </div>
                <div class="col-md-12 col-sm-12 col-xs-12 titulo-black">
                    <div for="mensaje" class="form-control-contacto">
                        <b class="texto black"> {{'Mensaje'}}&nbsp;*</b>
                        {!! Form::textarea('mensaje', null, ['class' => 'form-control input-lg', 'rows' => '5']) !!}
                    </div>
                    <div class="col-md-12 mensaj"></div>
                    <div class="col-md-6 text-right">
                        <div class="g-recaptcha" data-sitekey="6Le6RKIUAAAAAHSdYyx0ZDhli_UCpKf2PfmywLhP"></div>
                        <br>
                    </div>
                    <div class="col-md-6 text-right">
                        <button id="btn-enviar-mensaje" type="button" class="btn btn-burdeo btn-lg">
                            &nbsp{{'Enviar'}}
                        </button>
                    </div>
                </div>
                {!! Form::close() !!}
            </div>
            <div class="col-md-4 col-sm-4 col-xs-12">
                <div class="col-md-12 text-center groot-bottom ">
                    <a href="#" class="btn btn-lg btn-burdeo texto" style="padding: 30px"
                       role="button"><b>{{'Suscribirse'}}<br>{{'a boletín'}}</b></a>
                </div>
                <div class="col-md-12  text-center">
                    <a id="colaboracion"
                       data-href="{{route('post-formulario-colaboracion')}}" class="btn btn-lg btn-burdeo texto"
                       style="padding: 25px"
                       role="button"><b>{{'Colaboració' }}<br>{{'ciudadana'}}</b></a>
                </div>

                <div class="col-md-12 col-sm-12 col-xs-12 groot">
                    <img src="{{ asset('imagenes/general/2-quienes-somos/quienes-somos-2.png') }}"
                         class="img-responsive center-block" alt="tehuelche noticias">
                </div>
            </div>
        </div>
    </div>
@endsection