EDIT: After I wrote this I found a new video player that will play flv, wnv, and youtube videos.
I’ve been working on our Omniture integration for a while now and recently I started working on the task of tracking our videos. I know that Omniture has some very nice features you can use with Action Source code, but what if all you have access to is the end result of the flv file? With no tools to edit a player, or the ability to embed the code in the files/players? It’s a bit of a challenge to say the least.
I needed a way to track flv files with the same amount of details that the Action Source would provide in a reliable, easy to duplicate fashion. My search for this led me to an FLV player called FlowPlayer. It is a nice easy to implement player with easy access to the API and the events.
Download the player and move the swf and js files to the directories of your choice. When you initialize the player, you simply add a script for the events you want to track to the page.
<script src="/includes/mediaPlayers/flowplayer/flowplayer-3.1.1.js"></script> <cfoutput> <a href="#variables.mediaFilePath#" style="display:block;width:500px;height:440px;" id="player"> </a> </cfoutput> <script language="JavaScript"> flowplayer("player", "/includes/mediaPlayers/flowplayer/flowplayer-3.1.1.swf"); </script> <cfoutput> <script> $f("player", "/includes/mediaPlayers/flowplayer/flowplayer-3.1.1.swf", { clip: { // track start event for this clip onStart: function(clip) { //alert("Start " + clip.fullDuration); omniInitMediaTracking('#variables.mediaFileName#',clip.fullDuration,'#variables.playerName#'); }, // track pause event for this clip. time (in seconds) is also tracked onPause: function(clip) { // alert("Pause " + parseInt(this.getTime())); omniMediaTrackingStop('#variables.mediaFileName#',parseInt(this.getTime())); }, //track Resume of player onResume: function(clip) { //alert("Resume"); omniMediaTrackingResume('#variables.mediaFileName#',parseInt(this.getTime())); }, // track stop event for this clip. time is also tracked onStop: function(clip) { // alert("Stop " + clip.url); omniMediaTrackingStop('#variables.mediaFileName#',parseInt(this.getTime())); }, // track finish event for this clip onFinish: function(clip) { //alert("Done"); omniMediaTrackingDone('#variables.mediaFileName#'); }, // track FF or REV onSeek: function(clip) { //alert("Skipped to: " + parseInt(this.getTime())); omniMediaTrackingResume('#variables.mediaFileName#',parseInt(this.getTime())); } }, // show stop button so we can see stop events too plugins: { controls: { stop: true } } }); </script> </cfoutput>
Then make sure you have the following functions set up in your Omniture code. This assumes that you have the media tracking module in your s_code.js file.
function omniInitMediaTracking(mediaName,mediaLength,playerName) { s.Media.autoTrack=false; s.Media.trackWhilePlaying=true; s.Media.trackMilestones="25,50,75,100"; s.Media.open(mediaName,mediaLength,playerName); s.Media.play(mediaName,0); } function omniInitMediaAutoTracking(mediaName,mediaLength,playerName) { s.Media.autoTrack=true; s.Media.trackWhilePlaying=true; s.Media.trackMilestones="25,50,75,100"; s.Media.open(mediaName,mediaLength,playerName); s.Media.play(mediaName,0); } function omniMediaTrackingStop(mediaName,mediaPosition) { s.Media.stop(mediaName,mediaPosition); s.t(); } function omniMediaTrackingResume(mediaName,mediaPosition) { s.Media.play(mediaName,mediaPosition); s.t(); } function omniMediaTrackingDone(mediaName) { s.Media.stop(mediaName,mediaPosition); s.Media.close(mediaName); s.t(); }
The code I used is based on a ColdFusion 8 server, with jQuery installed. Both of which play very nice with this integration. This has been working great for us with all browsers/os.
This won’t help you with wmv files but if you can control the format of the video files you can work with, this might be an easy solution to use. More information about the FlowPlayer API can be found here.
-Rudi
6 thoughts on “Track Your FLV Video Files With Omniture & FlowPlayer”
That is great! Thanks for sharing
Hi rudi, thanks for sharing this script. I’m using Flow player and Catalyst and need something like your solution. I will test it ASAP.
Laurent
Hi, have you encountered a problem where flowplayer is not returning or doesn’t display the fullduration of the clip therefore you’ll not able to seek video or see the ‘Play video again’? The video is in flv format and it’s being streamed from limelight networks (CDN). Please help
Thanks! I’ve also added the “onBeforeSeek” and called the omniture stop function there.
Does this work? I am having issues with this tracking code. Thanks.
It worked in the past, but I’ve not tested this in some time. What’s the url you are working on?