@section('title')
{{ trans('seo.dealers.title') }} | 
@stop

@section('metatags')
<meta name="description" content="{{ trans('seo.dealers.description') }}">
<meta property="og:title" content="{{ trans('seo.dealers.facebook.title') }}">
<meta property="og:description" content="{{ trans('seo.dealers.facebook.description') }}">
<meta property="og:image" content="{{ trans('seo.og-image.url') }}">
<meta property="og:image:width" content="{{ trans('seo.og-image.width') }}">
<meta property="og:image:height" content="{{ trans('seo.og-image.height') }}">
<meta name="robots" content="index, follow">
@stop

@section('content')
<section>
    <div class="container">
        <div class="row">
            <div class="col-sm-12">
                <ol class="breadcrumb">
                    <li><a href="{{ route('home.index') }}">Início</a></li>
                    <li class="active">Encontre uma Loja</a></li>
                </ol>
            </div>
            <div class="col-sm-12">
                <div class="pull-left">
                    <h1 class="margin-top-0 margin-bottom-10">
                        Encontre uma Loja
                    </h1>
                    <h4 class="text-muted">Mais de 270 pontos de venda em todo o país.</h4>
                </div>
            </div>
        </div>
        <div class="spacer-15"></div>
        <div class="row">
            <div class="col-sm-5">
                <div class="form-group">
                    {{ Form::label('district', 'Selecione o Distrito') }}
                    {{ Form::select('district', [], null, ['class' => 'form-control select2']) }}
                </div>
            </div>
            <div class="col-sm-7">
                <div class="spacer-25"></div>
                <div id="map" style="width: 100%; height: 500px;"></div>
            </div>
        </div>
        <div class="spacer-50"></div>
    </div>
</section>
@stop

@section('scripts')
<script src="http://maps.googleapis.com/maps/api/js?key=AIzaSyCgIlg1qhZX5Hgc1sS_6Kl1vzPCP2iPIls"></script>
<script>
var latlng = new google.maps.LatLng({{ Setting::get('maps_latitude') }}, {{ Setting::get('maps_longitude') }});
var mapProp = {
    center: latlng,
    zoom: 7,
    zoomControl: true,
    mapTypeControl: false,
    navigationControl: false,
    streetViewControl: false,
    scrollwheel: false,
    mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map"), mapProp);

var marker = new google.maps.Marker({
    position: new google.maps.LatLng({{ Setting::get('maps_latitude') }}, {{ Setting::get('maps_longitude') }}),
    title: "{{ Setting::get('company_name') }}",
    map: map
});

var infowindow = new google.maps.InfoWindow(), marker;
google.maps.event.addListener(marker, 'click', (function (marker, i) {
    return function () {
        var html = "<b class='text-uppercase'>{{ Setting::get('company_name') }}<br/>\n\
                        <a href='{{ Setting::get('maps_url') }}' target='_blank'><i class='fa fa-location-arrow'></i> Abrir no Google Maps</a>";
        infowindow.setContent(html);
        infowindow.open(map, marker);
    }
})(marker));
</script>
@stop