Notifications

Raising Notifications

Available since Glue42 Enterprise 3.10

Note that the Glue42 Notifications API uses interfaces extending the interfaces of the DOM Notifications API. The documentation below describes the specifics of the Glue42 Notifications API. For full details on the DOM Notification API interfaces, see the respective DOM documentation for Notification, NotificationAction, NotificationOptions and Event.

The Notifications API is accessible through the glue.notifications object.

To raise a notification from your app, use the raise() method of the API. The method accepts as an argument a required Glue42NotificationOptions object with settings for the notification you want to raise:

const options = {
    title: "New Trade",
    body: "VOD.L: 23 shares sold @ $212.03",
    actions: [
        {
            action: "openClientPortfolio",
            title: "Open Portfolio"
        }
    ]
};

// Raising a notification.
const notification = await glue.notifications.raise(options);

Raising Notifications

Notification Options

The Glue42NotificationOptions object extends the standard web NotificationOptions object with several additional properties:

Property Type Description
actions Glue42NotificationAction[] An array of Glue42NotificationAction objects.
clickInterop object Accepts an InteropActionSettings object as a value. Use this property to invoke an Interop method when the user clicks on the notification. You can specify arguments for the method and an Interop target.
panelExpiry number Interval in seconds after which the notification will be removed from the Notification Panel.
severity "Low" | "Medium" | "High" | "Critical" | "None" Defines the urgency of the notification which is represented visually by different colors in the notification UI.
source string Overrides the source of the notification. Provide the name of the Glue42 app which you want to be displayed as a source of the notification.
title string The title of the notification.
toastExpiry number Interval in seconds after which the notification toast will be hidden.
type "Notification" | "Alert" This property is meant to be used only as a way to distinguish between notification types in case you want to create different visual representations for them - e.g., the "Notification" type may be considered a general notification, while the "Alert" type may be considered a more important or urgent notification.

Notification Click

Standard Click Handler

The raise() method returns a Glue42Notification object. Use its onclick property to specify a callback that will be invoked when the user clicks on the notification:

const options = {
    title: "New Trade",
    body: "VOD.L: 23 shares sold @ $212.03",
    actions: [
        {
            action: "openClientPortfolio",
            title: "Open Portfolio"
        }
    ]
};

const notification = await glue.notifications.raise(options);

notification.onclick = () => console.log("Notification was clicked.");

Interop Click Handler

You can also use the clickInterop property of the Glue42NotificationOptions object to specify an Interop method that will be invoked when the user clicks on the notification. For instance, another app has registered an Interop method:

const methodName = "HandleNotificationClick";
const handler = (args) => {
    console.log(JSON.stringify(args));
};

await glue.interop.register(methodName, handler);

To invoke this Interop method for handling the notification click, define an InteropActionSettings object and assign it as a value to the clickInterop property of the notification options object:

const interopSettings = {
    // The only required property is the method name.
    method: "HandleNotificationClick",
    arguments: {
        name: "Vernon Mullen",
        id: "1"
    }
};

const options = {
    title: "New Trade",
    body: "VOD.L: 23 shares sold @ $212.03",
    actions: [
        {
            action: "openClientPortfolio",
            title: "Open Portfolio"
        }
    ],
    clickInterop: interopSettings
};

const notification = await glue.notifications.raise(options);

Notification Actions

You can create action buttons for the notification. When the user clicks on an action button, the specified callbacks will be invoked.

Actions

To define action buttons, use the actions property of the Glue42NotificationOptions object when creating a notification. The actions property accepts an array of Glue42NotificationAction objects:

const options = {
    title: "New Trade",
    body: "VOD.L: 23 shares sold @ $212.03",
    actions: [
        {
            action: "callClient",
            title: "Call Client"
        },
        {
            action: "openClientPortfolio",
            title: "Open Portfolio"
        }
    ]
};

Note that the action buttons in a Glue42 Notification are limited to two, as the web browsers currently support a maximum of two actions.

See below how to create standard notification actions (actions that don't require Interop functionality) as well as Interop actions.

Standard Actions

Besides all properties of a standard web Notification object, the Glue42Notification object has an additional onaction property. You can use this property to assign a callback that will be invoked when the user clicks an action button in the notification. The callback receives as an argument an ActionEvent object which extends the standard web Event object. The ActionEvent object has an action property that holds the name of the triggered action.

const notificationOptions = {
    title: "New Trade",
    body: "VOD.L: 23 shares sold @ $212.03",
    actions: [
        {
            action: "openClientPortfolio",
            title: "Open Portfolio"
        }
    ]
};

const notification = await glue.notifications.raise(notificationOptions);

notification.onaction = function (actionEvent) {
    if (actionEvent.action === "openClientPortfolio") {
        console.log(`Action button in notification "${this.title}" has been clicked.`);
    };
};

Interop Actions

The Glue42NotificationAction object extends the standard web NotificationAction object by adding an interop property which you can use to invoke Interop methods when the user clicks an action button in the notification.

First, register an Interop method in another app:

const methodName = "HandleNotificationClick";
const handler = (args) => {
    console.log(JSON.stringify(args));
};

glue.interop.register(methodName, handler);

After that, in your app define an InteropActionSettings object and assign it as a value to the interop property of the action object in the actions array:

const interopSettings = {
    // The only required property is the method name.
    method: "HandleNotificationClick",
    arguments: {
        name: "Vernon Mullen",
        id: "1"
    }
};

const notificationOptions = {
    title: "New Trade",
    body: "VOD.L: 23 shares sold @ $212.03",
    actions: [
        {
            action: "openClientPortfolio",
            title: "Open Portfolio",
            interop: interopSettings
        }
    ]
};

const notification = await glue.notifications.raise(notificationOptions);

Notification Filters

Available since Glue42 Enterprise 3.12.1

Notifications can be filtered programmatically based on lists of allowed and/or blocked apps.

To set a notification filter, use the setFilter() method and pass a NotificationFilter object as an argument:

const filter = {
    allowed: ["*"],
    blocked: ["app-one", "app-two"]
};

await glue.notifications.setFilter(filter);

Use a NotificationFilter object to specify which apps will be able to raise notifications. This object has two properties:

Property Type Description
allowed string[] List of the names of the apps which will be allowed to raise notifications. Use * to allow all apps.
blocked string[] List of the names of the apps which won't be allowed to raise notifications. Use * to block all apps.

Using a combination of both lists enables you to create various filters:

// Allows all apps to raise notifications.
const allowAll = {
    allowed: ["*"]
};

// Allows only the specified apps to raise notifications.
const allowOnly = {
    allowed: ["app-one", "app-two"]
};

// Allows all except the blocked apps to raise notifications.
const allowAllExcept = {
    allowed: ["*"],
    blocked: ["app-one", "app-two"]
};

// Blocks all apps from raising notifications.
const blockAll = {
    blocked: ["*"]
};

To get the current notification filter, use the getFilter() method:

const filter = await glue.notifications.getFilter();

Notification Panel

Available since Glue42 Enterprise 3.12.1

The Notification Panel can be controlled programmatically - show, hide or toggle its visibility. The Notification Panel API is accessible through the glue.notifications.panel object.

To check whether the Notification Panel is visible, use the isVisible() method:

const isPanelVisible = await glue.notifications.panel.isVisible();

To show the Notification Panel, use the show() method:

await glue.notifications.panel.show();

To hide the Notification Panel, use the hide() method:

await glue.notifications.panel.hide();

To toggle the visibility of the Notification Panel, use the toggle() method:

await glue.notifications.panel.toggle();

Configuration

Available since Glue42 Enterprise 3.16

To turn off notification toasts or to disable the notifications completely, use the configure() method. It accepts a Configuration object as an argument with the following properties:

Property Type Description
enable boolean If true (default), will enable notifications in the Notification Panel and notification toasts. Set to false to completely disable notifications.
enableToasts boolean If true (default), will enable notification toasts. The enable property must be set to true, otherwise this will have no effect.

To disable all notifications:

const config = { enable: false };

await glue.notifications.configure(config);

To disable only toast notifications:

const config = { enableToasts: false };

await glue.notifications.configure(config);

Advanced Usage

Glue42 Routing

Glue42 Routing enables customization of GNS notifications delivery and display. Glue42 Routing can be applied at the source, category and notification level and is overridden in the same order, so that the Glue42 Routing in a notification overrides the one specified in the notification category, which overrides the one specified in the notification source.

There are 4 customizations you can make:

  • specify an Interop handler method which will be called by the GNS Desktop Manager before passing a notification to GNS clients (UIs). The GNS Desktop Manager will call this method and if any app returns true, the GNS Desktop Manager will assume that the app will handle the notification and won't pass it to other clients.
  • specify an Interop popup method which should be called by GNS clients instead of displaying their own notifications;
  • specify an Interop detail method which should be called by GNS clients instead of displaying their own notification details view;
  • specify a list of Glue42 Actions associated with the notification which GNS clients can use to display buttons or a context menu with the actions applicable to a notification. Each action is tied to an Interop method which will be called when the action is executed.

Using Notifications in a Workflow

A mortgage specialist might be entering information about a mortgage in an app. This will create a server-side notification that in turn will be pushed to a mortgage support team. Then, the notification will be received by a team member who will click on it and the "Mortgages" app will be automatically opened. The team member can then review and validate the information entered by the mortgage specialist.

All this becomes possible by assigning an Interop detail routing method to the notification so that the GNS Desktop Manager will call this method (registered by the "Mortgages" app) instead of showing the notification details.

Handler, Popup and Detail Methods

Handler Method

Signature:

bool HandleNotification(Notification notification)

If present, the method will be called by the GNS Desktop Manager when a notification arrives. If the method returns true (meaning "handled"), the notification won't be passed to generic GNS Clients (i.e. UIs).

Popup Method

Signature:

void PopupNotification(Notification notification)

Used to define a method which GNS Clients should call to display the notification as a popup/toast.

Detail Method

Signature:

void ShowNotificationDetails(Notification notification)

Used to define a method which should be called by GNS Clients to display the details of a notification (instead of doing that themselves). It can only be called from a GNS Client (UI/Viewer), either by clicking on the popup (toast) or double-clicking a notification in a notification list/history window.

Actions

A list of actions can be applied to a notification group, notification source or a particular notification instance. An action has a human-readable name, and a method name, which will be called when the action is performed by the user. The method parameters are macro-enabled and can cite the notification properties.

Generic GNS clients will merge the actions defined in the:

  • notification category
  • notification source
  • notification itself

The merging will be done in that order of precedence.

The GNS clients can then present the actions to the user in a suitable way (e.g., as hover buttons or a context menu). When a user clicks on an action, the GNS client will execute the corresponding Interop method. Actions can be optionally grouped in a pattern, which may be used by a GNS client to merge the actions under a menu tree or to group the actions in clusters.

const notificationOptions = {
    title: "Critical Alert",
    body: "Your computer will be restarted in 30 seconds",
    actions: [{
        action: "restart",
        description: "Initiate system restart.",
        title: "Restart"
    },
    {
        action: "postpone",
        description: "Postpone system restart.",
        title: "Postpone"
    }]
};

await glue.notifications.raise(notificationOptions);

Reference

For a complete list of the available Notifications API methods and properties, see the Notifications API Reference Documentation.