Overview
This document details how to configure a Kramer control unit to trigger content changes on displays running Signagelive.
Prerequisites
In order to follow this guide you will need to have:
A Signagelive network with Web Triggers enabled (contact [email protected] for more information) or see http://build.signagelive.com/api/web-triggers-api/
The Web Triggers API credentials provided to you as part of the Web Triggers onboarding process
An activated Signagelive media player with interrupts published to it
A Kramer control account (register at https://kramercontrol.com/)
The Kramer Control mobile application installed on a mobile device. This can be installed from the Play Store or Apple Store
Optional
We highly recommend using postman to work with the Web Triggers API.
Creating your Kramer Control trigger application
Once registered, log in to the Kramer Control panel
Click the ‘Create a Project’ button and give the project a name, description and location and click Next.
Optionally include a theme provided by Kramer for your app. This will make a large collection of images for backgrounds and common AV related buttons and labels available to you to use in your application. For the purposes of this exercise include the Firefly theme.
Click Create to create the project.
With your new Kramer project created, click on the menu dropdown (3 dots) in the top-right corner of the main panel and click ‘Add Space..’
Give the space a name, description and select the space type. For a simple use case where you are configuring one Kramer unit to operate in one room, you can leave the space type set to the default setting ‘Site’.
Once the Space is created, check the ‘Express Mode’ checkbox in the space properties if you would like to be able to access the application without logging in.
Click the Launch Builder button in the right column to open the application builder for your new project and space.
In the new window click ‘Create Interface’ to create a new interface for your trigger application.
Give the Interface a name (such as UI) and select from the available predefined UI types. These predefined types help set the recommended resolution and aspect ratio based on the device type. Alternatively, select custom to set these options yourself.
Installing and configuring the Signagelive Web Triggers Driver
In the right column select ‘Devices’ and click on the + button to add a new device
Select ‘Add a Device from the database’ and click Next
On the next page filter the list by Manufacturer, searching for Signagelive and select the ‘Signagelive Web Triggers API’ device, and click Add.
In the left-hand column select the Hardware tab and click the + button to add a new Network Gateway
In the New Hardware window, set the name to Signagelive API, select Add Network Gateway and click next
On the next page set the hostname to wbtapi.signagelive.com and click create
Next, drag and drop the Signagelive device from the devices panel on right-hand side into the Gateway Info main panel where it says ‘Drop Compatible device here’
Next we need to edit the Signagelive driver so that we can configure our Web Triggers API credential HTTP Headers:
Select the Signagelive device from the devices panel
Click the ‘Edit device driver’ button (middle button at the top of the panel)
Select Communication, then HTTP and then HTTP Settings
Change the default HTTP Method to POST
Scroll down to Http Headers and replace the X-SIGNAGELIVE-WBI-APP-ID and X-SIGNAGELIVE-WBI-APP-KEY headers with the credentials that you were supplied as part of the Web Triggers onboarding process
Click the Save button at the top of the page to save the changes and then close the window
Finally, configure the Network ID by double clicking the Signagelive device, scrolling down to the Network ID Parameter and selecting Add Alias.
Set the alias as the name of your network and the actual value as your network Id.
Configuring Interrupts, Players and Groups Aliases
For each parameter that you send as part of the message to the Web Triggers API, you are able to define one or more aliases that can be mapped to actual values to make building your UI buttons easier.
If you define just 1 alias for a parameter then that will be used by default and when adding the action as an event you will not have the option to change this. If you create multiple aliases for a parameter, then you can select which you would like to use when creating the action.
In the following instructions we will create 2 web trigger buttons, one that triggers a fire alarm on a group of players and one that triggers a welcome message to two specific players. This next step assumes that our players have interrupts published to them that contain content related to a fire alarm or welcome message.
Getting the interrupt, player and group ids from the Web Triggers API
In order to create the aliases in the next section you will need to know the actual ids for the interrupts, player and groups that you would like to trigger.
In order to do this you should use postman and call the following API methods:
GET /players - returns a list of players that you can trigger content on
GET /groups - returns a list of groups that you can trigger content on
GET /triggers - returns a list of all available triggers and their matching key code
In all cases it is the object ids that you want to use as the actual value when creating an alias
Creating the aliases
Once you know the actual values for the interrupts you want to use and the players and groups you can create the aliases for the Signagelive device.
If the Signagelive device properties are not open double click the Signagelive device in the device panel in the right column to open them
Create two new aliases for Interrupt ID:
Call the first alias Fire Alarm and set the actual value to the id of the trigger that matches the interrupt for the fire alarm content
Call the second alias Welcome Message and set the actual value to the id of the trigger that matches the interrupt for the welcome message content
Create two new aliases for Player ID:
Call the first alias None and set the value to []
Call the second alias Welcome Players and set the value to [playerIdOne, playerIdTwo]
Note: [] represents an array or list of items. When we set None to [] we are passing an empty to list of the trigger message.
Create two new aliases for Group ID:
Call the first alias None and set the value to []
Call the second alias Fire Alarm Group and set the value to [groupId]
Creating the button triggers
Switch back to the UI editor by selecting the UI tab and double-clicking Pages
Switch to the images panel and select Firefly - Background
Hold shift and drag a background image onto the UI canvas. This will automatically set it as the background
Select Firefly - Blank and drag two blank button images onto the canvas
Edit the properties of the buttons and set the Text on the first button to Fire Alarm and the text on the second button to Welcome Message
Select the Device tab and under commands drag the Send Message command onto the Fire Alarm button.
Set the Group ID to Fire Alarm Group, Interrupt ID to Fire Alarm and Player ID to None and Press OK.
Drag the Send Message command onto the Welcome Message button and set the properties so that the Group ID is set to None, the Player ID is set to Welcome Players and the Interrupt is set to Welcome message and press Ok.
Your UI complete with trigger buttons is now setup, so Save the changes using the Save button in the top-right and then click the ‘Publish’ button to publish the Project.
Adding the Kramer Brain Hardware
Select the Hardware tab and click the + button
Give the Kramer unit a name and select Brain for type
Select the model that matches your hardware and click create
Save and publish the changes to your project.
Running the application on your Kramer device and sending your first Web Trigger
To complete this section you will need a mobile device with the Kramer control application installed. You will also need your Kramer Control Unit to be connected to the same local network as your mobile device. and to know the IP Address of your Kramer Control Unit. Both the mobile device and Kramer device should also have internet access.
Make sure that your Kramer Control Unit is connected to the same LAN as your mobile device
Open the Kramer Control application and Sign in
Select your new Project and select Provision to being the process of provisioning the application on the device
The Kramer mobile application should automatically scan your network to find any local, accessible Kramer Control units. If it is unable to find one you may need to enter the IP address of the unit manually. The default is 192.168.0.1. You may find an IP Scanning tool such as Angry IP Scanner useful for determining the IP address of your Kramer Control Unit. Once you have the IP address, enter it and press Connect/Provision
Now Click ‘Control’ And Select the interface you created above. This will load your custom application.
You can not press on your two trigger buttons to trigger the Fire Alarm or Welcome Message interrupts on your Signagelive players.
More detailed information about how to build projects and interfaces and work with the Kramer Control builder can be found on the Kramer training site.