I have an HTML5 Mobile App based on JQuery Mobile. It fetches nothing from the server, is sometimes connected to the internet but also has offline mode. Does Google Analytics support offline mode? Note, I am not using the Android/iOS SDK. Just ga.js inside JQueryMobile pages. Thanks
Below is my html5 JQueryMobile code:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Mobile @ Your Library</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"> </script>
<script type="text/javascript" src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-40418-saddf']);
_gaq.push(['_gat._anonymizeIp']);
(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/u/ga_debug.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</script>
<body>
<div data-role="header" data-theme="d">
<h1>Mobile @ Your Library</h1>
<a href="#home" data-icon="home" data-iconpos="notext" data-theme="d" class="ui-btn-right">home</a>
</div><!-- /header -->
<div data-role="content">
<ul data-role="listview" data-inset="true">
<li><a href="#search">Search</a></li>
<li><a href="#hours">Hours</a></li>
<li><a href="#ask">Ask a Librarian</a></li>
<li><a href="#about">About</a></li>
<li><a href="#where" data-rel="dialog" data-transition="pop">Where</a></li>
</ul>
</div><!-- /content -->
<div data-role="footer" data-id="myfooter" data-position="fixed" data-theme="d">
<div class="controls" data-role="controlgroup" data-type="horizontal">
<a href="#home" data-role="button" data-icon="home">Home</a>
<a href="#search" data-role="button" data-icon="search">Search</a>
<a href="#ask" data-role="button" data-icon="info">Ask</a>
<a href="/index.php" rel="external" data-role="button" data-icon="plus">Full site</a>
</div>
</div><!-- /footer -->
</div><!-- /page -->
<!--
<script type="text/javascript">
$('[data-role=page]').live('pageshow', function (event, ui) {
console.log('pageshow called s');
console.log('pageshow called s2');
try {
_gaq.push( ['_trackPageview', event.target.id] );
console.log('tracked '+event.target.id);
} catch(err) {
console.log('error '+ err);
}
});
</script>-->
<script type="text/javascript">
$(document).delegate('[data-role=page]', 'pageshow', function (event, ui) {
console.log('pageshow event '+ui.prevPage.id);
var url = location.href;
console.log('pageshow url = '+url);
try {
if (location.hash) {
url = location.hash;
console.log('location.hash so now url = '+url);
}
console.log('about to push page '+url);
//_gaq.push(['_trackPageview', url]);
_gaq.push( ['_trackPageview', event.target.id] );
console.log('about to push page '+url);
}
catch(error) {
// error catch
console.log('error '+error);
}
});
</script>
</body>
</html>