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

{% block javascripts_base %}
    function initDateFormat( datePicker ) {
        var selectedDate = ( typeof datePicker.date === 'undefined' || datePicker.date === null ) ? datePicker.options.defaultDate : datePicker.date;
        var shortWeekdays = datePicker.options.i18n.weekdaysShort; 
        var shortMonths = datePicker.options.i18n.monthsShort; 
        var day     = selectedDate.getDate();
        var weekday = shortWeekdays[ selectedDate.getDay() ];
        var month   = shortMonths[ selectedDate.getMonth() ];

        var formattedDate = weekday + ', ' + day + ' ' + month;
        document.querySelector(".datepicker-date-display .date-text").innerHTML = formattedDate;
        document.querySelector(".datepicker-date-display .year-text").innerHTML = selectedDate.getFullYear();
    }
{% endblock %}

{% block js_document_ready %}
  //Manejo de boton para eximiciones
  var $eximicion = $('#inscripcion_con_rectificatoria_eximicion');
  $eximicion.change(function() {
    if(this.value == '1')
    {
      $(this).closest('form').find('.divEximicion').show();
    }
    else
    {
      $(this).closest('form').find('.divEximicion').hide();
    }
  });
  $eximicion.change();
  
  //Show de errores
  var helpers = $(this).find('span.helper-text');
  if(helpers)
  {
      helpers.each(function() {
          var elemento = $(this);
          elemento.text(elemento.attr('data-error'));
      });
      helpers.attr("style", "color:#F44336");
      helpers.siblings('.select-wrapper').find('input.select-dropdown').prop('class', 'invalid');
  }

  $('.datepicker').datepicker({
        autoClose: true,
        showClearBtn: true,
        format: 'dd/mm/yyyy',
        container: 'body',
        onDraw: function (datePicker) { 
            // materialize select dropdown not proper working on mobile and tablets so we make it browser default select
            $('.datepicker-container').find('.datepicker-select').addClass('browser-default');
            $(".datepicker-container .select-dropdown.dropdown-trigger").remove();
        },
        onOpen: function (p) {
            var instance = M.Datepicker.getInstance(this.el);
            var d = instance.el.value.split(/[^0-9]/);
            var newDate = new Date(d[2], d[1] - 1, d[0]);
            instance.setDate(newDate);
            initDateFormat(instance);
        },
        i18n: {
            cancel:	'Cancelar',
            clear: 'Limpiar',
            done: 'Aceptar',
            weekdays: ["Domingo", "Lunes", "Martes", "Miércoles", "Jueves", "Viernes", "Sábado"],
            weekdaysShort: ["Domingo", "Lunes", "Martes", "Miércoles", "Jueves", "Viernes", "Sábado"],
            weekdaysAbbrev: ["D", "L", "M", "M", "J", "V", "S"],
            today: 'Hoy',
            months: [
                'Enero',
                'Febrero',
                'Marzo',
                'Abril',
                'Mayo',
                'Junio',
                'Julio',
                'Agosto',
                'Septiembre',
                'Octubre',
                'Noviembre',
                'Diciembre'
            ],
            monthsShort: [
                'Enero',
                'Febrero',
                'Marzo',
                'Abril',
                'Mayo',
                'Junio',
                'Julio',
                'Agosto',
                'Septiembre',
                'Octubre',
                'Noviembre',
                'Diciembre'
            ],
        }
    });
    $('.btnSubmit').click(function (e) {
        let formulario = $('form')[0];
        let data = "<div>";
        let tituloTerritorio='<h5>Se inscribirá al siguiente territorio: </h5>';
        let cuerpoTerritorialidad = "";
        {% if form.departamentosJudiciales is defined %}
            cuerpoTerritorialidad += '<div class="row">';
            let departamentos = $(formulario).find('#inscripcion_con_rectificatoria_departamentosJudiciales').siblings('input').val().split(',');
            let i = 0;
            let dep = "";
            for(i=0;i<departamentos.length;i++)
            {
                dep += '<div class="col s12 m4 l3"><span class="identidad-color-text"><div class="card-panel border-radius-6 identidad-color lighten-4">'+departamentos[i]+'</div></span></div>';
            }
            data += tituloTerritorio;
            cuerpoTerritorialidad += dep;
            if(departamentos.length == 0 || departamentos[0] == false)
                {
                    data = "";
                    cuerpoTerritorialidad = "";
                }
            cuerpoTerritorialidad += '</div>';
        {% elseif form.regionesJudiciales is defined %}
            cuerpoTerritorialidad += '<div class="row">';
            let regiones = $(formulario).find('#inscripcion_con_rectificatoria_regionesJudiciales').siblings('input').val().split(',');
            let i = 0;
            let reg = "";
            for(i=0;i<regiones.length;i++)
            {
                reg += '<div class="col s12 m4 l3"><span class="identidad-color-text"><div class="card-panel border-radius-6 identidad-color lighten-4">'+regiones[i]+'</div></span></div>';
            }
            data += tituloTerritorio;
            cuerpoTerritorialidad += reg;
            if(regiones.length == 0 || regiones[0] == false)
                {
                    data = "";
                    cuerpoTerritorialidad = "";
                }
            cuerpoTerritorialidad += '</div>';
        {% else %}
            data += tituloTerritorio;
            cuerpoTerritorialidad += '<div class="row"><div class="col s12 m4 l3">';
            cuerpoTerritorialidad += '<span class="identidad-color-text"><div class="card-panel border-radius-6  identidad-color lighten-4">Provincia de Buenos Aires<br><small><br></small></div></span>';
            cuerpoTerritorialidad += '</div></div>';
        {% endif %}
        data += cuerpoTerritorialidad;

        let pidioEximicion = $(formulario).find('#inscripcion_con_rectificatoria_eximicion').siblings('input').val();
        if(pidioEximicion === 'SI')
        {
            let resolucion = $(formulario).find('#inscripcion_con_rectificatoria_resolucionEximir').siblings('input').val();
            let cuerpoTerritorialidadEximicion = "";
            cuerpoTerritorialidadEximicion += '<div><h5>Se solicitó eximición por resolución <b>'+resolucion+'</b> para:</span></h5>';
            {% if form.departamentosJudicialesEximidos is defined %}
                cuerpoTerritorialidadEximicion += '<div class="row">';
                let departamentos = $(formulario).find('#inscripcion_con_rectificatoria_departamentosJudicialesEximidos').siblings('input').val().split(',');
                let i = 0;
                let dep = "";
                for(i=0;i<departamentos.length;i++)
                {
                    dep += '<div class="col s12 m4 l3"><span class="identidad-color-text"><div class="card-panel border-radius-6 identidad-color lighten-4">'+departamentos[i]+'</div></span></div>';
                }
                cuerpoTerritorialidadEximicion += dep;
                cuerpoTerritorialidadEximicion += '</div>';
                if(departamentos.length == 0 || departamentos[0] == false)
                {
                    cuerpoTerritorialidadEximicion = "";
                }
            {% else %}
                data = "";
                cuerpoTerritorialidad = "";
                cuerpoTerritorialidadEximicion += '<div class="row"><div class="col">';
                cuerpoTerritorialidadEximicion += '<div class="card-panel border-radius-6  identidad-color lighten-4">Provincia de Buenos Aires Eximición<br><small><br></small></div>';
                cuerpoTerritorialidadEximicion += '</div></div>';
            {% endif %}
            if(resolucion)
            {
                data += cuerpoTerritorialidadEximicion;
            }
        }

        data += '</div>';
        $("#modalPreview .modal-content").html(data);
        $("#modalPreview").modal('open');
    });

    $("#btnAceptar").on("click", function (event) {
        let formulario = $('form')[0];
        formulario.submit();
        {# event.stopPropagation();
        event.preventDefault();
        botonClick = event.currentTarget; #}
    });

    $('.btnCancelar').click(function (e) {
        $("#modalPreview").modal('close');
    });
{% endblock %}

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

{% block breadcrumb %}
    <ol class="breadcrumbs">
        <li><a class="" href="#">Inicio</a></li>
        <li><a class="" href="{{ path('rectificaciones_index_limpiar') }}">Rectificatorias </a></li>
        <li><a class="active" href="#">Editar Rectificatoria de {{inscripcionRectificatoria.inscripcion.presentacionAntecedentes.datosPersonales.apellidos}}, {{inscripcionRectificatoria.inscripcion.presentacionAntecedentes.datosPersonales.nombres}}</a></li>
    </ol>
{% endblock %}

{# {% block title %}Rectificar Inscripción{% endblock %} #}

{% block titulo_body %}
    <div class="row hide-on-small-only">
        <div class="col s12">
            <i style="margin-top:27px" class="material-icons  medium left identidad-color-text text-darken-2">
            assignment_ind
            </i>
            <h4 style="margin-left:75px">Editar Rectificatoria</h4>
            <h6>{{ inscripcionRectificatoria.inscripcion.presentacionAntecedentes.datosPersonales.dni }} - {{inscripcionRectificatoria.inscripcion.presentacionAntecedentes.datosPersonales.apellidos}}, {{inscripcionRectificatoria.inscripcion.presentacionAntecedentes.datosPersonales.nombres}}</h6>
            <br>
        </div>
    </div>
{% endblock %}

{% block body %}

    <div class="row">
      <div class="col s12 m4 l4">
        <h5>Convocatoria: </h5>{{inscripcionRectificatoria.inscripcion.convocatoriaExamen.convocatoria|upper}}
      </div>
      <div class="col s12 m5 l5">
        <h5>Cargo: </h5>{{inscripcionRectificatoria.inscripcion.convocatoriaExamen.cargo|upper}}
      </div>
      <div class="col s12 m3 l3">
        <h5>Tipo Inscripción: </h5>{{inscripcionRectificatoria.inscripcion.convocatoriaExamen.tipoInscripcion|upper}}
      </div>
    </div>
    <br>
    <div class="row">
        {{ include('inscripciones/inscripcionRectificatoria/_form.html.twig', {button_label: 'Actualizar'}) }}
    </div>

    {# <a href="{{ path('app_inscripciones_inscripcion_index') }}">back to list</a> #}
{% endblock %}

{% block dialogos_modales %}
    <div id="modalPreview" class="modal">
        <div class="row" style="padding: 15px;">
            <div class="col s12">
                <h4>{{inscripcionRectificatoria.inscripcion.convocatoriaExamen.convocatoria|upper}}</h4>
                <h6 style="font-style: italic;">{{inscripcionRectificatoria.inscripcion.convocatoriaExamen.cargo|upper}}</h6>
            </div>
            <div class="row">
                <div class="col s12">
                    <h6>
                        <i class="material-icons left identidad-color-text text-darken-2">person</i>
                        {{ inscripcionRectificatoria.inscripcion.presentacionAntecedentes.datosPersonales.dni }} - {{inscripcionRectificatoria.inscripcion.presentacionAntecedentes.datosPersonales.apellidos}}, {{inscripcionRectificatoria.inscripcion.presentacionAntecedentes.datosPersonales.nombres}}
                    </h6>
                </div>
            </div>
        </div>
        <div class="modal-content"> 
           {# Contenido del Modal #}
        </div>
        <div class="modal-footer">
            <div class="container">
                {# <a href="#!" class="modal-close waves-effect waves-green btn left red">
                    <i class="material-icons right">highlight_off</i>
                    Cancelar
                </a> #}
                <button class="btnCancelar waves-effect waves-green btn left red">
                    <i class="material-icons right">highlight_off</i>
                    Cancelar
                </button>
                <button id="btnAceptar" class="waves-effect waves-green btn">
                    Aceptar
                    <span class="material-icons">arrow_forward_ios</span>
                </button>
            </div>
        </div>
    </div>
{% endblock %}