{% extends 'student/base.html.twig' %}
{% block title %}Evaluations{% endblock %}
{% block stylesheets %}
{{ parent() }}
<link href="{{ asset('libraries/css/questions.css?v=25') }}" rel="stylesheet" type="text/css">
{% endblock %}
{% block body %}
<div class="row">
<div class='col-sm-12'>
<h2>PRAXIS SCHOOL</h2>
</div>
<div class='col-sm-12'>
<h5> Hola {{ myStudent.names }} {{ myStudent.lastname }} </h5>
</div>
</div>
{#incluir el contenido de las preguntas#}
<div class="row">
<div id="content-questions" class='col-sm-12'></div>
</div>
{% endblock body %}
{% block add2body %}
<div id="testTempo">00:00:00</div>
<div id="preloaderView">
<div style="position: absolute; top: 18%; left: 0; width: 100%; text-align: center; ">
<img src="/libraries/images/logo-1.png" style="">
</div>
<div class="spinner-border text-primary" style="position: fixed; top: 40%; left: 48%;"></div>
<div id="message" class="center" style="position: absolute; top: 55%; width: 100%;">Loading questions...</div>
</div>
<div id="instructionsEvaluation" class="modal" tabindex="-1" role="dialog" data-backdrop="static" data-keyboard="false">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="center modal-title wdFull">Instrucciones del examen</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
{% set lang = 'Inglés' %}
{% if myModule.level.course.abreviature == 'EN' %}
<p class="center" style="font-size: 1.2rem;">
This test is intended to evaluate the Four skills of the English language: Reading, Writing, Listening and Speaking.
<br>This test will last <span class="popup-time bold"></span> minutes
</p>
{% elseif myModule.level.course.abreviature == 'FR' %}
{% set lang = 'Francés' %}
<p class="center" style="font-size: 1.2rem;">
Ce test est destiné à évaluer les quatre compétences de la langue Française: lecture, écriture, écoute et expression orale.
<br>Cette épreuve durera <span class="popup-time bold"></span> minutes
</p>
{% endif %}
<p class="center" style="font-size: 0.9rem;">
Esta prueba está destinada a evaluar las cuatro habilidades del idioma {{ lang }}: Lectura, Escritura, Comprención Auditiva y Expresión oral
<br>Esta prueba tiene una duración de <span class="popup-time bold"></span> minutos
</p>
<p class="center" style="font-size: 1rem;">
<i class="fa fa-smile-o"></i>
Good Luck / Buena suerte
</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal"><i class="fa fa-play"></i> Iniciar</button>
</div>
</div>
</div>
</div>
<div id="modalNotAvailable" class="modal" tabindex="-1" role="dialog" data-backdrop="static" data-keyboard="false">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="center modal-title wdFull">Atention</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<p class="center" style="font-size: 15pt;">No tienes acceso para realizar esta evaluación</p>
<p class="center" style="font-size: 15pt;">You do not have access to take this assessment</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal"><i class="fa fa-hand-o-right"></i> Close</button>
</div>
</div>
</div>
</div>
<div id="closeEvaluation" class="modal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="center modal-title wdFull">Sending answers</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<p class="center" style="font-size: 1.4rem;">
We have sent your answers to be validated.<br>We will notify you of the results.
</p>
<p class="center" style="font-size: 1.2rem;">
Hemos enviado tus respuestas para ser validadas.<br>Te estaremos notificando los resultados.
</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal">Aceptar</button>
</div>
</div>
</div>
</div>
{# modal para mensajes de ayuda #}
<div id="modalToHelp" class="modal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="center modal-title wdFull"> </h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<p class="center modaltext" style="font-size: 1.2rem; margin: auto 12%; width: 75%;"></p>
<p class="modalimage center"></p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal">Aceptar</button>
</div>
</div>
</div>
</div>
<div id="msntimeoff" class="hide">
<div class="row">
<div class="col-12">Restan menos de <b id="timeless">10 minutos</b> para terminar tu evaluación</div>
<div class="col-12">En caso que tu tiempo termine las respuestas se almacenarán automáticamente</div>
</div>
</div>
{% endblock add2body %}
{% block javascripts %}
{{ parent() }}
<script src="{{ asset('libraries/js/makeEvaluation.js?v=23') }}?v=1"></script>
<script src="{{ asset('libraries/audiorecorder/recorder.js') }}?v=1"></script>
<script src="{{ asset('libraries/js/jquery-ui-1.13.2.min.js') }}"></script>
<script src="{{ asset('libraries/js/jquery-ui-touch-punch.js') }}"></script>
<script>
var moduleId = {{ myModule.id }};
var studentId = {{ myStudent.id }};
var hasSaved = false;
document.onreadystatechange = function () {
var state = document.readyState
if (state == 'complete') {
setTimeout(function(){
$('#preloaderView').animate({opacity: 0}, 1000, function () {
$('#preloaderView').hide();
$('#preloaderView').css({opacity: 1});
});
}, 2000);
}
};
$(document).ready(function () {
console.log('reading evaluation...');
if('{{ isAvailable }}' == 1) {
let template1 = '{{ myModule.evaluationTemplate }}';
let template2 = '{{ myModule.evaluationTemplate2 }}';
let attemps = '{{ attemps }}';
let template = template1;
if(template2 && (attemps % 2) != 0) {
template = template2 ;
}
myEvaluation.loadtemplate(template + '&x=12');
}
myEvaluation.startTest('{{ isAvailable }}');
myEvaluation.redirectHomePage();
$(document).on('keyup', 'textarea', function() {
let txt = $(this).val().trim();
let arrTxt = txt.split(/\r?\n?\s/);
let size = 0;
arrTxt.forEach(function(i, o) {
if(i.length > 0) {
size++;
}
});
$(this).closest('div').find('span.textarea-words').text(size + '');
});
/* PLAY AUDIO INSTRUCTIONS */
$(document).on('click', 'i.examplayauido', function() {
let iconplay = $(this);
let playPause = $(this).data('playing');
let parent = $(this).closest('div');
let myAudio = $(parent).find("audio")[0];
if(playPause == 0){
$(this).data('playing', '1');
myAudio.play();
$(this).css('opacity', "0.6");
}else{
$(this).data('playing', '0');
myAudio.pause();
$(this).css('opacity', "1");
}
myAudio.addEventListener("ended", function(){
myAudio.currentTime = 0;
$(iconplay).css('opacity', "1");
$(iconplay).data('playing', '0');
console.log("ended");
});
});
$(document).on('click', 'i.backwardaudio', function() {
let parent = $(this).closest('div');
let myAudio = $(parent).find("audio")[0];
myAudio.pause();
myAudio.currentTime -= 10;
setTimeout(function(){myAudio.play();}, 500);
});
// al seleccionar una imagen se activa y se marca como respuesta
$(document).on('click', '.cont-answ-img', function() {
let answerSelected = $(this).data('choosen');
$(this).closest('div.row').find('div.active').removeClass('active');
$(this).closest('div.contentAudioQ').find('div.answers > input').val(answerSelected);
$(this).addClass('active');
});
$(document).on('click', '#send-anwers', function() {
hasSaved = true;
});
$(document).on('click', '.btnHelp', function() {
let text = $(this).data('text');
let image = $(this).data('image');
let imgtag = `<img src="/libraries/images/${image}" class="imghelp">`;
$('#modalToHelp').find('.modaltext').html(text);
$('#modalToHelp').find('.modalimage').html(imgtag);
$('#modalToHelp').modal('show');
});
});
/*
* evitar cerrar la pagina por accidente
* @returns {Boolean}
*/
$(window).bind("beforeunload", function(event) {
if(!hasSaved) {
return "You have unsaved changes";
}
});
/* Evitar el click derecho sobre la pagina */
$(document).bind("contextmenu", function(e) {
return false;
});
</script>
{% endblock javascripts %}