Add GA event for split column mode

This commit is contained in:
MattIPv4 2020-07-13 18:02:10 +01:00
parent b9dd381d62
commit 8181a4def1
1 changed files with 24 additions and 2 deletions

View File

@ -33,10 +33,10 @@ THE SOFTWARE.
<template v-slot:header> <template v-slot:header>
</template> </template>
<template v-slot:buttons> <template v-slot:buttons>
<a v-if="splitColumn" class="button is-primary is-outline is-hidden-touch" @click="splitColumn = false"> <a v-if="splitColumn" class="button is-primary is-outline is-hidden-touch" @click="splitColumnToggle">
{{ i18n.templates.app.singleColumnMode }} {{ i18n.templates.app.singleColumnMode }}
</a> </a>
<a v-else class="button is-primary is-hidden-touch" @click="splitColumn = true"> <a v-else class="button is-primary is-hidden-touch" @click="splitColumnToggle">
{{ i18n.templates.app.splitColumnMode }} {{ i18n.templates.app.splitColumnMode }}
</a> </a>
</template> </template>
@ -161,6 +161,9 @@ THE SOFTWARE.
// The config file watcher will handle setting the app as ready // The config file watcher will handle setting the app as ready
const query = window.location.search || window.location.hash.slice(1); const query = window.location.search || window.location.hash.slice(1);
importData(query, this.$data.domains, this.$data.global, this.$nextTick); importData(query, this.$data.domains, this.$data.global, this.$nextTick);
// Send an initial GA event for column mode
this.splitColumnEvent(false);
}, },
methods: { methods: {
changes(index) { changes(index) {
@ -229,6 +232,25 @@ THE SOFTWARE.
}); });
this.$nextTick(() => this.$data.confWatcherWaiting = false); this.$nextTick(() => this.$data.confWatcherWaiting = false);
}, },
splitColumnToggle() {
this.$data.splitColumn = !this.$data.splitColumn;
this.splitColumnEvent(true);
},
splitColumnEvent(interact) {
if (window.ga) {
const tracker = window.ga.getAll()[0];
if (tracker) {
tracker.send({
hitType: 'event',
eventCategory: 'Button',
eventAction: 'toggle',
eventLabel: 'Split Column',
eventValue: Number(this.$data.splitColumn),
nonInteraction: !interact,
});
}
}
},
}, },
}; };
</script> </script>