{% extends "admin/eventos/personas/show.html.twig" %}

{% block actionsBottom %}
    <a href="{{ path('admin_evento_agenda_fecha_items_show', 
        { 
            id: entity.id, 
            agendaId: agenda.id, 
            fechaId: fecha.id
        }) }}" class="btn btn-primary">Volver al listado</a> 
    
    <a href="{{ path('admin_evento_agenda_fecha_items_edit', 
        { 
            id: entity.id, 
            agendaId: agenda.id, 
            fechaId: fecha.id, 
            itemId: item.id
        }) }}" class="btn btn-primary">Editar item</a>

{% endblock %}

{% block desvincularFormAction %}
{{ path('admin_evento_agenda_fecha_items_speakers_desvincular', {
    id: entity.id, 
    agendaId: agenda.id, 
    fechaId: fecha.id, 
    itemId: item.id, 
    personaId: speakerAsignado.persona.id
}) }}
{% endblock %}

{% block titleAsignados %}Personas asignadas al item{% endblock %}

{% block javascripts %}
    {{ parent() }}

    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
    
    {% block scriptSection %}
    <script type="text/javascript">
        var rol = {{ rol }},
        	itemId = {{ item.id }},
    		agendaId = {{ agenda.id }}, 
    		fechaId = {{ fecha.id }};

        $('body').on('submit', '#busqueda-form', function (ev) {
            ev.preventDefault();
            $.post( 
                '{{ path("admin_evento_personas_buscar", {id:entity.id}) }}',
                {
                    busqueda: $('#busqueda-form input').val()
                }, 
                function( response ) {
                    var data = $('<div />'), form, $tr;
                    if (response.length) {
                        for (var i = 0; i < response.length; i++) {
                            $tr = $('<tr />');
                            $tr.append($('<td />').text(response[i].nombre));
                            $tr.append($('<td />').text(response[i].apellido));
                            form = '<form action="/admin/evento/' +
                            	response[i].eventoId + '/agenda/' +
                            	agendaId + '/fecha/' + fechaId + '/items/' + 
                            	itemId + '/speaker/' + response[i].id + '/vincular">';
                            form += '<button class="btn btn-default btn-xs" type="submit">Vincular</button>';
                            form += '</form>';
                            $tr.append($('<td />').html(form));
                            data.append($tr);
                        }
                    } else {
                        $tr = $('<tr />');
                        $tr.append(
                            $('<td />').prop('colspan', 3).text('No hay coincidencias')
                        );
                        data.append($tr);
                    }

                    $('#resultados').show().find('tbody').html(data.html());   
                }
            );
        });

        $( function() {
            $( "#sortable" ).sortable({
                stop: function( event, ui ) {
                    setTimeout(function() {
                    var trSpeakers = $('tr.speaker'), 
                        itemPersonas = [], idPersona;
                    
                    for (var i = 0; i < trSpeakers.length; i++) {
                        idPersona = $(trSpeakers[i]).data('idpersona');
                        if (idPersona === undefined) {
                            continue;
                        }
                        itemPersonas.push(
                            {
                                idPersona: idPersona,
                                idItem: itemId,
                            }
                        );
                    }
                    
                    $.post( 
                        '{{ path("admin_evento_agenda_fecha_items_speakers_ordenar", {id:entity.id, agendaId: agenda.id, fechaId: fecha.id, itemId: item.id }) }}',
                        {
                            itemPersonas: itemPersonas
                        }, 
                        function( response ) {

                        }
                    );
                    }, 500);
                }
            });
            $( "#sortable" ).disableSelection();
        } );
    </script>
    {% endblock %}


{% endblock %}