{% extends 'inc/base.html.twig' %}
{% block body %}
<div class="container-fluid">
<div class="row">
<div class="col-lg-12 col-md-6">
<h2>Educador: {{ datos_educa.id_ed }}&nbsp;-&nbsp;{{ datos_educa.ape_ed}}&nbsp;{{ datos_educa.nom_ed }}</h2>
<strong style="font-size: larger">Curso:&nbsp;{{ cuestionarios.curso }}</strong>
{{ datos_educa.id_curso }}
<a href="{{ constant('URLROOT2') }}/lms/actividades/{{ cuestionarios.curso }}" class="btn btn-danger pull-right"><i class="fa fa-backward"></i> Regresar</a>
</div>
</div>

<div class="row">
<div class="col-lg-12 col-md-6">
<hr style="width: 100%; height: 4px; background-color: #006699">
</div>
</div>

<div class="row">
<div class="col-lg-10 col-md-6">
<h3 class="text-primary">CUESTIONARIO</h3>
<div class="col-md-12 mt-3">



    <input class="form-control" tabindex="3" type="text" value="{{ cuestionarios.titulo }}" disabled />
    <textarea class="form-control" id="instrucciones" name="instrucciones" rows="3" disabled>{{ cuestionarios.instrucciones }}</textarea>
    <label><b>Puntuaci&oacute;n:</b><input class="form-control" tabindex="3" type="text"  value="{{ cuestionarios.puntuacion }}" disabled /></label>
    <label><b>Fecha l&iacute;mite:</b><input class="form-control" tabindex="3" type="text"  value="{{ cuestionarios.entrega | date('d/m/Y') }}" disabled /></label>

<div class="col-md-12 mt-3">
    <input id="id_Educa" type="hidden" name="id_Educa" value="{{ datos_educa.ced_ed }}">
    <input id="id_Curso" type="hidden" name="id_Curso" value="{{ datos_educa.id_curso }}">
<table class="table table-striped table-hover table-sm">
<thead>
        <tr class="d-flex" style="background-color: #003366;color:#FFFFFF;" >
            <td class='col-sm-1 text-left'>No.</td>
            <td class='col-sm-5 text-left'>PREGUNTA</td>
            <td class='col-sm-2 text-center'>PUNTOS</td>
            <td class='col-sm-2 text-center'>MODELO</td>
            <td class='col-sm-2 text-center'>&nbsp;</td>
        </tr>
</thead>
<tbody>
{% set nro_preg=1 %}
{% for pregunta in preguntas %}
    {% if pregunta.pregunta_tipo == 'VOF' %}
    {% set tipo='Verdadero / Falso' %}
    {% elseif pregunta.pregunta_tipo == 'PAB' %}
    {% set tipo='Pregunta Abierta' %}
    {% else %}
    {% set tipo='Selección Múltiple' %}
    {% endif %}
        <tr class="d-flex">
            <td class='col-sm-1 text-left'>{{ nro_preg }}</td>
            <td class='col-sm-5 text-left'>{{ pregunta.pregunta }}</td>
            <td class='col-sm-2 text-center'>{{ pregunta.puntos }}</td>
            <td class='col-sm-2 text-center'>{{ tipo | convert_encoding('UTF-8', 'ISO-8859-1') }}</td>
            <td class='col-sm-2 text-center'>
            <a href="" class="xbutton btn btn-warning btn-sm" data-id="{{ pregunta.id }}" data-token="" data-ruta="{{ constant('URLROOT2') }}/lms/EduPreguntaBuscar/{{ pregunta.id }}" data-toggle="tooltip" data-placement="top" title="Editar la pregunta"><i class="fa fa-edit"></i></a>
            <a href="" class="button btn btn-danger btn-sm" data-id="{{ pregunta.id }}" data-token="" data-ruta="{{ constant('URLROOT2') }}/lms/EduPreguntaDel/{{ pregunta.id }}"  data-toggle="tooltip" data-placement="top" title="Eliminar Registro"><i class="fa fa-trash"></i></a>
            </td>
        </tr>
{% set nro_preg=nro_preg+1 %}
{% endfor %}

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

<!-- INICIO CICLO VERDADERO / FALSO -->
<div id='VOF'>
<form action="{{ constant('URLROOT2') }}/lms/EduCuestionarioCrear" method="post">

<input id="id_Curso" type="hidden" name="id_Curso" value="{{ datos_educa.id_curso }}">
<input id="id_preg1" type="hidden" name="id_preg" value="">

{% set respta1='' %}
{% set respta2='' %}
<div id="sections">
<div class="section mt-2">
<hr style="width: 100%; background-color: #003399">

<div class="row">
<div class="col-lg-10 col-md-6">
<h3><b>VERDADERO / FALSO</b></h3>
</div>
</div>
<div class="row">
<div class="col-lg-10 col-md-6">
<b>.:: PREGUNTA {{ nro_preg }} ::.</b>
<input id="tipo_preg" type="hidden" name="tipo_preg" value="VOF">
<input id="nro_preg" type="hidden" name="nro_preg" value="{{ nro_preg }}">
<input class="form-control" tabindex="3" type="text" id="pregvof" name="preg" value="" placeholder="Escriba la prenguta a realizar" required />
</div>
<div class="col-lg-2 col-md-6 text-center">
    <b>PUNTOS:</b>
    <input class="form-control text-center" tabindex="3" type="number" id='puntosvof' name="puntos" value="" min=0 placeholder="Puntos" required />
</div>
        <div class="col-lg-10 col-md-6 text-center">
            <b><span style="font-size: small">Seleccione la Respuesta Correcta</span></b><br>
        <select class="form-control" id="opvof" name="op" size="1">
        <option value="Verdadero" selected="selected">Verdadero</option>
        <option value="Falso">Falso</option>
        </select>
        </div>
<div class="col-lg-2 col-md-6 text-center"><br>
&nbsp;
</div>

<input id="respcc3" type="hidden" name="resp3" value="VOF">
</div>
<!--<button class="btn btn-danger btn-sm mt-3" name="boton2" id="boton2" type="button" onclick="elimina(this);">Eliminar esta Pregunta</button>
--></div>
</div>
<input class="btn btn-success btn-sm mt-3 pull-right" tabindex="11" id="btnguardar1" name="enviar" type="submit" value="Guardar Pregunta">
</form>
</div>
<!-- FIN CICLO VERDADERO / FALSO -->

<!-- INICIO CICLO SELECCION MULTIPLE -->
<div id='SMT'>
<form action="{{ constant('URLROOT2') }}/lms/EduCuestionarioCrear" method="post">

<input id="id_Curso" type="hidden" name="id_Curso" value="{{ datos_educa.id_curso }}">
<input id="id_preg2" type="hidden" name="id_preg" value="">

{% set nro=0 %}
{% set respta1='' %}
{% set respta2='' %}


<div id="sections2">
<div class="section2 mt-2">
<hr style="width: 100%; background-color: #003399">

<div class="row">
<div class="col-lg-10 col-md-6">
<h3><b>SELECCI&Oacute;N M&Uacute;LTIPLE</b></h3>
</div>
</div>

<div class="row">
<div class="col-lg-10 col-md-6">
<b>.:: PREGUNTA {{ nro_preg }} ::.</b>
<input id="tipo_preg" type="hidden" name="tipo_preg" value="SMT">
<input id="nro_preg" type="hidden" name="nro_preg" value="{{ nro_preg }}">
<input class="form-control" tabindex="3" type="text" id="pregsmt" name="preg" value="" placeholder="Escriba la prenguta a realizar" required />
</div>
<div class="col-lg-2 col-md-6 text-center">
    <b>PUNTOS:</b>
    <input class="form-control text-center" tabindex="3" type="number" id='puntosmt' name="puntos" value="" min=0 placeholder="Puntos" required />

</div>
        <div class="col-lg-10 col-md-6">
        <label><b>Respuestas:</b></label>
        </div>
        <div class="col-lg-2 col-md-6 text-center">
        <b><span style="font-size: x-small">Seleccione las Respuestas</span></b>
        </div>
<div class="col-lg-10 col-md-6">
<input class="form-control" tabindex="3" type="text" id="resp1" name="resp1" placeholder="Escriba la respuesta" required />
</div>
        <div class="col-lg-2 col-md-6 text-center">
        <input id="r1" name="op" type="radio" checked="checked" value="1">
        </div>

<div class="col-lg-10 col-md-6">
<input class="form-control" tabindex="3" type="text" id="resp2" name="resp2" placeholder="Escriba la respuesta" required />
</div>
        <div class="col-lg-2 col-md-6 text-center">
        <input id="r2" name="op" type="radio" value="2">
        </div>

<div class="col-lg-10 col-md-6">
<input class="form-control" tabindex="3" type="text" id="resp3" name="resp3" placeholder="Escriba la respuesta" required />
</div>
        <div class="col-lg-2 col-md-6 text-center">
        <input id="r3" name="op" type="radio" value="3">
        </div>

</div>
</div>
</div>



<input class="btn btn-success btn-sm mt-3 pull-right" tabindex="11" id="btnguardar2" name="enviar" type="submit" value="Guardar Pregunta">

</form>
</div>
<!-- FIN CICLO SELECCION MULTIPLE -->

<!-- INICIO PREGUNTA ABIERTA -->
<div id='PAB'>
<form action="{{ constant('URLROOT2') }}/lms/EduCuestionarioCrear" method="post">

<input id="id_Curso" type="hidden" name="id_Curso" value="{{ datos_educa.id_curso }}">
<input id="id_preg3" type="hidden" name="id_preg" value="">

{% set respta1='' %}
{% set respta2='' %}
<div id="sections">
<div class="section mt-2">
<hr style="width: 100%; background-color: #003399">

<div class="row">
<div class="col-lg-10 col-md-6">
<h3><b>PREGUNTA ABIERTA</b></h3>
</div>
</div>
<div class="row">
<div class="col-lg-10 col-md-6">
<b>.:: PREGUNTA {{ nro_preg }} ::.</b>
<input id="tipo_preg" type="hidden" name="tipo_preg" value="PAB">
<input id="nro_preg" type="hidden" name="nro_preg" value="{{ nro_preg }}">
<textarea  id="pregab" name="preg000" rows="5" placeholder="Escriba la prenguta a realizar" required ></textarea>

</div>
<div class="col-lg-2 col-md-6 text-center">
    <b>PUNTOS:</b>
    <input class="form-control text-center" tabindex="3" type="number" id='puntosab' name="puntos" value="" min=0 placeholder="Puntos" required />
</div>
<input id="op" type="hidden" name="op" value="PAB">
<input id="respxx3" type="hidden" name="resp1" value="PAB">
<input id="respxxx3" type="hidden" name="resp2" value="PAB">
<input id="respx3" type="hidden" name="resp3" value="PAB">
</div>
<!--<button class="btn btn-danger btn-sm mt-3" name="boton2" id="boton2" type="button" onclick="elimina(this);">Eliminar esta Pregunta</button>
--></div>
</div>
<input class="btn btn-success btn-sm mt-3 pull-right" tabindex="11" id="btnguardar3" name="enviar" type="submit" value="Guardar Pregunta">
</form>
</div>


</div>
</div>

<!-- HAST AQUI -->
    <div class="col-lg-2 col-md-6">
    <h6 style="color:#003366" >Selecciona la pregunta a agregar</h6>
    <div class="col-lg-12 col-md-6">
    <div class="card">
    <a onclick="abierta();" style="background-color: #007A00;color:#FF6600;" href="#final" data-toggle="tooltip" data-placement="top" title="Ir a Tarea">
    <h6 class="card-header text-white text-center" style="background-color: #FF7029" >Pregunta Abierta</h6>
    </a>
    <div class="card-body text-center" style="background-color: #9E5F00">
    <i class="fa fa-comments fa-2x text-white"></i>
    </div>
    </div>
    </div>

    <div class="col-lg-12 col-md-6">
    <div class="card">
    <a onclick="verdadero_falso();" style="background-color: #007A00;color:#FF6600;" href="#final" data-toggle="tooltip" data-placement="top" title="Ir a Tarea">
    <h6 class="card-header text-white text-center" style="background-color: #FF7029" >Verdadero o Falso</h6>
    </a>
    <div class="card-body text-center" style="background-color: #9E5F00">
    <i class="fa fa-comments fa-2x text-white"></i>
    </div>
    </div>
    </div>

    <div class="col-lg-12 col-md-6">
    <div class="card">
    <a onclick="multiple();" style="background-color: #007A00;color:#FF6600;" href="#final" data-toggle="tooltip" data-placement="top" title="Ir a Tarea">
    <h6 class="card-header text-white text-center" style="background-color: #FF7029" >Seleccion Multiple</h6>
    </a>
    <div class="card-body text-center" style="background-color: #9E5F00">
    <i class="fa fa-comments fa-2x text-white"></i>
    </div>
    </div>
    </div>
    </div>
</div>
<br><br><br>
</div>
<div id='final'>ffff</div>
{% endblock %}
{% block javascripts %}
<script type="text/javascript">
$("#VOF").hide();
$("#SMT").hide();
$("#PAB").show();

function verdadero_falso(){
$("#PAB").hide();
$("#SMT").hide();
$("#VOF").show();
location.href='#final';
}

function multiple(){
$("#PAB").hide();
$("#VOF").hide();
$("#SMT").show();
parent.location="#final";
}

function abierta(){
$("#SMT").hide();
$("#VOF").hide();
$("#PAB").show();
parent.location="#final";
}

$(document).on('click', '.xbutton', function (e) {
        e.preventDefault();
        var id = $(this).data('id');
        var token = $(this).data('token');
        var ruta = $(this).data('ruta');
//        alert(ruta);
       	$.ajax({
        url: ruta,
        type: "POST",
        cache: false,
        data: {id:id,_method: 'delete', token :token},
        success: function(dataa){
            alert(dataa);
            var datos = JSON.parse(dataa);
            //alert(datos);
            if(datos.pregunta_tipo=='PAB'){
            $("#SMT").hide();
            $("#VOF").hide();
            $("#PAB").show();
            document.getElementById('id_preg3').value=datos.id;
            document.getElementById('btnguardar3').value='Actualizar Pregunta';
            document.getElementById('pregab').value=datos.pregunta;
            document.getElementById('puntosab').value=datos.puntos;
            }else if(datos.pregunta_tipo=='VOF'){
            $("#PAB").hide();
            $("#VOF").show();
            $("#SMT").hide();
             document.getElementById('id_preg1').value=datos.id;
            document.getElementById('btnguardar1').value='Actualizar Pregunta';
            document.getElementById('pregvof').value=datos.pregunta;
            document.getElementById('puntosvof').value=datos.puntos;
            document.getElementById("opvof").value=datos.correcta;
            }else{
            $("#PAB").hide();
            $("#VOF").hide();
            $("#SMT").show();
             document.getElementById('id_preg2').value=datos[0].id;
            document.getElementById('btnguardar2').value='Actualizar Pregunta';
            document.getElementById('pregsmt').value=datos[0].pregunta;
            document.getElementById('puntosmt').value=datos[0].puntos;
            document.getElementById('resp1').value=datos[1][0].respuesta;
            document.getElementById('resp2').value=datos[1][0].respuesta2;
            document.getElementById('resp3').value=datos[1][0].respuesta3;
            if(datos[0].correcta==1){
            document.getElementById('r1').checked = true;
            }else if(datos[0].correcta==2){
            document.getElementById('r2').checked = true;
            }else{
            document.getElementById('r3').checked = true;
            }
            console.log(datos[0].respuesta);
            //   return false;
             //   $("#final").html(datos);
            }}
        });
        return false;
});

//CKEDITOR.replace( 'preg000' );



        CKEDITOR.replace('preg000', {
            extraPlugins: 'uploadimage,image2',
            height: 300,

            // Upload images to a CKFinder connector (note that the response type is set to JSON).
            uploadUrl: '/apps/ckfinder/3.4.5/core/connector/php/connector.php?command=QuickUpload&type=Files&responseType=json',

            // Configure your file manager integration. This example uses CKFinder 3 for PHP.
            filebrowserBrowseUrl: '/apps/ckfinder/3.4.5/ckfinder.html',
            filebrowserImageBrowseUrl: '/apps/ckfinder/3.4.5/ckfinder.html?type=Images',
            filebrowserUploadUrl: '/apps/ckfinder/3.4.5/core/connector/php/connector.php?command=QuickUpload&type=Files',
            filebrowserImageUploadUrl: '/apps/ckfinder/3.4.5/core/connector/php/connector.php?command=QuickUpload&type=Images',

            // The following options are not necessary and are used here for presentation purposes only.
            // They configure the Styles drop-down list and widgets to use classes.

            stylesSet: [{
                    name: 'Narrow image',
                    type: 'widget',
                    widget: 'image',
                    attributes: {
                        'class': 'image-narrow'
                    }
                },
                {
                    name: 'Wide image',
                    type: 'widget',
                    widget: 'image',
                    attributes: {
                        'class': 'image-wide'
                    }
                }
            ],

            // Load the default contents.css file plus customizations for this sample.
            contentsCss: [
                'http://cdn.ckeditor.com/4.14.0/full-all/contents.css',
                'assets/css/widgetstyles.css'
            ],

            // Configure the Enhanced Image plugin to use classes instead of styles and to disable the
            // resizer (because image size is controlled by widget styles or the image takes maximum
            // 100% of the editor width).
            image2_alignClasses: ['image-align-left', 'image-align-center', 'image-align-right'],
            image2_disableResizer: true
        });

</script>
{% endblock %}