Xtify Reactor

Customizing Your Notifications

By default, Reactor includes a simple overlay display for your notifications. However, some users will want to customize the appearance of the notification to integrate it more cleanly with their user experience.

Reactor provides hooks that may be used to suppress messages, record custom statistics, and run other custom display logic.

The Message Object

Each of these hooks offers the opportunity to review and manipulate message objects. A message object is a standard JavaScript object with the following fields:


//Sample
//Sample
var exampleMessage = {
   "subject"     : "Example Subject",  
   "body"        : "Example Body",
   "customData"  : {}  //This is the optional JSON object created in the
                       //content section of the Reactor
                       //Campaign Manager.
}


onBeforeMessage()

If Reactor determines that a message should be displayed, the message object can optionally be passed to a function of your choosing before display. This allows you the opportunity to suppress a message, implement custom prioritization schemes or record custom metrics.

Because a single event can trigger the display of multiple messages, the function you provide should expect a message array as a parameter. This array will contain all of the messages that have been triggered by the event in question. In most cases the list will only have one message, but it can contain more.

Your function should return a list containing all of the message objects whose display you wish to allow. This list may be the same as the list that was passed in as a parameter.


Reactor.onBeforeMessage(function(messageList){
    var messagesToShow = [];
    for (var i=0 i < messageList.length; i++)
    {
        var message = messageList[i];
        if(shouldShowMessage(message)) // Custom logic
            messagesToShow.push(message);
    }
    return messagesToShow;
});
//

Messages which are suppressed by your function will not be counted in the metrics shown on the Measure page of the Reactor console.

onMessage()

In order to handle the display of messages yourself, you can register a custom display function via the onMessage function. This function will be called once per message to be displayed. Unlike onBeforeMessage above, the function that you pass to onMessage expects a single message object as a parameter.

//Example Custom Display Function
Reactor.onMessage(function(message){
	subjectDiv = document.getElementbyId("example-notif-subject");
	subjectDiv.innerHTML = message.subject;
	bodyDiv = document.getElementbyId("example-notif-body");
	bodyDiv.innerHTML = message.body;
});
//