{% extends 'base.html.twig' %}
{% block stylesheets %}
    <link rel="stylesheet"
          href="{{ asset('assets/bower_components/datatables.net-bs/css/dataTables.bootstrap.min.css') }}">
{% endblock stylesheets %}
{% block titulo %}Lugares{% endblock %}
{% block subtitulo %}Gestión{% endblock %}

{% block body %}
    <div class="row">
        <div class="col-md-6">
            <div class="box box-info">
                <div class="box-header">
                    <h3 class="box-title">Lugares</h3>
                    <a href="{{ path('horarios_lugar_nuevo') }}" class="btn btn-default pull-right">
                        <i class="fa fa-plus"></i>
                    </a>
                </div>
                <div class="box-body">
                    <div class="dataTables_wrapper form-inline dt-bootstrap">
                        <div class="row">
                            <div class="col-sm-12">
                                <div class="table-responsive">
                                    <table id="mitabla" class="table table-bordered table-striped dataTable" role="grid"
                                           aria-describedby="mitabla_info">
                                        <thead>
                                        <tr role="row">
                                            <th tabindex="0" aria-controls="mitabla" rowspan="1"
                                                colspan="1">
                                            </th>
                                            <th class="sorting_asc" tabindex="0" aria-controls="mitabla" rowspan="1"
                                                colspan="1" aria-sort="ascending"
                                                aria-label="Rendering engine: activate to sort column descending">
                                                Nombre
                                            </th>
                                            <th>
                                            </th>
                                        </tr>
                                        </thead>
                                        <tbody>

                                        {% for lugar in lugares %}
                                            <tr role="row" class="odd">
                                                <td>{{ lugar.nombreCorto }}</td>
                                                <td class="sorting_1">{{ lugar.nombreLargo }}</td>
                                                <td>
                                                    <div class="btn-group btn-group-xs pull-right">
                                                        {% if lugar.mapaArchivo %}
                                                            <button type="button" class="btn btn-default"
                                                                    data-toggle="modal"
                                                                    data-target="#mapaModal{{ lugar.id }}">
                                                                <i class="fa fa-map"></i>
                                                            </button>
                                                            <div class="modal fade" id="mapaModal{{ lugar.id }}" tabindex="-1"
                                                                 role="dialog"
                                                                 aria-labelledby="comentarioModalLabel"
                                                                 aria-hidden="true">
                                                                <div class="modal-dialog" role="document">
                                                                    <div class="modal-content">
                                                                        <div class="modal-header">
                                                                            <h5 class="modal-title"
                                                                                id="exampleModalLabel">{{ lugar.nombreLargo }}</h5>
                                                                            <button type="button" class="close"
                                                                                    data-dismiss="modal"
                                                                                    aria-label="Cerrar">
                                                                                <span aria-hidden="true">&times;</span>
                                                                            </button>
                                                                        </div>
                                                                        <div class="modal-body">
                                                                            <img src="{{ vich_uploader_asset(lugar.mapaArchivo,'archivo') }}"
                                                                                 width="100%">
                                                                        </div>
                                                                        <div class="modal-footer">
                                                                            <button type="button"
                                                                                    class="btn btn-secondary"
                                                                                    data-dismiss="modal">
                                                                                Cerrar
                                                                            </button>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        {% else %}
                                                            <button type="button" class="btn btn-default"
                                                                    disabled>
                                                                <i class="fa fa-map"></i>
                                                            </button>
                                                        {% endif %}
                                                        <a class="btn btn-default"
                                                           href="{{ path('editar_lugar' , {'id': lugar.id | nzo_encrypt }) }}">
                                                            <i class="fa fa-pencil"></i>
                                                        </a>
                                                        <a class="btn btn-default" href="{{ path('secretaria_listado_horarios' , {'dia': 0, 'lugar': lugar |nzo_encrypt()}) }}">
                                                            <i class="fa fa-trash"></i>
                                                        </a>
                                                    </div>
                                                </td>
                                            </tr>
                                        {% endfor %}

                                        </tbody>
                                        <tfoot>
                                        </tfoot>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
        </div>
        <div class="col-md-6">

        </div>
    </div>



{% endblock %}
{% block javascripts %}
    <script src="{{ asset('assets/bower_components/datatables.net/js/jquery.dataTables.min.js') }}"></script>
    <script src="{{ asset('assets/bower_components/datatables.net-bs/js/dataTables.bootstrap.min.js') }}"></script>
    <script src="{{ asset('assets/bower_components/jquery-slimscroll/jquery.slimscroll.min.js') }}"></script>
    <script src="{{ asset('assets/bower_components/fastclick/lib/fastclick.js') }}"></script>
    <script>
        $(function () {
            $('#mitabla').DataTable({
                "language": {
                    "sProcessing": "Procesando...",
                    "sLengthMenu": "Mostrar _MENU_ registros",
                    "sZeroRecords": "No se encontraron resultados",
                    "sEmptyTable": "Ningún dato disponible en esta tabla",
                    "sInfo": "Mostrando registros del _START_ al _END_ de un total de _TOTAL_ registros",
                    "sInfoEmpty": "Mostrando registros del 0 al 0 de un total de 0 registros",
                    "sInfoFiltered": "(filtrado de un total de _MAX_ registros)",
                    "sInfoPostFix": "",
                    "sSearch": "Buscar:",
                    "sUrl": "",
                    "sInfoThousands": ",",
                    "sLoadingRecords": "Cargando...",
                    "oPaginate": {
                        "sFirst": "Primero",
                        "sLast": "Último",
                        "sNext": "Siguiente",
                        "sPrevious": "Anterior"
                    },
                    "oAria": {
                        "sSortAscending": ": Activar para ordenar la columna de manera ascendente",
                        "sSortDescending": ": Activar para ordenar la columna de manera descendente"
                    }
                }
            });
        })
    </script>
{% endblock javascripts %}