Nested compositions and infobar creation

The description is valid for version 1.7.50 and higher.

.

Info-bar is a multilayer graphic composition designed to display a large amount of text and symbolic information: currency rates, weather, news strings, etc. A typical example of an info-bar is shown in the picture.

|

To form such compositions, the technology of reading data from external sources is used: txt- or xml-files, or RSS-resources. To display text and symbols in a certain order the SL NEO platform uses the technology of “nested compositions” - a composition with a certain element (a news block, for example) is formed separately and then inserted into the general composition of the InfoBar.

Basic elements of the info-bar

|

Substrate. Typically, this is a pre-created static graphics file or 32-bit video. Before creating a composition, the file must be imported into the server's media base. For our example we will use a static png file which can be downloaded at this link.

Info Blocks. The composition of the InfoBar can contain an unlimited number of information blocks, which are displayed independently of each other. In our example, there are 5 of them: News - news block, Weather - weather block, Currency - currency rates block and two “crawls” - Crawl 1 and Crawl 2.

Standard text layers. In our example there are 3 of them - NEWS, LIVE and www.skylark.tv.

Clock and date are text objects formed in a graphical editor and displaying the system time of the server.

Creation of general design layout of the info-bar

Initially it is necessary to create a graphic composition containing all elements of the InfoBar without any parametrization and effects. To create a composition you need to use the built-in graphic editor of the application Air Manager, it opens by right-clicking in the Media Browser window.

Since the duration of the song cannot be determined, the duration is set to “infinite”, for this purpose in the General tab in the Duration field you must specify –:–:–:–. The Lead Out parameter is set to 00:00:00:00.

In the Elements tab it is necessary to create a certain number of layers. For the graphical carpet pad it is necessary to use the PIP layer type, for almost all text objects, except the crawl lines - Text Area layers, for displaying the current date and time it is necessary to choose the Counter type. For the Crawl 1 and Crawl 2 crawls, it is necessary to select the Text Feed layer type.

Tags: text color management, inserting pictures into text

The SL NO software allows you to control the color of text and background in a text line and to insert static images into text lines. Tags are used for this purpose. A tag is a special “container” for changing text parameters, e.g. - the text shown in the picture is typed as follows: <?Canada?> Canada Dollar 1.0187<?Up?><?fg:#00FF00?>+0.2352% where Canada and Up are the clips in the server base with the images of the Canadian flag and the green arrow, fg:#00FF00 is the parameter that sets the color of the text located after the tag, in RGB format.

As with HTML, text color is specified by numbers in hexadecimal code, in the form #rrggbb, where r, g and b stand for red, green and blue, respectively. For each color set the hexadecimal value of 00 to FF, which corresponds to a range of 0 to 255 in decimal notation. These values are then combined into a single number preceded by a #.

Static images inserted into the text with tags are scaled automatically to fit the font size. Large images should not be used in the text. Download a collection of static files with flags and icons of currencies can be on this files/infobar/Currency.zip link, after downloading the files should be imported into the media base of the server.

A collection of static and animated symbols displaying weather information can be downloaded at link, once downloaded the files should be imported into the server media base.

When the editing is finished, the composition should look like the following (see figure). You can download the finished composition by link], after downloading the file should be imported into the base, for the correct display of the composition, the file with the backing and files with flags, arrows and weather symbols should also be in the server database.

|

Creating separate "working" compositions for information blocks

Since the style of displaying each information block is individual, the easiest and most convenient way is to create a separate composition for each block. In the so-called “working” composition will be worked out for each text element - the duration, effects for the beginning and end of the element, then the “working” composition will be inserted into the main info-bar composition.

Composition for News block

Let's define the concept of the News block - it will contain a headline (TOP WORLD STORIES in the design-mockup), displayed throughout the block and 6 successive news sentences. The duration of each sentence is 5 seconds, the duration of the whole block is 30 seconds. Then according to the same scheme the next 30-second block should be displayed, for example BUSINESS NEWS HEADLINES, then TECH NEWS HEADLINES and so on, the number of blocks is not limited, after the end of the last block the cycle must repeat. The information for each block will be read from text files according to the scheme - 1 block - 1 txt-file, as many text files in the folder, so many blocks. Since the SL NEO platform concept involves reading individual lines from a txt file, separated by blank lines, you can put all the text of a news block in one txt file, including the header (see the figure with the line numbers).

|

To create a “working” composition for the News block you can do the following: create a copy of the composition with the design layout in the Media Browser window, rename the new clip to Main_News, for example, switch to the editing mode and delete all the elements not related to the News block from the Main_News composition - this will preserve the design and location of text elements of the block. After this operation, 2 elements - TOP WS Text (header) and WS Text 1 (text) should remain.

Then you need to set up types of transitions for the elements, copy the element containing text (WS Text 1) 5 times, set duration to 5 seconds for each element, shift the elements relative to each other in time and set duration of the whole composition to 30 seconds. Download an example composition for the News block and see the settings at this link, after downloading the file should be imported into the server database.

Now you can move on to setting up the RSS feed and the parameterization settings for displaying the text for the News block.

Setting up the SL NEO RSS feed to display the News block

The procedure of RSS Feeder configuration is as follows:

STEP 1: Add the RSS module to the system. Stop server components with Stop Server command from taskbar, then right click on red SkyLark NeoVid icon in tray and choose Configure Server Components item. In the settings window, add RSS Feeder item to the right field from Available components field. Launch server software - right click on the SkyLark NeoVid icon in the taskbar - Start Server command.

STEP 2. Set up the RSS module. The settings will be made from the Administrator Control Panel. You can enter console locally from the server by clicking right mouse button on blue SkyLark NeoVid icon in the Windows taskbar) or from any computer on the network by the address http://server_ip:7901. You should log in to the management console as an administrator.

After logging into the management console, select Manage in the console menu. Next - select the RSS Feeds tab, and in the Feed 1 window select Service Enabled. Then select Source folders - Add. In the Edit Source Folders window that opens, configure the RSS resource.

One of possible implementation of News block is consecutive reading of text information from txt-files, located in one folder. The text could be read and displayed “in a ring”, as you manually delete txt-files from the folder or add new ones, the information in the output of the RSS feed would be updated.

Choose the type of resource - Type from the list. Choices:

Item List - create one RSS feed for one folder of txt files, Channel List: Each txt file will create its own RSS channel. Channel List should be selected for the news block.

We shall indicate the resource name in the Name field, indicate the path to a folder with txt-files in the Folder field and select UTF-8 encoding; at that, all source txt-files should have such encoding.

Option Scrolling is needed to delete .txt files after displaying them, it should not be on for repeated cyclic repetition of text. Channel Description - none.

Query type - parameter allowing you to choose the type of text scanning:

Whole File As Is - display all text in file as is, Empty Line Separated - display text line by line, with lines in file separated by empty line (see figure with text), Regular Expression - use regular expressions to extract text fragments, rules are set in Query fields, XPath - use the same name technology to extract text from xml files.

To display the text in the News block, select Empty Line Separated, press OK, then, at the top of the control console window, press Apply Changes. This completes the configuration of the News server part of the software.

Settings in the News graphic composition to receive text from the RSS module

Go back to the “working composition” for the News block and open it in the editor. Since the duration of the composition is specified in 30 seconds, the Duration field should specify 00:00:30:00. The Lead Out parameter should be set to 00:00:00:00.

For composition it is necessary to specify RSS data source, for this purpose in tab General in field Data Feeds it is necessary to specify resource address in format http://server_ip:7901/rss/RSS_name, where RSS_name - name of service specified when setting up RSS server in management console of server (in our example - RSS_1).

The elements (layers, objects) of the Text Area graphic composition will be used to display the RSS text. The parameters of each Text Area text object are set in the Elements tab.

Consider configuring the text objects contained in the composition. You can download an example composition for the News block from this link.

Header is a text layer that contains the header for the news block. In the Sh (Show) and Hd (Hide) fields the values are 00:00:00 - it means that the text is displayed for the whole duration of the composition. In the Scrolling field you can set the type of scrolling text Tele - the text will appear in teletype.

In the Parametrization field you must set the text parametrization: Type - the type of text parametrization:

Disable - parametrization is disabled, the text typed in the Preview text window will be displayed, External - text parametrization mode from playlist lines, RSS - parametrization mode from RSS-feed, it is necessary to set it.

In the Type: Feed: field, select Feed_1 (in our example, it forms RSS with texts for news block), as a data source, in the Channel: Selector: field set Feed, in the Item: Selector: field select Index with value 0. This means that the very first line of the txt-file will be read for header (counting of lines starts from zero).

Main Text 1 is the text layer containing the text with news #1. In the Sh (Show) field the value is 00:00:30:00, since the first news is displayed with the beginning of the composition, the Hd (Hide) value is 00:00:06:00. In the Scrolling field you can set the type of scrolling text Tele - the text will appear teletype.

The text parameterization is to be set in the Parametrisation field similarly to the settings done earlier for the Header layer except the Item Selector field - it is necessary to select Index with value 1 which means that the second line of the txt-file will be read for this object.

Objects/Layers of Main Text 2…5 are set up in the same way (see the News composition example). If necessary, you can set text appearing/removing effects using keypoints (see example of News composition with effects).

When editing is complete, the graphic clip is saved using the File/Save command in the Top-menu of the Air Manager graphic editor. After that, you can view the clip in the File Monitor window and check the text information from txt files.

Configuring RSS Server of SL NEO Platform to Display Weather, Currency, Crawl 1 and Crawl 2 Blocks

Let's add 4 more RSS modules to the system. To do that, stop the server components with Stop Server command, select Configure Server Components and add 4 RSS Feeder items to the right field. Start the server software and configure 4 RSS Feeder items from the control panel.

We configure RSS Feeder settings for Weather and Currency blocks similarly to News block. Select Channel List as resource type and Whole File As Is mode of display for Crawl 1 and Crawl 2 tickers.

Checking RSS server

Checking is done with a web-browser (preferably Mozilla Firefox). Enter the address in the format http://server_ip:7901/rss, press Enter - then a list of active RSS resources should be displayed. After selecting the desired resource, make sure that it contains the necessary textual information.

|

Settings in the "working" Weather graphic composition

|

Our example will use animated and static icons with weather symbols imported into the server database. Let's define how the current weather information will be read and displayed: Phase 1: a parameterizable weather icon of the state of the atmosphere (sun, cloud, etc.) and a parameterizable temperature value next to it; phase 2: a parameterizable weather icon of wind direction and a parameterizable value of wind speed next to it; Phase 3: the humidity icon (non-parameterizable) and the corresponding value next to it; phase 4: the atmospheric pressure icon (non-parameterizable) and the corresponding value next to it. The phases will change by mixes in a cycle, the total duration of this composition is 20 seconds.

One of the parameterization options is to read the data from a text file (see figure on the left). Since the SL NEO platform allows you to parameterize not only text but also PIP objects, including video, you can specify the names of weather symbols stored in the server database in the txt-file and they will be displayed in the composition.

The first word Sun in the txt file is the Title of 32-bit animated Sun icon, +33 is the text which will be shown next to it, wind-dart-white-5 is the Title of 32-bit arrow icon, 18mph is the text which will be shown next to it. 60% and 760 mm are the texts that will be shown next to the humidity and pressure icons.

An example of the Weather composition can be downloaded at this link, after downloading the file you need to import it into the media base of the server. In the example, the settings for transitions, text parametrization and weather icons are made.

Settings in the "working" Currency graphic composition

In this example we will use the static icons with the currency symbols imported into the server's database. Let us define the way the information about currency rates and stock quotes will be read and displayed: there are 4 fields lined up in one line where the data is displayed simultaneously. We will define the composition duration as 5 seconds - after displaying 4 values the cycle will repeat and display the next 4 values.

One of the parameterization options is to read data from text files, (see picture to the left) according to the scheme - one file = one block, how many txt files in the folder, so many information blocks in the loop. It is possible to indicate in a line of txt-file together with the text in the form of tags names of clips - icons of currencies stored in a database of a server for their display together with the text.

When using tags, you can work with static graphical objects only. Methods of working with tags are described in detail above in section “Tags: color management of text, inserting pictures into text.

The example of Currency composition can be downloaded at this link, after downloading the file you need to import it into the media base of the server. In the example the settings for transitions and text parametrization are made.

Settings in Crawl 1 and Crawl2 "working" compositions

To display the RSS text of the “crawl” is used an element (layer) of the graphical composition Text Feed. In addition to normal parameters that define properties of any text layer (font, size, color, etc.), the Text Feed element has parameters that define how long the text message should be displayed, the intervals and pauses between messages.

Example Crawl1 composition can be downloaded at this link, after downloading the file you need to import it into the server media base. The Crawl2 composition is created similarly to Crawl1.

Final step: placing the "work songs" into the final composition of the info-bar

In the Media Browser window, create a copy of the composition with the design, rename the new clip to Info_Bar_Main_1, for example, switch to edit mode and delete all elements from the composition Info_Bar_Main_1 that require parameterization. Next, put all the previously configured “working” compositions into the final composition. This can be done in 2 ways - by dragging the clip into the editor from the Media Browser window or by pressing the PIP layer button in the editor and sequentially adding all the “working compositions”.

An example of the final composition of the info-bar can be downloaded from link.

Since only the Title of the “working song” and its duration are loaded into the final song when moving, after each editing of the “working” song, the procedure of reinserting it into the final song is not required (if the duration of the “working” song is kept after editing).

|

When editing is complete, the graphic clip is saved using the File/Save command in the Top-menu of the Air Manager graphic editor. After that the clip can be viewed in the File Monitor window and put into the playlist line of the corresponding Broadcast window forming the graphic layer, or included into the list of secondary events, or adjusted for playback in the Graphics Clip Layer (see description).

Note: All graphics offered for download have the IP address of the local RSS server listed as 127.0.0.1 in the General tab. To view RSS data in compositions on network workstations, in the Data Feeds field, specify the actual IP address of the server where the RSS data source operates.

.