Adding Google Analytics to Adobe Air HTML/Javascript App

Question

I am attempting to add google analytics tracking to an Adobe Air app created with HTML and javascript.

I have tried adding the ga.js file and using it like I would in a webpage:

<script type="text/javascript" src="lib/js/ga.js"></script>
<script type="text/javascript">
   var pageTracker = _gat._getTracker("UA-********-1");
   pageTracker._initData();
   pageTracker._trackPageview('/test');
</script>

But this doesn't seem to register anything on the analytics dashboard.

Have also tried using the GA for flash actionscript library but I can't seem to create an instance of the GATracker as it needs a DisplayObject?

EDIT

using the information from grapefrukt I tried the following:

air.Sprite = window.runtime.flash.display.Sprite;
air.GATracker = window.runtime.com.google.analytics.GATracker;

var tracker = new air.GATracker( new air.Sprite(), "UA-XXXXXXX-X", "AS3", false );

but I get the following error: TypeError: Error #1009: Cannot access a property or method of a null object reference

Answer 1

NOTE: I originally misread your question to be about how to use gaforflash , but I'll post this anyway since I've already typed it up and it might be of some use.

You can the constructor whatever DisplayObject you like, normally you'd use your document class, but anything will work. As far as I can understand it's only really used for displaying debug info.

var tracker:AnalyticsTracker = new GATracker( new Sprite, "UA-XXXXXXX-X", TrackerMode.AS3, false );

Setting the TrackerMode to AS3 let's the flash communicate directly with the tracking servers, so you don't need the javascript from google's servers.

I can't help you with the communication between js/as3, but that should be fairly easy.

Answer 2

Probably not useful to the OP, but just spent the whole day working around this so hopefully my solution will save someone else that time.

So the reason the ga.js code can't be used directly from an AIR app written in javascript is that AIR won't set the cookie for pages that are stored within the application itself. To work around this, I downloaded ga.js to the application and modified it so that it doesn't rely on the document.cookie function.

In the application, I have:

<script type="text/javascript">
  var cookies = {};
  document.__defineSetter__('_cookie', function(c) {
      var epos = c.indexOf('=');
      var spos = c.indexOf(';', Math.max(0, epos));
      if (epos == -1 || spos == -1) { return; }
      var name = c.substring(0, epos);
      var value = c.substring(epos + 1, spos);
      cookies[name] = value;
  });
  document.__defineGetter__('_cookie', function() {
      var a = [];
      for (var name in cookies) {
          a.push(name + '=' + cookies[name]);
      }
      return a.join('; ');
  });

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-XXXXXX-1']);
  _gaq.push(['_trackPageview', path])
  (function() {
      var ga = document.createElement('script');
      ga.type = 'text/javascript';
      ga.async = true;
      // custom GA code which uses document._cookie instead of
      // document.cookie
      ga.src = 'js/ga.js';
      var s = document.getElementsByTagName('script')[0];
      s.parentNode.insertBefore(ga, s);
  })();
</script>

Ideally, we'd be able to override the cookie method, but unfortunately, it doesn't seem possible in webkit as implemented for AIR. So in ga.js, I replaced all instances of J.cookie with J._cookie. Once that's done, ga.js should believe that it's writing cookies and function normally.

In the interest of full disclosure, I actually access the above analytics code through an iframe, but since ga.js is being served locally, I suspect it's no longer necessary and didn't want to complicate the solution by adding the bridge logic.