I recently had a client with a Drupal site who wanted to be able to track whether or not his site members were watching videos on his site completely, and also wanted to know at what point site members were leaving the videos. The client currently uses SiteCatalyst for analytics, and is using the JW Media Player. After a lot of research, I came across this blog post, which gave some terrific insight regarding how to connect events in the JW Media Player to Omniture. However, the code samples did not apply to SiteCatalyst. The author of the blog post suggested using the s.tl() function in the SiteCatalyst code to track events. After a lot more research, I finally came up with a solution that tracks when users play a video, pause a video, watch a video until the end, and if the user navigates away from the video before it has completed. The current time of the video is also tracked for each of these events. Using this methodology, one could easily extend the tracking to include other events such as seek and playlist events. My code is below.
// Detect if the user navigates away from the video
window.onbeforeunload = confirmExit;
var currentPosition = 0;
var currentVolume = 0;
var currentMute = false;
var currentState = "NONE";
var defaultState = "NONE";
var clipduration = 0;
var player = null;
var s = null;
function playerReady() {
player = document.getElementById('swfobject-1');
addListeners(player);
}
function addListeners(player) {
if (player) {
addAllModelListeners(player);
}
else {
setTimeout("addListeners("+player+")",100);
}
}
function addAllModelListeners(player) {
if (typeof player.addModelListener == "function") {
player.addModelListener("BUFFER", "doNothing");
player.addModelListener("ERROR", "doNothing");
player.addModelListener("LOADED", "doNothing");
player.addModelListener("META", "doNothing");
player.addModelListener("STATE", "stateListener");
player.addModelListener("TIME", "positionListener");
}
}
function doNothing(obj) {
//nothing
}
function positionListener(obj) {
currentPosition = obj.position;
clipduration = obj.duration;
}
function stateListener(obj) {
s = s_gi('sitecatalyst_id');
currentState = obj.newstate;
switch(obj.newstate) {
case 'PLAYING':
s.linkTrackVars="prop1,eVar1,events";
s.linkTrackEvents="video_play";
s.prop1=secondsToMinutes(currentPosition);
s.eVar1=secondsToMinutes(currentPosition);
s.events="video_play";
s.tl(this,'o','Play Video');
break;
case 'PAUSED':
s.linkTrackVars="prop1,eVar1,events";
s.linkTrackEvents="video_pause";
s.prop1=secondsToMinutes(currentPosition);
s.eVar1=secondsToMinutes(currentPosition);
s.events="video_pause";
s.tl(this,'o','Pause Video');
break;
case 'COMPLETED':
s.linkTrackVars="prop1,eVar1,events";
s.linkTrackEvents="video_complete";
s.events="video_complete";
s.tl(this,'o','Video Complete');
break;
}
}
function confirmExit() {
if(currentState != 'COMPLETED') {
s.linkTrackVars="prop1,eVar1,events";
s.linkTrackEvents="video_leave";
s.prop1=secondsToMinutes(currentPosition);
s.eVar1=secondsToMinutes(currentPosition);
s.events="video_leave";
s.tl(this,'o','Leave Video');
currentState = '';
}
}
// Helper function to convert seconds to mm:ss format
function secondsToMinutes(seconds) {
// Parse the minutes
minVar = parseInt(Math.floor(seconds/60));
minVar = minVar <10 ? '0' + minVar : minVar;
// Parse the seconds
secVar = parseInt(seconds % 60);
// The balance of seconds
secVar = secVar <10 ? '0' + secVar : secVar;
return minVar + ':' + secVar;
}
Resources:
Does it work on any website or just in Drupal?
Submitted by Anonymous on Mon, 01/03/2011 - 05:38.Hello Erich,
Happy New Year!!!
Thanks for posting this out there.
I wanted to know if this code can be used for a jwplayerlist implementation for videos on a website that is NOT IN DRUPAL.
Also , where would the stats be stored and would they be captured if a user just switches between different vidoes on a playlist as well as links in other locations on the same webpage? Thanks