Forum Discussion
xAPI for user pausing and playing video
I'm trying to capture if and when a user clicks the pause/play button in the Storyline player while watching a video using xAPI. It seems like it should be simple, but I'm struggling to find a way to...
I run this JavaScript code when the timeline starts:
let video = document.getElementsByTagName('video')[0]; video.ontimeupdate = () => setVar('isVideoPlaying', !video.paused && !video.ended);The script listens for the "ontimeupdate" event, which is triggered regularly as the video plays. Each time the event fires, it checks whether the video is currently playing, paused, or ended, and updates the variable "isVideoPlaying" accordingly.
I could have targeted the video play/pause button as well, but that wouldn't work if the video controls are hidden. This script however, will work regardless of whether the controls are visible or not. I have attached the .story file used in this example for your reference.
I would likely use JavaScript to target a video and continuously monitor whether it is playing or paused, updating a Storyline True/False variable accordingly. This approach enables Storyline to accurately track the current status of the video. Subsequently, I would create a custom xAPI statement based on changes to this True/False variable. If the video is playing (True), I would execute the following statement...
...else, run
In SCORM Cloud, your report would look similar to
Attached is a short video demonstrating this interaction in SCORM Cloud.
Thanks so much for your response! How are you capturing the user clicking the play/pause button? What is toggling the value for the isVideoPlaying variable? That's where I'm stuck. The xAPI you have here makes sense to me, but I don't know what's feeding into the isVideoPlaying variable.
I run this JavaScript code when the timeline starts:
let video = document.getElementsByTagName('video')[0]; video.ontimeupdate = () => setVar('isVideoPlaying', !video.paused && !video.ended);The script listens for the "ontimeupdate" event, which is triggered regularly as the video plays. Each time the event fires, it checks whether the video is currently playing, paused, or ended, and updates the variable "isVideoPlaying" accordingly.
I could have targeted the video play/pause button as well, but that wouldn't work if the video controls are hidden. This script however, will work regardless of whether the controls are visible or not. I have attached the .story file used in this example for your reference.
That did the trick! Thanks so much for providing the Story file!
