Forum Discussion
Elapsed Time when the user is active on the page - help with Javascript code
Hello appreciate your help on this matter~
While storyline has built in variables to document project time & slide time, to my knowledge if you want to collect the elapsed active time, as not on another browser tab or another window, you need to use Javascript.
I have attempted this with no results in two ways (see attached storyline files)
Attempt #1: Visibility
Use document.hidden to detect when the user is inactive (e.g., switches to a different tab).
Attempt #2: Set Interval Method
Use "start," "stop," and "reset" function when the page is active. Adjust from this source.
Note: on the file below I just created it for the first slide but I would replicate it for the rest.
Instead of pasting all the code I have it in the files below. Any suggestions on how to accomplish this goal of recording the total course time and the time on each of the slides (but pausing the timer when they aren't on the actual page)?
The closest I can ever get:
activeTime: Start when the timeline starts on the first slide. Can be inherited to other slides. Relatively easy.
slideActiveTime: Same code as above. Triggered by "variable slideChanged is True". Set it True when timeline starts on every slide. Then it will reset to 0 when you change slides.
This is where my problem begins: Ideally, say, if I spent 10 seconds on the first slide, when I go back later, it should resume counting from 10, but the way I coded won't allow so. Even with use localStorage().
- edit: maybe 1) adding the event listener to the specific slide element rather than the entire window 2) Then adding scripts to every slide to listen corresponding elements will be able to do that. That is beyond my availability to check.
