Creating Custom Apps

In the settings section, click Custom apps in the column on the right hand side to access the list of own apps that you have created. You can add and edit your own apps and remove existing ones, provided that they are not currently in use.

The way it works is that you write your own Transformation logic in the Javascript programming language to transform the data from your source into one or more "articles". An "article" is much like a news article and can be shown either one at a time upon each new page transition or as a ticker of multiple consecutive articles.

Properties

You start by configuring a number of base properties. Some properties are core to the app and its structure, which means that they cannot be changed by the end user when he/she uses the app in the designer. Other properties can be changed by the end user and the values you configure here will be the app's default values in the designer.

Property Explanation Can be changed by the end user
Web address of data source The web address (URL) of the JSON or XML datasource. XML data is converted to a JSON structure so that it can easily be used in the transformation logic. No
Refresh icon (Re)load the source and display the next article or start running the ticker. N/A
Source online accessible within my network Indicates that the data source sits within you own network (intranet) and cannot be accessed over the public internet. If the playback devices are on the same internal network as the data source they should be able to retrieve the data this way. No
Style Sets the way you like your articles to be displayed:
  • As a single message
  • As a ticker
  • As a vertical ticker
Specific individual article styles can be chosen by the end user when he/she uses the app in the designer.
No
Base font type Sets the base font type from which you can deviate using the fontType formatting function in the transformation logic. Yes
Base text size Sets the base text size. You can use the relativeTextSize formatting function in the transformation logic to make parts of your text smaller or larger. Yes
Base Line spacing (Only if the app is available as "Single article" or "Vertical ticker") Sets the space between you lines. Yes
Base text color Sets the base text color which you can deviate using the textColor formatting function in the transformation logic. Yes
Alignment Set the way you like the text within the element to be aligned: to the left, centered, to the right or justified. Yes
Basic auth. username When the source requires basic authentication, this enables you to set the username. No
Basic auth. password When the source requires basic authentication, this enables you to set the password. No
Authorization header When the source requires an authorization header, this enables you specify this. No

Transformation Logic

Transformation logic is written in the programming language Javascript. There are a number of basic objects and functions available that enable you to format data you get from the data source. Please read the transformation logic guide to learn how to write correct transformation logic.

Input/error inspector

The Input/error inspector is a section that is collapsed by default, but can be opened and closed again by clicking on the title. When opened it will show the latest input that has been retrieved from the data source in a browsable way. This makes it a lot easier to find the right data you need in your transformation logic.

The Errors section will show errors that occur when retrieving data or executing your transformation logic.

Sample

In a "mini page" the rendered output is shown as it would be displayed when the app is used. When you click the Refresh icon, the next formatted article will be shown here or the running ticker with the formatted output.

By default the sample page has a white background, but if you are creating the app with light colors to specifically be used (by default) on a dark background, you can use the Sample background color color picker to display the app against a fitting background.