Module: display

appboy.display is the public interface for the UI portions of Braze's Web SDK. It is only available in https://js.appboycdn.com/web-sdk/2.4/appboy.min.js and is stripped from the more minimal https://js.appboycdn.com/web-sdk/2.4/appboy.core.min.js.

Methods

<static> automaticallyShowNewInAppMessages() → {string}

Automatically display new in-app messages when they come in from the server.

Returns:

The identifier of the subscription created. This can be passed to removeSubscription to cancel the subscription.

Type
string

<static> destroyFeed()

Destroy any Braze news feed currently showing. This method will appropriately clean up any retained resources and also display the hiding animation, and so should be used instead of manually removing feed html from the DOM.

<static> hideContentCards()

Hide any Braze content cards currently showing. This method will appropriately clean up any retained resources and also display the hiding animation, and so should be used instead of manually removing content cards HTML from the DOM.

<static> showContentCards(parentNode, filterFunction)

Display the user's content cards.

Parameters:
Name Type Argument Description
parentNode Element <optional>

The HTML node to render the content cards into. If null/undefined, the content cards will be rendered in fixed position over the right-hand side of the page and appended to the <body> node. If the parent node already has a Braze content cards view as a direct descendant, the existing content cards will be replaced.

filterFunction function <optional>

A filter/sort function for cards displayed in this view. Invoked with the array of ab.Card objects, sorted by {pinned, date}. Expected to return an array of sorted ab.Card objects to render for this user. If omitted, all cards will be displayed.

<static> showFeed(parentNode, cards, allowedCategories)

Display the user's news feed.

Parameters:
Name Type Argument Description
parentNode Element <optional>

The HTML node to render the news feed into. If null/undefined, the feed will be rendered in fixed position over the right-hand side of the page and appended to the <body> node. If the parent node already has an Braze news feed as a direct descendant, the existing feed will be replaced.

cards Array <optional>

A static set of cards to display. Each item in this Array should be a ab.Card descendant. If this parameter is null/undefined, all unexpired cards from the last news feed refresh will be used automatically, a feed refresh will be kicked off automatically if the cached cards are more than 1 minute old, and the feed will automatically update when new cards are received while it is still showing. If you provide an explicit set of cards by using this parameter, no action will be taken when new cards are received, and you must subscribe to feed updates yourself with appboy.subscribeToFeedUpdates and request updates with appboy.requestFeedRefresh if you want to update this feed with new cards.

allowedCategories Array <optional>

A set of categories to filter cards to. Each item in this Array should be a ab.Card.CardCategory. If omitted, all cards will be displayed.

<static> showInAppMessage(inAppMessage, parentNode, onDisplayCallback) → {boolean}

Display a given in-app message.

Parameters:
Name Type Argument Description
inAppMessage ab.InAppMessage | ab.ControlMessage

The message to display.

parentNode Element <optional>

The HTML node to render the in-app message into. If null/undefined, the message will be rendered appended within the <body> node.

onDisplayCallback function <optional>

Optional callback to invoke once the message is on the screen.

Returns:

Whether or not the message was displayed (or, in the case of control messages, logged to Braze servers).

Type
boolean

<static> toggleContentCards(parentNode, filterFunction)

Toggle the display of Braze content cards, showing them if they are not shown, and hiding them if they are.

Parameters:
Name Type Argument Description
parentNode Element <optional>

The HTML node to render the content cards into. If null/undefined, the content cards will be rendered in fixed position over the right-hand side of the page and appended to the <body> node. If the parent node already has a Braze content cards view as a direct descendant, the existing content cards will be replaced.

filterFunction function <optional>

A filter/sort function for cards displayed in this view. Invoked with the array of ab.Card objects, sorted by {pinned, date}. Expected to return an array of sorted ab.Card objects to render for this user. If omitted, all cards will be displayed.

<static> toggleFeed(parentNode, cards, allowedCategories)

Toggle the Braze news feed, creating it if it does not exist, and destroying it if it does.

Parameters:
Name Type Argument Description
parentNode Element <optional>

The HTML node to render the news feed into. If null/undefined, the feed will be rendered in fixed position over the right-hand side of the page and appended to the <body> node. If the parent node already has an Braze news feed as a direct descendant, the existing feed will be replaced.

cards Array <optional>

A static set of cards to display. Each item in this Array should be a ab.Card descendant. If this parameter is null/undefined, all unexpired cards from the last news feed refresh will be used automatically, a feed refresh will be kicked off automatically if the cached cards are more than 1 minute old, and the feed will automatically update when new cards are received while it is still showing. If you provide an explicit set of cards by using this parameter, no action will be taken when new cards are received, and you must subscribe to feed updates yourself with appboy.subscribeToFeedUpdates and request updates with appboy.requestFeedRefresh if you want to update this feed with new cards.

allowedCategories Array <optional>

A set of categories to filter cards to. Each item in this Array should be a ab.Card.CardCategory. If omitted, all cards will be displayed.