How to do mobile analytics using Jquery mobile

Question

I am looking for a good solution to do mobile analytics for Jquery mobile . I did check this question

Flurry Analytics vs Google Analytics on the mobile platform

but these are all solutions for a platform specific/ phone manufacturer specific but jquery mobile works on all platforms irrespective of the manufacturer or operating system. Essentially i am looking for a analytics solution for webapps.

Additional Info:- bango seems expensive at $49/month. Admob wont work since we dont need it for advertising and not for placing ads.

Answer 1

I'm using the following:

<script>
    var _gaq = _gaq || [];
    _gaq.push(['_setAccount', 'UA-xxxxxx-xx']);

    (function() {
      var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
      ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
      var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
    })();

$('[data-role=page]').live('pageshow', function (event, ui) {
    try {

        hash = location.hash;

        if (hash && hash.length > 1) {
            _gaq.push(['_trackPageview', hash.substr(1)]);
        } else {
            _gaq.push(['_trackPageview']);
        }
    } catch(err) {

    }

});
</script>

The 'pageshow' event fires even for the first page, so don't think you want to include the _trackPageview with the GA setup. Also, location.hash will return url with the "#" character so hash.subtr(1) cleans that off which will normalize hash/pushstate visitors.

Update 11/30/11: Added check for hash length for ie bug (from: Paulo Manuel Santos).

Answer 2

I use the following bits of code for Google Analytics and it works well:

The following is pretty much the normal Google Analytics setup:

var _gaq = _gaq || [];
_gaq.push(['_setAccount', '**-*****-**']);

(function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();

The update for jQuery Mobile is here so that each pseudo-page is logged:

$(document).delegate('[data-role=page]', 'pageshow', function (event, ui) {
    var url = location.href;
    try  {
        if (location.hash) {
            url = location.hash;
        }
        _gaq.push(['_trackPageview', url]);
    } 
    catch(error) {
        // error catch
    }
});