Outsystems - Web

Outsystems Reactive Web Apps

Install

Installation of the Javascript SDK is done by including a snippet on every page that provides javascript functions, and pulls the latest version of pyze.js from our CDN.

Initialize

This is best acheived in the OnApplicationReady event in Client Logic. Copy paste the javascript snippet into a JavaScript module on this action:

// Start Pyze Script
<script type="text/javascript">
    var pyzeAppKey="YOUR_PYZE_APP_KEY";
    !function(e,t){var s=e.Pyze||{_q:[]},i=e.PyzeEvents||{_q:[]},n=e.PyzeCuratedEvents||{_q:[]},r=e.PyzeIdentity||{_q:[]};function p(t,e){function s(e){t[e]=function(){t._q.push([e].concat(Array.prototype.slice.call(arguments,0)))}}for(var i=0;i<e.length;i++)s(e[i])}p(s,["initialize","getTimerReference","getAppInstanceId","postWebAppVersion","postPageView","setUserOptOut","deleteUser"]),p(i,["postCustomEvent","startTimerForEvent","postCustomEventWithAttributes","postTimedEvent","postTimedEventWithAttributes","postExplicitActivation"]),p(n,["post"]),p(r,["setUserProfile","resetUserProfile","updateUserProfile"]);var o=t.createElement("script"),a=t.getElementsByTagName("script")[0];o.type="text/javascript",o.async=!0,o.src="https://cdn.pyze.com/pyze.js",a.parentNode.insertBefore(o,a),e.Pyze=s,e.PyzeEvents=i,e.PyzeCuratedEvents=n,e.PyzeIdentity=r}(window,document),Pyze.initialize(pyzeAppKey);
</script>
// End Pyze Script

Custom Events

Events allow you to easily track unique user actions within your app.

Event

PyzeEvents.postCustomEvent("Blog Read");

This allows you to track when a user executed an action, for a simple count of how often that event is occurring.

Event with Attributes

Attributes are any key-value pair that you can attach to an event. You can have up to 99 attributes with any event. It is highly recommended to follow our Best Practices and heavily rely on attributes to make your instrumentation as minimal and useful as possible. In a typical application, you should have many more attributes than events.

// Create an object with key value pairs of custom attributes and post with postCustomEventWithAttributes

var attributes = {};
attributes["screen"] = "Home";
attributes["seconds spent"] = "50";

PyzeEvents.postCustomEventWithAttributes("Blog Read", attributes);

//Events with Attributes as Object
var attributes = {};
var address = {"city":"Redwood city","state":"CA","phone":{"home":{"area":"408", "prefix":"434", "linenumber":"5234"}}};
attributes["address"] = address;
PyzeEvents.postCustomEventWithAttributes('Blog Read', attributes)

Timed Events

Timing how long a user takes to complete an action is a common usecase for Pyze. The SDk has built-in handling for this, by allowing you to start a timer, and then send a custom event at the completion of that action.

  • startTimerForEvent - Start the timer with a name
  • postTimedEvent - End the timer by referencing the same name. The time in milliseconds will automatically be attached to this event. You can also optionally pass attributes as an additional paramater as show in the example below
//Start timer for event
PyzeEvents.startTimerForEvent("Screen Load Time");

//Post timed event. 
//Note : The event name attribute for the `startTimerForEvent` and  `postTimedEvent` should match.
PyzeEvents.postTimedEvent("Screen Load Time");

//Post timed event API when you want to send additional attributes
var customAttributes = {};
customAttributes["device"] = "iMac";
customAttributes["location"] = "CA";
PyzeEvents.postTimedEventWithAttributes("Screen Load Time", customAttributes);

For Example:

We initialize a simple timer in the onReady action to start the timer upon page load.

Then when the user submits the form, we call PostTimedEvent API. We can use this to see how long users are taking to fill out this form, along with any other information we want to include with this event.

Dimensions

Dimensions are attributes that can be attached to all events within a session. This is useful to have a standard set of attributes that change over time, and is simply a helper to accomplish this goal.

Dimensions are any key-value pairs that you attach to the initialize call. Create an object, and modify the initialize call to include this object.

var dimensions = {
  "department": "marketing",
  "role": "associate",
  "alpha": true
}

Pyze.initialize(pyzeAppKey, dimensions);

Profile

Profiles are a powerful way to add data about your users to Pyze. Use profiles to add data that is not specific to a point in time (events) and are attached to a specific user.

When a user logs in to your app, call setUserProfile to identify them to Pyze. Any events that happen after they are identified, will be attributed to this user. You should only call this method once upon the initial login of a session.

You can optionally include profile attributes.

Pyze built-in profile attributes get special handling in the pyze UI, and we will attempt to discern the data type for custom attributes based on the data recieved. There is no difference between the built-in attributes and custom ones outside of formatting applied.

//Create Pyze Profile Attributes object
var pyzeProfileAttributes = {
   "email_id"        : "xyz@abc.com",
   "date_of_birth"   : "1984-06-01",
   "first_name"      : "John",
   "last_name"       : "Jacobs"
}
//Create Custom Profile Attributes object
var customProfileAttributes = {
   "age"       : 29,
   "pincode"   : "23200",
   "city"      : "XYZ"
}
//Call the setUserProfile API
PyzeIdentity.setUserProfile(userId,pyzeProfileAttributes,customProfileAttributes);

Pyze profile attributes

Pyze User Profile Field Name Data Type/Description
background (string) User background, biography or historical data
country (string) Country codes must be sent in the ISO-3166-1 alpha-2 standard.
current_location (object) Format: {“longitude”: -33.991894, “latitude”: 25.243732}
date_of_first_use (date at which the user first used the app) String in ISO 8601 format or in yyyy-MM-dd’T’HH:mm:ss.SSSZ format.
date_of_last_use (date at which the user last used the app) String in ISO 8601 format or in yyyy-MM-dd’T’HH:mm:ss.SSSZ format.
date_of_birth (date of birth) String in format “YYYY-MM-DD”, example: 1984-06-01.
email_id (string) Email Id
email_subscribe (string) Acceptable values are “opt_in” (explicit approval to receive email messages), “opt_out” (explicit denial to email messages), and “subscribed” (neither opted in nor out).
email_hard_bounced Automatically updated when a hard bounce occurs (true or false)
email_spam_reported Automatically updated when a user marks your email as spam, via the ISP (true or false)
facebook_id facebook ID
first_name (string) User’s First name
gender (string) “M”, “F”, “O” (other), “N” (not applicable), “P” (prefer not to say) or “U” (unknown).
home_city (string) User’s Home City
image_url (string) URL of image to be associated with the user
language (string) Require language to be sent in the ISO-639-1 standard.
last_name (string) User’s Last Name
marked_email_as_spam_at (string) Date at which the user’s email was marked as spam. Must be in ISO 8601 format or in yyyy-MM-dd’T’HH:mm:ss.SSSZ format.
phone (string) Phone number
push_subscribe (string) Available values are “opted_in” (explicitly registered to receive push messages), “unsubscribed” (explicitly opted out of push messages), and “subscribed” (neither opted in nor out).
push_tokens Array of objects with app_id and token string. You may optionally provide a device_id for the device this token is associated with, e.g., [{“app_id”: App Identifier, “token”: “abcd”, “device_id”: “optional_field_value”}]. If a device_id is not provided, one will be randomly generated.
time_zone (string) Time Zone’s must be sent as per IANA Time Zone Database (e.g., “America/New_York” or “Eastern Time (US & Canada)”). Only valid values will be respected.
twitter_id Twitter ID

Updating an existing user Profile

To update user profile attributes which are already set, use the following api.

Note : Do not call this api before calling setUserProfile.

//Create Pyze Profile Attributes object
var pyzeProfileAttributes = {
   "email_id"        : "xyz2@abc.com",
   "date_of_birth"   : "1984-07-01",
   "first_name"      : "John M",
   "last_name"       : "Jacobs"
}
//Create Custom Profile Attributes object
var customProfileAttributes = {
   "age"       : 29,
   "pincode"   : "232001",
   "city"      : "XYZ2"
}
//Call the updateUserProfileAttributes API
PyzeIdentity.updateUserProfile(pyzeProfileAttributes,customProfileAttributes);

Logging out a user

Call this api when a user logs out. Event sent after this call will have no identity attached, and will be attributed to an anonymous user.

PyzeIdentity.resetUserProfile(); 

User Privacy

Pyze provides APIs to allow end-users to Opt out of Data Collection and also instruct the Pyze system to forget a user’s data.

setUserOptOut

Allows end-users to opt out from data collection. Opt-out can be toggled true or false.

Pyze.setUserOptOut(true) 

To resume user data collection set value to false

deleteUser

Allows end-users to opt out from data collection and delete the user in the Pyze system. We recommend you confirm this action as once a user is deleted, this cannot be undone.

Pyze.deleteUser(true) 

API Reference

Full API reference available here

Last modified 2020-12-23