From 1754cffc3593c3040020b7f7d6c29c12949fd04e Mon Sep 17 00:00:00 2001 From: Aleksei Efremov Date: Tue, 5 Mar 2024 15:08:13 +0200 Subject: [PATCH 1/3] Tracking --- js/tracking.js | 125 ++++++++++++++++++ .../BeforeTemplateRenderedListener.php | 1 + 2 files changed, 126 insertions(+) create mode 100644 js/tracking.js diff --git a/js/tracking.js b/js/tracking.js new file mode 100644 index 0000000..342b112 --- /dev/null +++ b/js/tracking.js @@ -0,0 +1,125 @@ +window.addEventListener('load', function() { + if (typeof utag === 'undefined' || !utag.view()) return + // Plus button in a breadcrumb + let plusBtnContainer = document.querySelector('.files-controls .actions.creatable') + plusBtnContainer?.addEventListener("click", function(event) { + let menuOption = event.target.closest('[data-action]') + if (menuOption) { + utag.view({ + wt_link_id: `plus.button.${menuOption.attributes['data-action'].value}`, + page_content_id: "files.breadcrumb", + page_type: "files" + }) + } + }) + + // Table head listener + let theadContainer = document.querySelector('#app-content-files table.files-filestable thead') + theadContainer?.addEventListener("mousedown", function(event) { + if (event.target.closest('.column-selection')) { + utag.view({ + wt_link_id: "checkbox.select-all", + page_content_id: "files.tablehead", + page_type: "files" + }) + return + } + let menuOption = event.target.closest('[data-action]') + if (menuOption) { + utag.view({ + wt_link_id: `button.${menuOption.attributes['data-action'].value}`, + page_content_id: "files.tablehead", + page_type: "files" + }) + } + }) + + // Table body listener + const registerTableBodyEvent = function(event) { + if (event.target.closest('.action.action-share')) { + utag.view({ + wt_link_id: "button.shared", + page_content_id: "files.tablebody", + page_type: "files" + }) + } else if (event.target.closest('td.selection')) { + utag.view({ + wt_link_id: "checkbox.select-file", + page_content_id: "files.tablebody", + page_type: "files" + }) + } else if (event.target.closest('.fileActionsMenu.popovermenu')) { + let menuItem = event.target.closest('[data-action]') + menuItem && utag.view({ + wt_link_id: `button.${menuItem.attributes['data-action'].value}`, + page_content_id: "files.tablebody.more", + page_type: "files" + }) + } + } + + let tbodyContainer = document.querySelector('#app-content-files table.files-filestable tbody') + tbodyContainer?.addEventListener("mousedown", (event) => registerTableBodyEvent(event)) + + // Files navigation container + let navContainer = document.querySelector('#app-navigation-vue') + navContainer?.addEventListener("mousedown", function(event) { + let navigation = event.target.closest('[data-cy-files-navigation-item]') + if (navigation) { + utag.view({ + wt_link_id: `link.${navigation.attributes['data-cy-files-navigation-item'].value}`, + page_content_id: "files.sidebarnav", + page_type: "files" + }) + } + }) + + // Photos navigation container + let navMediaContainer = document.querySelector('#app-navigation-vue') + navMediaContainer?.addEventListener("mousedown", function(event) { + let navigation = event.target.closest('[data-id-app-nav-item]') + if (navigation) { + utag.view({ + wt_link_id: `link.${navigation.attributes['data-id-app-nav-item'].value}`, + page_content_id: "photos.sidebarnav", + page_type: "photos" + }) + } + }) + + // Toggle grid/list view button listener + let toggleView = document.querySelector('#view-toggle') + toggleView?.addEventListener('click', function() { + utag.view({ + wt_link_id: 'button.toggleview', + page_content_id: "files.list", + page_type: "files" + }) + }) + + // Header - navigation + let headerLeft = document.querySelector('#header .header-left') + headerLeft?.addEventListener("mousedown", function(event) { + let navigation = event.target.closest('[data-app-id]') + if (navigation) { + utag.view({ + wt_link_id: `link.${navigation.attributes['data-app-id'].value}`, + page_content_id: "header.left", + page_type: "header" + }) + } + }) + + // Header - options + let headerRight = document.querySelector('#header .header-right') + headerRight?.addEventListener("mousedown", function(event) { + let navigation = event.target.closest('[id]') + if (navigation) { + utag.view({ + wt_link_id: `link.${navigation.attributes['id'].value}`, + page_content_id: "header.right", + page_type: "header" + }) + } + }) +}) diff --git a/lib/Listener/BeforeTemplateRenderedListener.php b/lib/Listener/BeforeTemplateRenderedListener.php index cc466bc..2c81df6 100644 --- a/lib/Listener/BeforeTemplateRenderedListener.php +++ b/lib/Listener/BeforeTemplateRenderedListener.php @@ -48,5 +48,6 @@ public function handle(Event $event): void { // add marketing tracking magic \OCP\Util::addScript("nmc_marketing", "consent"); + \OCP\Util::addScript("nmc_marketing", "tracking"); } } From ec858517a5d3a13ba78ad1bba831c17bb903c96d Mon Sep 17 00:00:00 2001 From: Aleksei Efremov Date: Thu, 7 Mar 2024 16:18:59 +0200 Subject: [PATCH 2/3] Fix eslint errors --- js/tracking.js | 232 +++++++++++++++++++++++++------------------------ 1 file changed, 117 insertions(+), 115 deletions(-) diff --git a/js/tracking.js b/js/tracking.js index 342b112..c31fa99 100644 --- a/js/tracking.js +++ b/js/tracking.js @@ -1,125 +1,127 @@ +/* global utag */ + window.addEventListener('load', function() { - if (typeof utag === 'undefined' || !utag.view()) return - // Plus button in a breadcrumb - let plusBtnContainer = document.querySelector('.files-controls .actions.creatable') - plusBtnContainer?.addEventListener("click", function(event) { - let menuOption = event.target.closest('[data-action]') - if (menuOption) { - utag.view({ - wt_link_id: `plus.button.${menuOption.attributes['data-action'].value}`, - page_content_id: "files.breadcrumb", - page_type: "files" - }) - } - }) + if (typeof utag === 'undefined' || !utag.view()) return + // Plus button in a breadcrumb + const plusBtnContainer = document.querySelector('.files-controls .actions.creatable') + plusBtnContainer?.addEventListener('click', function(event) { + const menuOption = event.target.closest('[data-action]') + if (menuOption) { + utag.view({ + wt_link_id: `plus.button.${menuOption.attributes['data-action'].value}`, + page_content_id: 'files.breadcrumb', + page_type: 'files', + }) + } + }) - // Table head listener - let theadContainer = document.querySelector('#app-content-files table.files-filestable thead') - theadContainer?.addEventListener("mousedown", function(event) { - if (event.target.closest('.column-selection')) { - utag.view({ - wt_link_id: "checkbox.select-all", - page_content_id: "files.tablehead", - page_type: "files" - }) - return - } - let menuOption = event.target.closest('[data-action]') - if (menuOption) { - utag.view({ - wt_link_id: `button.${menuOption.attributes['data-action'].value}`, - page_content_id: "files.tablehead", - page_type: "files" - }) - } - }) + // Table head listener + const theadContainer = document.querySelector('#app-content-files table.files-filestable thead') + theadContainer?.addEventListener('mousedown', function(event) { + if (event.target.closest('.column-selection')) { + utag.view({ + wt_link_id: 'checkbox.select-all', + page_content_id: 'files.tablehead', + page_type: 'files', + }) + return + } + const menuOption = event.target.closest('[data-action]') + if (menuOption) { + utag.view({ + wt_link_id: `button.${menuOption.attributes['data-action'].value}`, + page_content_id: 'files.tablehead', + page_type: 'files', + }) + } + }) - // Table body listener - const registerTableBodyEvent = function(event) { - if (event.target.closest('.action.action-share')) { - utag.view({ - wt_link_id: "button.shared", - page_content_id: "files.tablebody", - page_type: "files" - }) - } else if (event.target.closest('td.selection')) { - utag.view({ - wt_link_id: "checkbox.select-file", - page_content_id: "files.tablebody", - page_type: "files" - }) - } else if (event.target.closest('.fileActionsMenu.popovermenu')) { - let menuItem = event.target.closest('[data-action]') - menuItem && utag.view({ - wt_link_id: `button.${menuItem.attributes['data-action'].value}`, - page_content_id: "files.tablebody.more", - page_type: "files" - }) - } - } + // Table body listener + const registerTableBodyEvent = function(event) { + if (event.target.closest('.action.action-share')) { + utag.view({ + wt_link_id: 'button.shared', + page_content_id: 'files.tablebody', + page_type: 'files', + }) + } else if (event.target.closest('td.selection')) { + utag.view({ + wt_link_id: 'checkbox.select-file', + page_content_id: 'files.tablebody', + page_type: 'files', + }) + } else if (event.target.closest('.fileActionsMenu.popovermenu')) { + const menuItem = event.target.closest('[data-action]') + menuItem && utag.view({ + wt_link_id: `button.${menuItem.attributes['data-action'].value}`, + page_content_id: 'files.tablebody.more', + page_type: 'files', + }) + } + } - let tbodyContainer = document.querySelector('#app-content-files table.files-filestable tbody') - tbodyContainer?.addEventListener("mousedown", (event) => registerTableBodyEvent(event)) + const tbodyContainer = document.querySelector('#app-content-files table.files-filestable tbody') + tbodyContainer?.addEventListener('mousedown', (event) => registerTableBodyEvent(event)) - // Files navigation container - let navContainer = document.querySelector('#app-navigation-vue') - navContainer?.addEventListener("mousedown", function(event) { - let navigation = event.target.closest('[data-cy-files-navigation-item]') - if (navigation) { - utag.view({ - wt_link_id: `link.${navigation.attributes['data-cy-files-navigation-item'].value}`, - page_content_id: "files.sidebarnav", - page_type: "files" - }) - } - }) + // Files navigation container + const navContainer = document.querySelector('#app-navigation-vue') + navContainer?.addEventListener('mousedown', function(event) { + const navigation = event.target.closest('[data-cy-files-navigation-item]') + if (navigation) { + utag.view({ + wt_link_id: `link.${navigation.attributes['data-cy-files-navigation-item'].value}`, + page_content_id: 'files.sidebarnav', + page_type: 'files', + }) + } + }) - // Photos navigation container - let navMediaContainer = document.querySelector('#app-navigation-vue') - navMediaContainer?.addEventListener("mousedown", function(event) { - let navigation = event.target.closest('[data-id-app-nav-item]') - if (navigation) { - utag.view({ - wt_link_id: `link.${navigation.attributes['data-id-app-nav-item'].value}`, - page_content_id: "photos.sidebarnav", - page_type: "photos" - }) - } - }) + // Photos navigation container + const navMediaContainer = document.querySelector('#app-navigation-vue') + navMediaContainer?.addEventListener('mousedown', function(event) { + const navigation = event.target.closest('[data-id-app-nav-item]') + if (navigation) { + utag.view({ + wt_link_id: `link.${navigation.attributes['data-id-app-nav-item'].value}`, + page_content_id: 'photos.sidebarnav', + page_type: 'photos', + }) + } + }) - // Toggle grid/list view button listener - let toggleView = document.querySelector('#view-toggle') - toggleView?.addEventListener('click', function() { - utag.view({ - wt_link_id: 'button.toggleview', - page_content_id: "files.list", - page_type: "files" - }) - }) + // Toggle grid/list view button listener + const toggleView = document.querySelector('#view-toggle') + toggleView?.addEventListener('click', function() { + utag.view({ + wt_link_id: 'button.toggleview', + page_content_id: 'files.list', + page_type: 'files', + }) + }) - // Header - navigation - let headerLeft = document.querySelector('#header .header-left') - headerLeft?.addEventListener("mousedown", function(event) { - let navigation = event.target.closest('[data-app-id]') - if (navigation) { - utag.view({ - wt_link_id: `link.${navigation.attributes['data-app-id'].value}`, - page_content_id: "header.left", - page_type: "header" - }) - } - }) + // Header - navigation + const headerLeft = document.querySelector('#header .header-left') + headerLeft?.addEventListener('mousedown', function(event) { + const navigation = event.target.closest('[data-app-id]') + if (navigation) { + utag.view({ + wt_link_id: `link.${navigation.attributes['data-app-id'].value}`, + page_content_id: 'header.left', + page_type: 'header', + }) + } + }) - // Header - options - let headerRight = document.querySelector('#header .header-right') - headerRight?.addEventListener("mousedown", function(event) { - let navigation = event.target.closest('[id]') - if (navigation) { - utag.view({ - wt_link_id: `link.${navigation.attributes['id'].value}`, - page_content_id: "header.right", - page_type: "header" - }) - } - }) + // Header - options + const headerRight = document.querySelector('#header .header-right') + headerRight?.addEventListener('mousedown', function(event) { + const navigation = event.target.closest('[id]') + if (navigation) { + utag.view({ + wt_link_id: `link.${navigation.attributes['id'].value}`, + page_content_id: 'header.right', + page_type: 'header', + }) + } + }) }) From a70de69955e50fd162b91d95517a28194985b289 Mon Sep 17 00:00:00 2001 From: Aleksei Efremov Date: Thu, 21 Mar 2024 11:28:36 +0200 Subject: [PATCH 3/3] Fix eslint errors --- js/tracking.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/js/tracking.js b/js/tracking.js index c31fa99..cb8dff1 100644 --- a/js/tracking.js +++ b/js/tracking.js @@ -118,7 +118,7 @@ window.addEventListener('load', function() { const navigation = event.target.closest('[id]') if (navigation) { utag.view({ - wt_link_id: `link.${navigation.attributes['id'].value}`, + wt_link_id: `link.${navigation.attributes.id.value}`, page_content_id: 'header.right', page_type: 'header', })