I’ve been working on a Flash widget, and the majority of the sites it will be hosted on use WebTrends for analytics. I recently had to look into capturing certain interaction events from the Flash movie and passing them through to WebTrends for reporting.
Flash events are tracked as fake page impressions in WebTrends based on unique URLs that you define. The flash movie doesn’t talk to WebTrends directly – it calls through to javascript on the host page which logs the event via standard WebTrends javascript.
In my case I’m working on a widget that could be hosted on a variety of pages that may or may not implement WebTrends. The required behaviour is for tracking to automatically kick in if the host page implements WebTrends, but gracefully degrade if not. I have a javascript file that handles interaction with the flash movie, so I can guarantee certain js functions exist on the host page.
The solution looks like so…
Add an ActionScript class to pass events through to host page
package {
import flash.external.ExternalInterface;
public class Analytics {
public static const WIDGET_LOADED:String = "/Video/Widget/WidgetLoaded";
public static const PLAYER_LAUNCHED:String = "/Video/Widget/PlayerLaunched";
public function Analytics(): void {
}
public static function captureEvent(eventType:String) {
if (ExternalInterface.available) {
ExternalInterface.call("mycompany.video.captureAnalyticsEvent", eventType);
}
}
}
}
An example of passing an event to this class…
Analytics.captureEvent(Analytics.WIDGET_LOADED);
Implement javascript functions on the host page
/* set up namespace for new functions */
if (window["mycompany"] == null) {
window["mycompany"] = {};
}
mycompany.video = {
webtrendsTrackingFunction: {},
captureAnalyticsEvent: function(eventType) {
var uriParam = 'DCS.dcsuri';
if (typeof (this.webtrendsTrackingFunction) == 'function') {
// if user has nominated a specific tracking function
this.webtrendsTrackingFunction(uriParam, eventType);
} else if (window["dcsMultiTrack"] != null) {
// if dcsMultiTrack already implemented on page
window.dcsMultiTrack(uriParam, eventType);
} else if (window["dcsTag"] != null) {
// otherwise if webtrends implemented on page, use default implementation
mycompany.video.analytics.dcsMultiTrack(uriParam, eventType);
}
}
}
mycompany.video.analytics = {
dcsMultiTrack: function() {
for (var i = 0; i < arguments.length; i++) {
if (arguments[i].indexOf('WT.') == 0) {
WT[arguments[i].substring(3)] = arguments[i + 1]; i++;
}
if (arguments[i].indexOf('DCS.') == 0) {
DCS[arguments[i].substring(4)] = arguments[i + 1]; i++;
}
if (arguments[i].indexOf('DCSext.') == 0) {
DCSext[arguments[i].substring(7)] = arguments[i + 1]; i++;
}
}
var dCurrent = new Date();
DCS.dcsdat = dCurrent.getTime();
dcsTag();
}
}
The key points above the script above…
- To report events from Flash, WebTrends require an additional function on the host page that they provide – dcsMultiTrack
- If the host page has implemented dcsMultiTrack already, the existing function will be used
- If the host page implements standard WT js but not the additional function, a fresh implementation of the dcsMultiTrack function will be used
- If WebTrends javascript has not been implemented on the host page, nothing bad happens
In addition, we have a standard function that the flash movie will always call, so if we need to extend functionality to cater for different analytics systems etc, then we have a single place to implement this.
This is probably the least sexy post I’ve ever written, but it seemed worthwhile to document this. I’ll follow up with some sexified content sometime soon.
