{% extends 'base_turnoweb.html.twig' %}

{% block title %}Turnomate{% endblock %}

{% block body %}
<style>

#map {
        height: 200px;
      }


</style>

<div class="container">

              <div class="card-body box-profile">

                <div class="text-center">
                  <img src="/img/logo-solutions.png" class="main-logo" alt="logo" id="main_logo">
                </div>
                <hr>
                <!--
                 <div id="map"></div>
                -->
                 {% for local in locales %}
                  <div class="callout callout-info" onClick="next({{ local.id }})">
                  <h5>{{ local.nombre }}</h5>

                  <p>{{ local.direccion }}</p>
                </div>
                 {% endfor %}

                
              </div>
              <!-- /.card-body -->

            </div>

                 

</div>
<script type="text/javascript">

/*
    var map;
      function initMap() {
        map = new google.maps.Map(document.getElementById('map'), {
          center: {lat: -34.397, lng: 150.644},
          zoom: 8
        });
      }
*/
function next(id){
      window.location.href="{{ path('turno_web_obtener') }}?local="+id;
}
</script>
<!--
 <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCXZ5Klb8XwzKhlvIGHVmXXSq2M2RC-yb8&callback=initMap"
    async defer></script>-->
{% endblock %}