Have an idea?

Visit Sawtooth Software Feedback to share your ideas on how we can improve our products.

How to add a timer

My client is looking to capture the time the viewer views each page of the flip book.  Can  you give me some suggestions on how to incorporate code to get this done.

Thank you in advance
related to an answer for: Flip Book using HTML5 & Javascript
asked May 21, 2018 by anonymous

1 Answer

+1 vote
I cannot give you complete code without having the flip book code myself, but here is what I can determine of the steps you will need to follow:

Add a free format question to the survey page with the flip book.  The question needs one variable for each page of the flip book.  The HTML for the variables can look something like this:

<input type="hidden" name="[% QuestionName() %]_Page1Time" id="[% QuestionName() %]_Page1Time"/>
<input type="hidden" name="[% QuestionName() %]_Page2Time" id="[% QuestionName() %]_Page2Time"/>
<input type="hidden" name="[% QuestionName() %]_Page3Time" id="[% QuestionName() %]_Page3Time"/>


In the JavaScript that sets up the flip book, add two new variables:

var currentPage = 1;
var startPageTime = new Date() / 1000;


The flip book appears to have a "turned" event that triggers whenever the respondent changes pages.  In this event, you need to: (a) read in the current time, (b) subtract the startPageTime from the current time, (c) set the hidden free format variable relating to currentPage to that subtracted time, and (d) set startPageTime to the current time.  It may look something like this:

turned: function(e, page) {
    var currentTime = new Date() / 1000;
    var timeDiff = currentTime - startPageTime;
    var totalOld = Number($('#[% QuestionName() %]_Page' + currentPage + 'Time').val());
    var totalNew = totalOld + timeDiff;
    $('#[% QuestionName() %]_Page' + currentPage + 'Time').val(totalNew);

    currentPage = page;
    startPageTime = currentTime;
}


Finally, this code will need to exist in the custom JavaScript verification as well as the "turned" event in order to record the time spent on the last page the respondent viewed before submitting the page.
answered May 21, 2018 by Zachary Platinum Sawtooth Software, Inc. (117,475 points)
...