adding google analytics v4

LBALab · Jul 29, 2023 · bf847a7 · bf847a7
1 parent 745515e
commit bf847a7
Show file tree

Hide file tree

Showing 4 changed files with 11 additions and 7 deletions.
diff --git a/devserver.js b/devserver.js
@@ -126,7 +126,8 @@ app.use('/doc', express.static('./doc'));
 app.use('/webxr-assets', express.static('./node_modules/@webxr-input-profiles/assets/dist/profiles'));
 
 const indexBody = renderToStaticMarkup(React.createElement(Main, {
-    script: 'window.ga=function(){};\nwindow.isLocalServer=true;',
+    scriptTag: '',
+    script: 'window.gtag=function(){};\nwindow.isLocalServer=true;',
     crashReportUrl: '/crash'
 }));
 

diff --git a/main.jsx b/main.jsx
@@ -1,6 +1,6 @@
 const React = require('react');
 
-module.exports = ({script, crashReportUrl}) => (<html lang="en">
+module.exports = ({scriptTag, script, crashReportUrl}) => (<html lang="en">
     <head>
         <meta charSet="UTF-8"/>
         <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"/>
@@ -12,7 +12,8 @@ module.exports = ({script, crashReportUrl}) => (<html lang="en">
         <link rel="stylesheet" href="layout.css"/>
         <title>LBA2</title>
         <script dangerouslySetInnerHTML={{__html: `window.crashReportUrl="${crashReportUrl}";`}} />
-        <script dangerouslySetInnerHTML={{__html: script || 'window.ga=function(){}'}} />
+        <script dangerouslySetInnerHTML={{__html: `const s=document.createElement('script');s.type='text/javascript';s.src='${scriptTag}';document.head.appendChild(s);` }} />
+        <script dangerouslySetInnerHTML={{__html: script || 'window.gtag=function(){}'}} />
     </head>
     <body>
         <div id="preload" className="loader">

diff --git a/src/game/SceneManager.ts b/src/game/SceneManager.ts
@@ -15,7 +15,7 @@ import {
 } from '../resources';
 
 declare global {
-    var ga: Function;
+    var gtag: Function;
 }
 
 const { initSceneDebugData } = DBG;
@@ -46,8 +46,8 @@ export class SceneManager {
         if ((!force && this.scene && index === this.scene.index) || this.game.isLoading())
             return this.scene;
 
-        ga('set', 'page', `/scene/${index}`);
-        ga('send', 'pageview');
+        gtag('set', 'page', `/scene/${index}`);
+        gtag('send', 'pageview');
 
         if (this.scene)
             this.scene.isActive = false;

diff --git a/utils/build-index.js b/utils/build-index.js
@@ -11,9 +11,11 @@ const Main = require(`../main.jsx`);
 const config = require('../.build-config.js');
 
 const analytics = config.googleAnalyticsProperty;
-const gaScript = analytics && `(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');ga('create','${analytics}','auto');ga('send','pageview');`;
+const gtagScript = analytics && `https://www.googletagmanager.com/gtag/js?id=${analytics}`;
+const gaScript = analytics && `window.dataLayer = window.dataLayer || [];function gtag(){dataLayer.push(arguments);}gtag('js', new Date());gtag('config', '${analytics}');window.ga=gtag;`;
 
 const indexBody = renderToStaticMarkup(React.createElement(Main, {
+    scriptTag: gtagScript,
     script: gaScript,
     crashReportUrl: '.netlify/functions/crash-report',
 }));