@extends('layouts.app')

@section('title')
    Contact Us
@endsection

@section('content')

    <div class="headerImage">
        <div class="page-heading-back">
            <div class="container">
                <div class="row">
                    <div class="col-md-12">
                        <div class="page-heading heading-blue p-tb80">
                            <ul>
                                <li>{!! Html::link('/', trans('menu.home')) !!}</li>
                                <li>{!! trans('menu.contacts') !!}</li>
                            </ul>
                            <h2>{!! trans('menu.contacts') !!}</h2>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>



    <div id="page-wrapper">
        <div class="container">
            <div class="row">

                <div class="col-sm-12 col-md-6 col-lg-6">
                    <div class="contactInfo">
                        <h2 class="page-heading">{!! trans('menu.contactInfo') !!}</h2>

                        <address>
                            {!! $contact->details !!}
                        </address>
                    </div>
                </div>


                <div class="col-sm-12 col-md-6 col-lg-6">
                    <h2 class="page-heading">{!! trans('menu.ourLocation') !!}</h2>
                    <div class=" img-thumbnail width-100per">
                            <div id="map"></div>
                    </div>
                </div>


                <div class="col-sm-12 col-md-12 col-lg-12 margintop-35px">
                    <h2 class="page-heading">{!! trans('menu.sendEmail') !!}</h2>
                    <div>
                        {!! Form::open(['url'=>'', 'method'=>'post']) !!}
                        <div class="col-xs-12 col-md-4 marginbottom-14px replcingPadding">
                            {!! Form::text(trans('menu.yourName'), null, ['class'=>'form-control', 'placeholder'=>trans('menu.yourName')]) !!}
                        </div>
                        <div class="col-xs-12 col-md-4 marginbottom-14px replcingPadding">
                            {!! Form::email(trans('menu.yourEmail'), null, ['class'=>'form-control', 'placeholder'=>trans('menu.yourEmail')]) !!}
                        </div>
                        <div class="col-xs-12 col-md-4 marginbottom-14px replcingPadding">
                            {!! Form::text(trans('menu.yourPhone'), null, ['class'=>'form-control', 'placeholder'=>trans('menu.yourPhone')]) !!}
                        </div>
                        <div class="col-xs-12 col-md-12 marginbottom-14px replcingPadding">
                            {!! Form::textarea(trans('menu.yourMessage'), null, ['class'=>'form-control', 'placeholder'=>trans('menu.yourMessage')]) !!}
                        </div>


                        <span class="col-xs-12 col-lg-4 replcingPadding marginbottom-14px">
                            {!! Form::submit(trans('menu.submitContact'), ['class'=>'btn btn-primary width-100-per']) !!}
                          </span>
                        <span class="col-xs-12 col-lg-2 replcingPadding marginbottom-14px">
                            {!! Form::reset(trans('menu.resetContact'), ['class'=>'btn btn-default width-100-per']) !!}
                          </span>

                        {!! Form::close() !!}
                    </div>
                </div>
            </div>
        </div>
    </div>

@endsection

@section('js')
    {{--Map View--}}
    <script>
        var lat = {{ $contact->lat }};
        var lng = {{ $contact->lng }};
        var map;

        function initMap() {
            var map = new google.maps.Map(document.getElementById('map'), {
                center: {
                    lat: lat,
                    lng: lng
                },
                zoom: 15
            });

            var marker = new google.maps.Marker({
                position: {
                    lat: lat,
                    lng: lng
                },
                map: map
                /*draggable: true*/
            });
        }
    </script>
    {{ HTML::script('https://maps.googleapis.com/maps/api/js?key=AIzaSyDDmW4TvEDf8aQNS8JZ_1VntGa6ON-en4Q&callback=initMap&libraries=places') }}

    {{--Slide images--}}

    {{ HTML::script('siteroot/productViewer/smoothproducts.js') }}
    <script type="text/javascript">
        $(window).load(function () {
            $('.sp-wrap').smoothproducts();
        });
    </script>
@endsection