Fix Matomo and CI analytics plugins

This commit is contained in:
N-Pex 2025-05-12 12:39:04 +02:00
parent d4041ab9ab
commit 96ef4885d6
3 changed files with 83 additions and 92 deletions

View file

@ -20,13 +20,13 @@ export default {
switch (type) {
case "ci":
{
let engine = cleaninsights.install(Vue, engineConfig.config);
let engine = cleaninsights.install(app, engineConfig.config);
this.engines.push(engine);
}
break;
case "matomo":
{
let engine = matomo.install(Vue, engineConfig.config);
let engine = matomo.install(app, engineConfig.config);
this.engines.push(engine);
}
break;

View file

@ -1,58 +1,55 @@
import { CleanInsights, ConsentRequestUi } from 'clean-insights-sdk';
import { CleanInsights, ConsentRequestUi } from "clean-insights-sdk";
export default {
install(Vue, config) {
class RequestUi extends ConsentRequestUi {
showForCampaign(campaignId, campaign, complete) {
const period = campaign.nextTotalMeasurementPeriod
if (!period) {
return ''
}
let message = 'Help us improve!\n\n'
+ `We would like to collect anonymous usage data between ${period.start.format('LLL')} and ${period.end.format('LLL')} to improve the quality of the product.\n\nYour help would be highly appreciated.`
complete(window.confirm(message))
return ''
}
install(app, config) {
class RequestUi extends ConsentRequestUi {
showForCampaign(campaignId, campaign, complete) {
const period = campaign.nextTotalMeasurementPeriod;
if (!period) {
return "";
}
let message =
"Help us improve!\n\n" +
`We would like to collect anonymous usage data between ${period.start.format("LLL")} and ${period.end.format(
"LLL"
)} to improve the quality of the product.\n\nYour help would be highly appreciated.`;
const cleanInsightsService = new Vue({
config: config,
data() {
return {
ci: null,
campaignId: null,
requestUi: null,
}
},
created() {
if (this.$options.config) {
const config = this.$options.config;
this.ci = new CleanInsights(config);
// Get name of first campaign in the config.
this.campaignId = Object.keys(config.campaigns || { invalid: {} })[0];
}
},
methods: {
event(category, action) {
if (!this.ci) {
return;
}
if (!this.requestUi) {
this.requestUi = new RequestUi();
}
this.ci.requestConsentForCampaign(this.campaignId, this.requestUi, (granted) => {
if (!granted) {
return
}
this.ci.measureEvent(category, action, this.campaignId);
})
}
}
});
return cleanInsightsService;
complete(window.confirm(message));
return "";
}
}
}
class CleanInsightsServiceClass {
constructor() {
this.config = config;
this.ci = null;
this.campaignId = null;
this.requestUi = null;
if (config) {
this.ci = new CleanInsights(config);
// Get name of first campaign in the config.
this.campaignId = Object.keys(config.campaigns || { invalid: {} })[0];
}
}
event(category, action) {
if (!this.ci) {
return;
}
if (!this.requestUi) {
this.requestUi = new RequestUi();
}
this.ci.requestConsentForCampaign(this.campaignId, this.requestUi, (granted) => {
if (!granted) {
return;
}
this.ci.measureEvent(category, action, this.campaignId);
});
}
}
const cleanInsightsService = new CleanInsightsServiceClass();
return cleanInsightsService;
},
};

View file

@ -1,24 +1,17 @@
export default {
install(Vue, config) {
const matomoService = new Vue({
config: config,
data() {
return {
initialized: false
}
},
created() {
if (this.$options.config) {
const config = this.$options.config;
let server = config.server;
let siteId = config.siteId;
if (server && siteId) {
if (!server.endsWith("/")) {
server = server + "/";
}
let script = `
install(app, config) {
class MatomoServiceClass {
constructor() {
this.config = config;
this.initialized = false;
if (config) {
let server = config.server;
let siteId = config.siteId;
if (server && siteId) {
if (!server.endsWith("/")) {
server = server + "/";
}
let script = `
var _paq = window._paq = window._paq || [];
/* tracker methods like "setCustomDimension" should be called before "trackPageView" */
_paq.push(['trackPageView', ' ', window.location.hostname]);
@ -31,21 +24,22 @@ export default {
g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
})();
`;
var s = document.createElement('script');
s.innerHTML = script;
document.body.appendChild(s);
this.initialized = true;
}
}
},
methods: {
event(category, action) {
if (this.initialized) {
window._paq.push(['trackEvent', category, action]);
}
}
}
});
return matomoService;
var s = document.createElement("script");
s.innerHTML = script;
document.body.appendChild(s);
this.initialized = true;
}
}
}
event(category, action) {
if (this.initialized) {
window._paq.push(["trackEvent", category, action]);
}
}
}
}
const matomoService = new MatomoServiceClass();
return matomoService;
},
};