Merge ~ya-bo-ng/maas:replace-ga-with-gtm into maas:master

[Anthony Dillon]

Replace GA script with GTM

Replacing the Google Analytics snippet with the Google Tag Manager snippet. Allowing us to enable Usabilla and GA remotely.

[MAAS Lander (maas-lander)]

UNIT TESTS
-b replace-ga-with-gtm lp:~ya-bo-ng/maas/+git/maas into -b master lp:~maas-committers/maas

STATUS: SUCCESS
COMMIT: ac594f661166b4b730549bf77f45f83b818c2591

review: Approve

[Blake Rouse (blake-rouse)]

Your missing the removal of the analytics in main.js.

review: Needs Fixing

e6efea4... by Anthony Dillon on 2018-09-06

Remove the GA function from main.js

[Anthony Dillon (ya-bo-ng)]

Thanks Blake, removed the function. Ready for review again.

[MAAS Lander (maas-lander)]

UNIT TESTS
-b replace-ga-with-gtm lp:~ya-bo-ng/maas/+git/maas into -b master lp:~maas-committers/maas

STATUS: SUCCESS
COMMIT: e6efea4fe342fd32e58cbf26eeaed88e34f02d82

review: Approve

[Blake Rouse (blake-rouse)]

This issue is now you will not get new page views. The code you removed updated the current page even in a SPA, which MAAS mostly is (only some settings pages are not).

The reason this was linked to angular code is because of this:

$rootScope.$on('$routeChangeSuccess', function() {});

This is called when the HTML5 route is changed, something that you are completely losing with your change.

review: Needs Fixing

424823d... by Anthony Dillon on 2018-09-10

Add back the state change GA event function

[MAAS Lander (maas-lander)]

UNIT TESTS
-b replace-ga-with-gtm lp:~ya-bo-ng/maas/+git/maas into -b master lp:~maas-committers/maas

STATUS: SUCCESS
COMMIT: 424823d96947f8e226f05de348b99d448eab8841

review: Approve

[Anthony Dillon (ya-bo-ng)]

Blake, can you have a look at this again. I have checked and the current event push still works with GTM.

[Blake Rouse (blake-rouse)]

Okay, if it works with the existing angular code then cool.

review: Approve

diff --git a/src/maasserver/templates/maasserver/base.html b/src/maasserver/templates/maasserver/base.html
index fc65508..5ab7aaf 100644
--- a/src/maasserver/templates/maasserver/base.html
+++ b/src/maasserver/templates/maasserver/base.html
@@ -14,6 +14,14 @@
     <base href="{% url 'index' %}">
     <title>{% block title %}{% endblock %} | {% include "maasserver/site_title.html" %}</title>
 
+    {% if global_options.enable_analytics %}
+    <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
+    new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
+    j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
+    'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
+    })(window,document,'script','dataLayer','GTM-P4TGJR9');</script>
+    {% endif %}
+
     <link rel="shortcut icon" href="{{ STATIC_URL }}assets/images/icons/maas-favicon-32px.png">
 
     <!-- stylesheets -->
diff --git a/src/maasserver/templates/maasserver/index.html b/src/maasserver/templates/maasserver/index.html
index ff2b1ae..804f3bf 100644
--- a/src/maasserver/templates/maasserver/index.html
+++ b/src/maasserver/templates/maasserver/index.html
@@ -14,6 +14,14 @@
     <base href="{% url 'index' %}">
     <title data-ng-bind="title + ' | ' + site + ' MAAS'"></title>
 
+    {% if global_options.enable_analytics %}
+    <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
+    new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
+    j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
+    'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
+    })(window,document,'script','dataLayer','GTM-P4TGJR9');</script>
+    {% endif %}
+
     <link rel="shortcut icon" href="{{ STATIC_URL }}assets/images/icons/maas-favicon-32px.png">
 
     {% include "maasserver/css-conf.html" %}
diff --git a/src/maasserver/templates/maasserver/js-conf.html b/src/maasserver/templates/maasserver/js-conf.html
index c3ec0d6..353e7d8 100644
--- a/src/maasserver/templates/maasserver/js-conf.html
+++ b/src/maasserver/templates/maasserver/js-conf.html
@@ -36,7 +36,3 @@ var MAAS_config = {
 <script type="text/javascript"
         src="{{STATIC_URL}}/js/bundle/maas-min.js?v={{files_version}}">
 </script>
-
-{% if global_options.enable_analytics %}
-<script async src='https://www.google-analytics.com/analytics.js'></script>
-{% endif %}