93 lines
2.9 KiB
HTML
93 lines
2.9 KiB
HTML
{% extends 'participant_index.html' %}
|
|
{% block content %}
|
|
<link rel=stylesheet type=text/css href="{{ url_for('static', filename='style.css') }}">
|
|
<div id="main-div" class="outer">
|
|
<div id="overlay">
|
|
<span id="overlay_crosshair">✚</span>
|
|
</div>
|
|
<div id="instructions">
|
|
<div class="card">
|
|
<div class="card-body">
|
|
<h2>Instructions</h2>
|
|
<p>
|
|
In this test, you will be presented with repeated click sounds.
|
|
Simply listen to the stimulus, you do not need to respond.
|
|
</p>
|
|
<button type="button" href="#" id="instr_continue" class="Btn Btn-primary">Continue</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
$(document).ready(function(){
|
|
jQuery.expr[':'].contains = function(a, i, m) {
|
|
return jQuery(a).text().toUpperCase()
|
|
.indexOf(m[3].toUpperCase()) >= 0;
|
|
};
|
|
// Initialise socketio with a namespace called "main"
|
|
var socket = io.connect(location.protocol + '//' + document.domain + ':' + location.port + '/main');
|
|
var loading = true;
|
|
var part_ready = false;
|
|
waitingDialog.show('Loading... Please wait');
|
|
|
|
function displayInstructions() {
|
|
$("#instructions").css("display", "table-cell");
|
|
$("#instructions").fadeIn();
|
|
waitingDialog.hide();
|
|
}
|
|
|
|
function hideInstructions() {
|
|
$("#instructions").css("display", "none");
|
|
$("#instructions").fadeOut();
|
|
if(loading) {
|
|
waitingDialog.show('Loading... Please wait');
|
|
}
|
|
}
|
|
|
|
|
|
$('#instr_continue').click(function(event) {
|
|
hideInstructions();
|
|
part_ready = true;
|
|
socket.emit("part_ready")
|
|
on()
|
|
});
|
|
|
|
socket.on('display_instructions', function(msg) {
|
|
displayInstructions();
|
|
});
|
|
|
|
socket.on('test_ready', function(msg) {
|
|
loading = false;
|
|
waitingDialog.hide();
|
|
});
|
|
|
|
socket.on('click_test_stim_playing', function(msg) {
|
|
on()
|
|
});
|
|
|
|
socket.on('click_test_stim_done', function(msg) {
|
|
off()
|
|
});
|
|
|
|
function on() {
|
|
$("#overlay").css("display", "table-cell");
|
|
$("#overlay_crosshair").css("display", "inline");
|
|
$("#overlay").fadeIn();
|
|
$("#overlay_crosshair").fadeIn();
|
|
}
|
|
|
|
function off() {
|
|
$("#overlay").fadeOut();
|
|
}
|
|
|
|
socket.on('processing-complete', function(msg) {
|
|
// Re-enable all inputs
|
|
$('#main-div').find('input, textarea, button, select').removeAttr('disabled');
|
|
alert("Click stimulus processing complete!")
|
|
window.location.href = '/click/complete';
|
|
});
|
|
});
|
|
</script>
|
|
{% endblock %}
|