diff --git a/index.pug b/index.pug index 5e109de..9b115cb 100644 --- a/index.pug +++ b/index.pug @@ -15,8 +15,8 @@ html.scroll-smooth(lang=lang) const footerObserver = new IntersectionObserver((payload) => { const hasScrolltedTo = payload.pop().isIntersecting; if (hasScrolltedTo && window.hasOwnProperty("umami")) { - umami.track("scrolled to", {position: "footer", id: "footer"}); - console.debug("scrolled to footer"); + umami.track("scrolled to", {position: "footer", id: "footer", visitDuration: getVisitDuration()}); + console.debug("scrolled to footer", {visitDuration: getVisitDuration()}); } }); footerObserver.observe(footerEl); @@ -26,8 +26,8 @@ html.scroll-smooth(lang=lang) new IntersectionObserver((payload) => { const hasScrolltedTo = payload.pop().isIntersecting; if (hasScrolltedTo && window.hasOwnProperty("umami")) { - umami.track("scrolled to", {position: "section", id}); - console.debug("scrolled to section with id", id); + umami.track("scrolled to", {position: "section", id, visitDuration: getVisitDuration()}); + console.debug("scrolled to section with id", {id, visitDuation: getVisitDuration()}); } }); sections.forEach((section) => sectionObserver(section.id).observe(section)); diff --git a/src/components/Academia.pug b/src/components/Academia.pug index 2833f2c..4d7fe13 100644 --- a/src/components/Academia.pug +++ b/src/components/Academia.pug @@ -17,7 +17,7 @@ section#academia.bg-nls-black.text-white details.mb-4 summary.rounded-sm.text-white.transition.underline-offset-2.mb-2.cursor-pointer( class="focus:outline-none focus:z-10 focus:ring-4 focus:ring-white focus:bg-white focus:text-black focus:no-underline", - onclick="umami.track('collapsable clicked', { category: 'courses dhbw' })" + onclick="umami.track('collapsable clicked', { category: 'courses dhbw', visitDuration: getVisitDuration() })" )= academia.courseInstitutions.dhbw ul.list-disc.list-inside li= academia.courses.dhbw[0] @@ -25,7 +25,7 @@ section#academia.bg-nls-black.text-white details.mb-4 summary.rounded-sm.text-white.transition.underline-offset-2.mb-2.cursor-pointer( class="focus:outline-none focus:z-10 focus:ring-4 focus:ring-white focus:bg-white focus:text-black focus:no-underline", - onclick="umami.track('collapsable clicked', { category: 'courses leibniz-fh' })" + onclick="umami.track('collapsable clicked', { category: 'courses leibniz-fh', visitDuration: getVisitDuration() })" )= academia.courseInstitutions.lfh ul.list-disc.list-inside each course in academia.courses.lfh diff --git a/src/components/Collapsable.pug b/src/components/Collapsable.pug index 5e7eb96..2270cb7 100644 --- a/src/components/Collapsable.pug +++ b/src/components/Collapsable.pug @@ -16,7 +16,7 @@ mixin Collapsable(data, open) details.mb-4(open=isExpanded) summary.rounded-sm.transition.mb-2.cursor-pointer.text-md.font-semibold.mb-2.cursor-pointer( class=`sm:text-lg text-nls-${color} focus:outline-none focus:z-10 focus:ring-4 focus:ring-nls-${color} focus:bg-nls-${color} focus:text-black focus:no-underline`, - onclick=`umami.track('collapsable clicked', { category: '${category}' })` + onclick=`umami.track('collapsable clicked', { category: '${category}', visitDuration: getVisitDuration() })` )= data.summary ul.list-disc.list-inside.text-gray-400 each item in data.items @@ -32,7 +32,7 @@ mixin Collapsable(data, open) target="_blank", aria-label=link.description, rel="noopener noreferrer", - onclick=`umami.track('${linkEventName}', { category: '${category}', position: 'collapsable', label: '${link.label}' })` + onclick=`umami.track('${linkEventName}', { category: '${category}', position: 'collapsable', label: '${link.label}', visitDuration: getVisitDuration() })` )= link.text if index < item.links.length - 1 | ,  diff --git a/src/components/Footer.pug b/src/components/Footer.pug index 61354d9..30896fa 100644 --- a/src/components/Footer.pug +++ b/src/components/Footer.pug @@ -1,7 +1,7 @@ mixin Link(href, label, target, rel) - const eventName = "external link clicked"; - const eventCategory = "footer"; - - const onclick = `umami.track('${eventName}', { category: 'icons', position: 'footer', label: '${label}' })`; + - const onclick = `umami.track('${eventName}', { category: 'icons', position: 'footer', label: '${label}', visitDuration: getVisitDuration() })`; a.transition-colors.text-white(href=href, class="hover:text-amber-300", target=target, rel=rel, onclick=onclick) block @@ -43,7 +43,7 @@ footer#footer.bg-nls-black.text-white href=footer.emailLink, class="hover:text-amber-300", rel="noopener noreferrer", - onclick="umami.track('email clicked', { position: 'footer' })" + onclick="umami.track('email clicked', { position: 'footer', visitDuration: getVisitDuration() })" ) #{footer.emailText} +Link("https://git.dailysh.it/nextlevelshit/dailysh.it", "gitea", "_blank", "noopener noreferrer") | #{footer.gitea} @@ -52,6 +52,6 @@ footer#footer.bg-nls-black.text-white href=footer.riskUrl, aria-label=footer.riskAriaLabel, title=footer.riskTitle, - onclick="umami.track('easter egg clicked', { category: 'footer', position: 'footer' })" + onclick="umami.track('easter egg clicked', { category: 'footer', position: 'footer', visitDuration: getVisitDuration() })" ) img.w-12.ml-auto(src=footer.riskImgSrc, alt=footer.riskImgAlt, class="mt-[1000vh]") diff --git a/src/components/Head.pug b/src/components/Head.pug index db874c8..2864761 100644 --- a/src/components/Head.pug +++ b/src/components/Head.pug @@ -107,3 +107,10 @@ head ) script(async, defer, data-website-id=head.umamiId, src=head.umamiSrc) + + script. + window.visitDuration = Date.now(); + + const getVisitDuration = () => { + return Math.floor((Date.now() - window.visitDuration) / 1000); + }; \ No newline at end of file diff --git a/src/components/Professional.pug b/src/components/Professional.pug index 489da6e..c7b6fe9 100644 --- a/src/components/Professional.pug +++ b/src/components/Professional.pug @@ -14,7 +14,7 @@ section#professional.bg-nls-black.text-white title=item.link.title, target="_blank", rel="noopener noreferrer", - onclick=`umami.track('external link clicked', { position: 'professional', label: '${item.link.label}' })`, + onclick=`umami.track('external link clicked', { position: 'professional', label: '${item.link.label}', visitDuration: getVisitDuration() })`, aria-label=item.link.ariaLabel ) #{item.link.text} | #{item.text} diff --git a/src/components/Title.pug b/src/components/Title.pug index 215fb57..a57196c 100644 --- a/src/components/Title.pug +++ b/src/components/Title.pug @@ -10,8 +10,8 @@ header.bg-nls-black.text-white | & #{title.jobTitle[1]} h2.text-2xl.mt-8.opacity-90.group(class="sm:text-5xl sm:mt-16", itemprop="email") a( - onclick="umami.track('email clicked', { position: 'title' })", - onmouseover="umami.track('email hovered', { position: 'title' })", + onclick="umami.track('email clicked', { position: 'title', visitDuration: getVisitDuration() })", + onmouseover="umami.track('email hovered', { position: 'title', visitDuration: getVisitDuration() })", href=footer.emailLink, rel="noopener noreferrer", itemprop="email"