{% extends 'ElVerdaderoHeader.html' %}
{% block head %}
{{MaestroId}} 
{% endblock %}

{% block css %}
<link rel='stylesheet' href ='../../../static/css/estilo.css'>

{% endblock %}
{% block body %}
<h1 class = 'text-center text-white bg-dark'>A&ntilde;ade su sentencia</h1>

    <div class ='row'>
        
        
        <div class = 'col table-responsive'>
            <form action = "/Maestro/{{MaestroId}}/{{ofertaId}}/addNotas" method = 'POST'>
            <input name ="Maestro" value ='{{MaestroId}}' type ='hidden'>
            <input type ='hidden' value ='{{ofertaId}}' name = 'oferta'>
            <table class="table table-hover">
                <thead>
                    <tr class = 'eval'>
                        <th>Nombre</th>
                      
                        {% set evaluacion = namespace(value=0) %}
                        {% for eval in evaluaciones %}
                        
                      
                        <th>{{eval.tipo}}</th>
                        <input type ='hidden' name = 'cantidadEval[{{evaluacion.value}}]' value = '{{eval.id}}'>
                        {% set evaluacion.value = evaluacion.value +1 %}
                        {% endfor %}
                      
                </thead>
                <tbody>
                    
                {% set column = namespace(value=0) %}
                {% set row = 0 %}
                {% set counterRow = namespace(value =0) %}
                {% set tabindex = namespace(value =0) %}
                {% for estudiante in estudiantes %}
                    <tr class = 'student' data-value='{{estudiante.id}}'>
                        <td class = "w-25">
                            <input type='hidden' name ='id_usuario[{{ column.value }}]' value ='{{estudiante.id}}'>
                            {{estudiante.apellidos}} {{estudiante.nombres}}
                        </td>
                        {% set row = 0 %}
                        
                       
                        {% for row in range (evaluacion.value) %}

                        <td><input type="text"  class="form-control" id='{{evalIds[row]}}' name="evaluacion[{{column.value}}][{{row}}]" onchange ='submitIndividual("evaluacion[{{column.value}}][{{row}}]","{{estudiante.id}}", "{{evalIds[row]}}")' tabindex="{{tabindex.value}}" ></td>
                        {% set tabindex.value = tabindex.value + 1 %}
                        {% set counterRow.value = row  +1 %}
                        {% endfor %}
                    </tr>
                    
                    
                    {% set column.value = column.value + 1 %}
                {% endfor %}
                </tbody>
            </table>
                <input type='hidden' name ='columnPost' value = '{{column.value}}'>
                <input type ='hidden' name = 'row' value ='{{counterRow.value}}'>
                <button type ='submit' class ='btn btn-success'>Someter</button>
        </form>
        </div>
       
    </div>
<script>
    var notasCompletas = jQuery.parseJSON('{{ notasCompletas | tojson | safe}}');
    var maestro = document.getElementsByName('Maestro')
        var oferta = document.getElementsByName('oferta')
        maestro = $(maestro).val();
        oferta = $(oferta).val();

    function submitIndividual(evalNombre, stuId, evalId){

        var valor = document.getElementsByName(evalNombre);
        valor = $(valor).val();
        
       
        var xhr = new XMLHttpRequest();
        xhr.open("POST", '/Maestro/'+maestro+'/'+oferta+'/addNotas', true);
        xhr.setRequestHeader('Content-Type', 'application/json');
        xhr.send(JSON.stringify(
           {
                    'StudentId': stuId,
                    'Nota': valor,
                    'evalId':evalId }
                    
                    ));
        //$.post('Maestro/'+maestro+'/'+oferta+'/addNotas', pos);
    }

    $(document).ready(function(){

        



        
        $('tr.student').each(function(){
            var index =0;
            var counter =0;
            var studentId = $(this).data('value');
            var tr = $(this);
            tr.children('td').each(function (){
                var td = $(this);
               td.children('input.form-control').each(function(){
                   
                   if ($(this).attr('id')==notasCompletas[studentId].evaluacion[counter]){
                       $(this).val(notasCompletas[studentId].valorSaco[counter])
                       counter +=1;
                    }
                   index+=1

                   
               })
            })
            

        
        })
        
    })

    
</script>


{% endblock %}