Documentation Index
Fetch the complete documentation index at: https://platform.docs.zenoo.com/llms.txt
Use this file to discover all available pages before exploring further.
Analytics
You are able to initialize different analytics providers when application starts and call specific action when certain event occurs.
List of currently available providers:
Example integration
# index.yml
analytics:
mixpanel: "a78gc206fb0a9d85edb622d10ec74b5d"
gtm: "GTM-XXXXXX"
User indentification
To identify current user for different analytics providers analytics.authorizationToken configuration key can be used, e.g.:
# index.yml
analytics:
authorizationToken: !expression "url.query.do_authorization"
analytics.authorization action from Expression context can be used:
- !component as: div
onClick: !function "analytics.authorization(flow.export.identityId)"
Events management
Analytics events can be dispatched manually or using analytics event management.
By defining analytics in page configuration built-in analytics event management will be involved, some UI components are dispatching basic default events, e.g. form fields have click, change, blur, focus, etc.
Analytics page configuration
Analytics configuration structure is coresponding to an event you want to handle and can be placed on every page.
There are 3 ways you can set event configuration: “string”, “object” or “function” annotaion:
analytics:
fields:
firstName:
# String annotation
change: "firstNameChanged"
middleName:
# Object annotation
change:
eventName: "middleNameChanged"
data:
page: !expression "page.name"
device: !expression: "device.deviceType"
lastName:
# Function annotation
change: !function "analytics.event('lastNameChanged')"
analytics:
fields:
change: !function "analytics.event('someFieldChanged')"
Existing events
Form fields events:
| Event name | Description |
|---|
click | Triggers when user clicks on field |
change | Triggers when user change value of field |
focus | Triggers when user focus on field |
blur | Triggers when user unfocus from field |
| Event name | Description |
|---|
click | Triggers when user clicks on field |
change | Triggers when user change value of field |
accepted | File was accepted to field |
rejected | File was rejected, it can be caused by prevalidations or livness detection |
fields.{FieldName}.{EventName}.
Application lifecycle events
| Path | Event name | Description |
|---|
page | enter | Triggers when page is entered |
page | leave | Triggers when page is leaved |
form | initialized | Triggers when execution is initialized |
{Path}.{EventName}.
Analytics storage
Expression context has support for dispatching analytics events and for storing some values.
Analytics storage is a simple key/value storage, that can contain any value. It has some utils to make its usage simpler: for numeric values there are increment and get. increment will augment value by 1, if value does not exist, it will set it to 1.
Example:
This will sends event with name Click with parameter count: 1 for first call, 2 for second call, etc.
!function "analytics.event('Click', { count: analytics.storage.increment('timesClicked') })
Click with parameter count with value from storage.
If this value does not exist, count will be set to 0 (default value).
!function "analytics.event('Click', { count: analytics.storage.get('timesClicked', 0) })
Global analytics params
There is a way to set global analytics params which will be sent with every single event.
This injection works only when input params in event call is an object or was not provided.
Global params has lower priority, so if you redefine same field in event params, it will overwrite it.
Example:
# index.yml
analyticsParams:
ip: !expression "flow.export.ip"
page: !expression "page.name"
Dispatch events manually
To manually fire analytics event, use analytics.event method from expression context
- !component as: div
onClick: !function "analytics.event(eventName, eventParams)"
