I created a custom timer using JS that goes across all the pages of questions in the block. Participants see the timer as they answer questions on all 9 pages and then after 5 min, they are automatically advanced to the next block. I have the code below on Page 1 and each subsequent page has only a "display if timeRemaining greater than 0." My issue is that since the timer code is only on the first page, if participants (for whatever reason) refresh the page on pages 2 to 9, the timer will disappear and they will not be autoadvanced in my survey. They are trapped in on that page. What can I do to make sure if they refresh on pages 2 to 9 that the timer will reappear, keep counting and auto-advance them once 5 minutes is up?
This is my code for the first page
Qualtrics.SurveyEngine.addOnload(function()
{
var header = document.createElement("div");
header.className = "header"
header.id = "header_1";
var timer = document.createElement("div");
timer.className = "timer";
timer.id = "timer_1";
timer.innerHTML = "Time Remaining: 03:00";
header.appendChild(timer);
document.body.insertBefore(header, document.body.firstChild);
function startTimer(duration, display) {
var timer = duration, minutes, seconds;
var myTimer = setInterval(function() {
minutes = parseInt(timer / 60, 10)
seconds = parseInt(timer % 60, 10);
minutes = minutes < 10 ? "0" + minutes : minutes;
seconds = seconds < 10 ? "0" + seconds : seconds;
var text = ('innerText' in display)? 'innerText' : 'textContent';
display[text] = minutes + ":" + seconds;
Qualtrics.SurveyEngine.setEmbeddedData('timeRemaining', timer);
if (--timer < 0) {
clearInterval(myTimer);
timeOver();
}
}, 1000);
}
var timerSeconds = 180,
display = document.querySelector('#time');
startTimer(timerSeconds, display);
var timeOver = function() {
$('NextButton').click();
document.getElementById("timer_1").innerHTML = "";
x = 1;
var bgColor = setInterval(change, 1000);
}
});
Qualtrics.SurveyEngine.addOnReady(function()
{
});
Qualtrics.SurveyEngine.addOnUnload(function()
{
/*Place your JavaScript here to run when the page is unloaded*/
});