mirror of
https://github.com/plausible/analytics.git
synced 2024-12-25 02:24:55 +03:00
135471c32e
Adds a new script extension that allows tracking interactions with specific HTML elements on a website. For example - to track link clicks on one specific `<a>` element, you can tag it like this: ```html <a href=... class="plausible-event-name=<your_event_name>"> ``` And you can also tag the link with custom property names and values: ```html <a href=... class="plausible-event-name=<your_event_name> plausible-event-<your_custom_prop>=<your_value>"> ``` Tagging a link as above will send a custom event with the given name and props, if a `click` or `auxclick` browser event happens, and targets the link element. The tracking behavior is somewhat different based on the HTML element type: - `<a>` - triggers on `click` and `auxclick` events - intercepts navigation based on the same rules as `outbound-links` and `file-downloads` - `<form>` - triggers on `submit` event - always intercepts navigation (calls `form.submit()` after preventing default and sending the Plausible event) - other (`<img>`, `<button>`, `<span>`, `<div>`, `<h2>`, etc ...) - triggers on `click` and `auxclick` events - does not prevent default to intercept possible navigation. Simply calls Plausible with the event name and props read from the element class list.
39 lines
1.5 KiB
JavaScript
39 lines
1.5 KiB
JavaScript
const uglify = require("uglify-js");
|
|
const fs = require('fs')
|
|
const path = require('path')
|
|
const Handlebars = require("handlebars");
|
|
const g = require("generatorics");
|
|
|
|
Handlebars.registerHelper('any', function (...args) {
|
|
return args.slice(0, -1).some(Boolean)
|
|
})
|
|
|
|
Handlebars.registerPartial('customEvents', Handlebars.compile(fs.readFileSync(relPath('src/customEvents.js')).toString()))
|
|
|
|
function relPath(segment) {
|
|
return path.join(__dirname, segment)
|
|
}
|
|
|
|
function compilefile(input, output, templateVars = {}) {
|
|
const code = fs.readFileSync(input).toString()
|
|
const template = Handlebars.compile(code)
|
|
const rendered = template(templateVars)
|
|
const result = uglify.minify(rendered)
|
|
if (result.code) {
|
|
fs.writeFileSync(output, result.code)
|
|
} else {
|
|
throw new Error(`Failed to compile ${output.split('/').pop()}.\n${result.error}\n`)
|
|
}
|
|
}
|
|
|
|
const base_variants = ["hash", "outbound-links", "exclusions", "compat", "local", "manual", "file-downloads", "dimensions", "tagged-events"]
|
|
const variants = [...g.clone.powerSet(base_variants)].filter(a => a.length > 0).map(a => a.sort());
|
|
|
|
compilefile(relPath('src/plausible.js'), relPath('../priv/tracker/js/plausible.js'))
|
|
compilefile(relPath('src/p.js'), relPath('../priv/tracker/js/p.js'))
|
|
|
|
variants.map(variant => {
|
|
const options = variant.map(variant => variant.replace('-', '_')).reduce((acc, curr) => (acc[curr] = true, acc), {})
|
|
compilefile(relPath('src/plausible.js'), relPath(`../priv/tracker/js/plausible.${variant.join('.')}.js`), options)
|
|
})
|