The Control API provides you with the capability to change images within your graphics package when you are on a live operation. The following steps outline the process of changing images using the Control API:
Host Images
Using the Flowics Assets Library allows you to host images and other media files that can be used within your Graphics and accessed via the API. To learn how to host an image in the Flowics Assets Library, click here.
Generate a graphics token
To make use of the Control APIs, it is imperative to generate a token for the Graphics Package that requires control. Detailed instructions on generating the token can be found in this article.
Generate an Integration ID
Using the Graphics editor, you can generate an Integration ID for the Image element you want to control by following the steps below:
Select the Image element from the Graphics tree.
On the inspector (right-hand side of the Graphics editor), click the "Show on Remote Control" icon to enable the Control API ID field.
Add an identifier for the Image element, it can be any keyword.
Getting the overlay ID
To add a Custom ID to an overlay:
(1) Select the overlay.
(2) In the inspector on the right side, click # No ID, and add the ID.
Every time a new Control API ID is added or edited in the Graphics Editor, it is necessary to publish the Graphics Package. Subsequently, in the Rundown Control/Remote Control section, click on 'Update' to see the changes.
Update the Image
To update your image using the Control API, use the following curl request:
curl --request PATCH "https://api.flowics.com/graphics/TOKEN-GRAPHICS/control/overlays" --header "Content-Type: application/json" --data-raw "[{\"id\": \"OVERLAY-ID\","controls\": {\"CONTROL-API-ID\": {\"value\": \"url\",\"url\":\"URL-OF-YOUR-IMAGE\"}}}]
In the above request, replace the following placeholders with your own values:
KEY | DESCRIPTION | TYPE |
TOKEN-GRAPHICS | This is the identifier of your graphics package. | String |
Overlay ID | This is the identifier of the overlay that contains the image element you wish to change. | String |
CONTROL-API-ID | This is the identifier you created for the text element. | String |
URL-OF-YOUR-IMAGE | This is the URL of the image hosted in the Assets Library. | String |