Data Sharing Between Apps
Channels
JavaScript
Adding Channels to Your App
To add the Channel Selector to your window, set allowChannels
to true
in your application configuration file under the details
top-level key:
{
"title": "Client List 🔗",
"type": "window",
"name": "channelsclientlist",
"icon": "https://dev-enterprise-demos.tick42.com/resources/icons/clients.ico",
"details": {
"url": "https://dev-enterprise-demos.tick42.com/client-list-portfolio-contact/#/clientlist",
"mode": "tab",
"allowChannels": true
}
}
The Channels API is disabled by default. To enable it, set the channels
property of the configuration object to true
when initializing the Glue42 library:
const config = { channels: true };
window.glue = await Glue(config);
The Channels API can be accessed through the glue.channels
object.
See the JavaScript Channels example on GitHub.
Current Channel
To get the name of the Channel your application is currently on, use the my()
method:
const myChannel = glue.channels.my();
All Channels
To get a list of all Channel names, use the all()
method:
const channelNames = await glue.channels.all();
Joining or Leaving a Channel
To make your application join a Channel programmatically, use the join()
method and specify the name of the Channel to join:
await glue.channels.join("Red");
To leave the Channel your application is currently on, use the leave()
method:
await glue.channels.leave();
Channel Events
If you want to monitor how your app moves between Channels, subscribe for updates with the onChanged()
method:
const channelChangedHandler = (newChannel) => {
if (newChannel) {
// Handle the case where you have switched to another Channel.
} else {
// Handle the case where your app is not joined to any Channel
// (e.g., the user has deselected the current Channel).
};
};
glue.channels.onChanged(channelChangedHandler);
Subscribing for Data
To track the data in the current Channel, use the subscribe()
method:
const channelUpdatesHandler = (data, channelInfo) => {
// The callback will be invoked each time the data is updated.
};
// Subscribe for updates from the Channel your application is currently on.
glue.channels.subscribe(channelUpdatesHandler);
The callback receives :
data
- the current data from the Channel;channelInfo
- information about the Channel you are currently on;
The callback will be invoked in three cases:
- the
data
of the Channel you are currently on is updated; - the user has switched the Channel and you are receiving a snapshot of the new Channel
data
; - your app is not joined to a Channel anymore (e.g., the user has deselected the current Channel). In this case, both
data
andchannelInfo
will beundefined
;
To subscribe for updates from a specific Channel, use the subscribeFor()
method:
const channelName = "Green";
const channelUpdatesHandler = (data, channelInfo) => {
// The callback will be invoked each time the data is updated.
};
await glue.channels.subscribeFor(channelName, channelUpdatesHandler);
The subscribeFor()
method accepts a Channel name as a first parameter and a callback to handle Channel data updates.
Use the unsubscribe function returned by subscribe()
and subscribeFor()
to stop tracking updates of the Channel data.
Publishing Data
To update the context of the Channel, use publish()
. The publish()
method accepts two parameters - data to publish (required) and an optional Channel ID specifying which Channel context to update. If you do not specify a Channel ID, the current Channel will be updated.
Updating the current Channel:
const data = { RIC: "VOD.L" };
await glue.channels.publish(data);
Updating a specific Channel:
const data = { RIC: "VOD.L" };
const channelName = "Green";
await glue.channels.publish(data, channelName);
Note that a Channel may contain multiple data structures, e.g. RIC
and clientId
. When executing the code above, only the RIC
field will be updated, leaving the other fields of the context unchanged.
The publish()
method will throw an exception, if you are not on a Channel and try to publish data.
Retrieving Channel Context
To get the context of a Channel, use the get()
method which accepts a Channel name as a required parameter:
const data = await glue.channels.get("Green");
To get a list of the contexts of all Channels, use the list()
method:
const channelContexts = await glue.channels.list();