Syntax for Multiscreen Synchronized Content

Synchronized Content

Syntax for Multiscreen Synchronized Content

The following XML code must be implemented into the index.svg file to create a multiscreen document.

Canvas and Viewbox Concepts

A canvas is the complete area physically described by the SVG index file. It may have any size, but it generally corresponds to the rectangle formed by your video wall and it is usually larger than the size of one of your screens. A viewbox is a subsection of the canvas, normally associated to a single screen. A viewbox can be placed anywhere inside the canvas area.

Example: in a 2x2 video wall, composed of 4 screens, the canvas will be 4 times larger than each of the 4 viewboxes associated to the 4 displays.

Multiscreen Elements

The following elements provide information regarding the canvas size and the viewboxes size and position:

<svg

xmlns="http://www.w3.org/2000/svg"

xmlns:spx="http://www.spinetix.com/namespace/1.0/spx" width="100%" height="100%"

viewBox="xc yc wc hc" > <spx:multiScreen>

<spx:screen viewBox="x y w h" xml:id="screenID"/> </spx:multiScreen>

[...] </svg>

Value definitions:

viewBox="xc yc wc hc" is the space position and full size of the canvas, in pixels, where: xc is the x-axis coordinate of the top-left point of the canvas,

yc is the y-axis coordinate of the top-left point of the canvas, wc is the total width of the canvas,

hc is the total height of the canvas.

<spx:multiScreen> </spx:multiScreen> is the element enabling the multiscreen functionality.

spx:screen viewBox="x y w h" xml:id="screenID"/ is the element representing each of the players that compose the complete canvas. It’s attributes are:

x is the x-axis coordinate of the top-left point of this screen, y is the y-axis coordinate of the top-left point of this screen, w is the width of this screen,

h is the height of this screen,

screenID is the screen identification name of your choice.

Synchronization Elements

Two possible techniques are available to ensure a correct synchronization between content on different screens. These

include the use of a schedule file, or the usage of an in-line beginning time of a document. The predefined multiscreen templates use the inline begin time strategy. This means that synchronization will be automatic when those templates are

used.

The iCalendar (.ics) File

The first option for synchronizing content displayed on multiple screens is using an iCalendar file to contain the multiscreen file. The structure of your project should be as follows:

Create an index.svg with your multiscreen setup. The file should contain the <spx:multiScreen> instructions. Create a iCalendar schedule file.

Add the content designed for multiscreen use into your schedule.

This configuration let you use multiple schedules together with multiscreen content. You can use your custom SVG file or one of the multiscreen templates as your index file.

56	Inspired XPress - Programming Guide