Our documentation is changing, please click here to enjoy it!

Skip to end of metadata
Go to start of metadata

Using the library inside your pages

First things first, if you want to use our library in your website, you have to paste a code snippet in your pages.

Code snippet to paste

This is an easy part. Just remember to edit the "MASTER DOMAIN" <string> with the master domain created with your Accengage Application. Check this section of our guide to have more informations about process of creating an Accengage Web Application.

In general, when you want to communicate with the library, you will need to create a command by calling the main JavaScript Object ACC (read this section if you want another reference name). As the code snippet could still be on a loading state (because you are using a tag manager for example), we suggest you declare the ACC object as an <array> as soon as possible. For example:

Then, you just need to use the push method of the ACC object to create a new command. For example:

The three parameters mostly accept :

ArgumentTypeDescription
1 → name<string>always required, containing the plugin name and method name to call, separating by a ":"
2 → options<*>containing the options of the command
3 →icallbacks<object>containing callbacks <function> type, applied when the command has been consumed

To summarize, the ACC JavaScript Object is set thanks to the snippet code you have previously added in your page. If the library is not fully loaded when the command is created, it will be put inside a queue, waiting for the library to load. When the library is loaded, the stored commands, or next created commands, will be properly consumed.

 

Collect plugin

collect:setOptinData

Use this command whenever you want to set the optin data value.

ArgumentRequiredTypeDescription
optionsyes<object>

an object with the optinData parameter

  • "optinData" : <Boolean> 
callbacksoptional<object>
  • "onSuccess" : <void> 
  • "onError" : <string> label error
For example


collect:getOptinData

Use this command to retrieve the optin data value

 

ArgumentRequiredTypeDescription
optionsnot used  
callbacksoptional<object>
  • "onSuccess" : <object> an object containing the optinData value

  • "onError" : <string> label error
For example

 

Core plugin

core:updateDeviceInfo

Use this command whenever you want to update the current user's information. Some fields, that we use internally, are filtered.

ArgumentRequiredTypeDescription
optionsyes<object>a list of fields <string> with value <string|number>
callbacksoptional<object>
  • "onSuccess" : <void> 
  • "onError" : <string> label error
For example

core:getDeviceID

Use this command to retrieve the current user device ID.

ArgumentRequiredTypeDescription

options

not used  
callbacksyes<object>
  • "onSuccess" : <string> device ID
  • "onError" : <string> label error while retrieving the user device ID


For example

core:isCompliantWithPushPlugin

Use this command to know if the user is compliant with the Push Plugin

ArgumentRequiredTypeDescription

options

not used  
callbacksyes<object>
  • "onSuccess" : <void>
  • "onError" : <void>


For example


core:addCustomListeners

Use this command to register your custom listeners to an event triggered by the library

ArgumentRequiredTypeDescription
optionsyes<object>

a list of event names <string> with listener <function>. Available Core plugin events :

  • "sdkLoaded" : <object> this event is retroactive, i.e. if you use this command after the library has been loaded, your provided listener will be triggered. It is also a one time event. It returned a object containing the set configuration of your application
callbacksoptional<object>
  • "onSuccess" : <array> returning the events that have been listened
  • "onError" : <string> label expliciting the reason why no events have been listened
For example

 

Push plugin

push:showAlert

Use this command when you want to show the HTML alert to the user.

ArgumentRequiredTypeDescription
optionsoptional<object>

a new set of parameters that can override the configuration of your application (see the "alert configuration" section to check all the possibilities)

callbacksoptional<object>
  • "onSuccess" : <void>
  • "onError" : <string> label error
For example

push:launchLandingOnClick

Use this command to bind one or more DOM Anchor Elements (</a> tag) to launch the optout-to-optin landing page on click.

ArgumentRequiredTypeDescription
optionsyes<array>of <string> containing selected anchors to bind. The value must start with "#" or "." (ID or ClassName)
callbacksoptional<object>
  • "onSuccess" : <array> provided elements that have been utterly binded
  • "onError" <string> label error
For example

push:requestBrowserPermission

Use this command to bind one or more DOM Anchor Elements (</a> tag) to display the native push browser's permission (from SDK 3.3.x)

ArgumentRequiredTypeDescription
optionsyes<array>of <string> containing selected anchors to bind. The value must start with "#" or "." (ID or ClassName)
callbacksoptional<object>
  • "onSuccess" : <array> provided elements that have been utterly binded
  • "onError" <string> label error
For example

push:isOptin

Use this command to know if the user is optin to push. It can tell why the user is optout, e.g. if he has denied the native notification permission.

ArgumentRequiredTypeDescription
optionsnot used  
callbacksoptional<object>
  • "onSuccess" : <object: status <string>, details <object>> user is optin
  • "onError" <object: status<string>, details <object>> user is optout
For example

push:addCustomListeners

Use this command to register your custom listeners to an event triggered by the library

ArgumentRequiredTypeDescription
optionsyes<object>

a list of event names <string> with listener <function>. Available Push plugin events :

  • "plugin:started" : <object> this event is retroactive, i.e. if you use this command after the library has been loaded, your provided listener will be triggered. It is also a one time event. It returned a object containing the set configuration of the plugin
     
  • "landingFeedback:optin" : <void> triggered when the optout-to-optin landing page returns that the user has granted permission and is now optin
  • "landingFeedback:softOptout" : <void> same thing, but triggered when the user has not granted the notification permission. In this case, the user can still be optin.
  • "landingFeedback:hardOptout" : <void> same this, but triggered when the user has denied the permission, hence he's definitely optout
callbacksoptional<object>
  • "onSuccess" : <array> returning the events that have been listened
  • "onError" : <string> label expliciting the reason why no events have been listened
For example

 

Track plugin

(Please, contact your project manager in order to enable this feature).

Each command related to the Track Plugin uses an option <object> and callbacks <object> (containing <function>).

For example

 

The options <object> differ from each other. Each command has its own data to provided.

The callbacks <object> will tell if your command has been validated and will be treated. In this case the "onSuccess" provided function will be applied. Otherwise the "onError" function will provide you a <string> expliciting the error.

For the sake of clarity, we will only tell how to set your options <object> for each command (as the callbacks object is generic and straightforward to understand).

track:event

OptionsRequiredTypeDescription
idrequired<numeric>

Please provide a valid number (NaN will not be a valid value)
Please note that you can create custom event in the Advanced Settings section of our interface

detailsoptional<object>key - value set of data, used to details your event
For example

track:lead

OptionsRequiredTypeDescription
leadrequired<string>

 

valuerequired<string> you can also provide "now()" as the value, it will automatically replace the string as a formatted date
For example

track:cart

OptionsRequiredTypeDescription
itemrequired<object>

The item <object> will respect this format:

idoptional<string>The id of your cart, it could match the id provided in a purchase track event
For example

track:purchase

OptionsRequiredTypeDescription
idrequired<string>

 

pricerequired<numeric>please provide a valid number (NaN will not be a valid value)
currencyrequired<string> 
itemsoptional<array>

containing item <object> respecting this format:

For example

 

Facebook Messenger plugin

fbMessenger:generateButton

Use this command to generate a Facebook Messenger button. You can create buttons as many as you want.

ArgumentRequiredTypeDescription
containerIdyes<string>the ID of your DOM Element that will contain the generated button
coloroptional<string>

a constant defining the color of the generated button. Available colors :

  • "blue" default if not provided
  • "white"
sizeoptional<string>

a constant defining the size of the generated button. Available sizes :

  • "standard"
  • "large" default if not provided
  • "xlarge"
callbacksoptional<object>
  • "onSuccess": <void>
  • "onError": <string> label expliciting the reason why no button has been generated
For example

 

push:requestBrowserPermission

Use this command to bind one or more DOM Anchor Elements (</a> tag) to display the native push browser’s permission.

Argument

Required

Type

Description

options 

yes

<array> 

of <string> containing selected anchors to bind. The value must start with "#" or "." (ID or ClassName)

callbacks 

optional

<object> 

·         "onSuccess" : <array> provided elements that have been utterly binded

·         "onError" <string> label error

 

ACC.push([

        "push:requestBrowserPermission",

        [

               "#myLink",

               ".myOtherLinks"

        ]

]);

 

 

  • No labels