How do I write a template for the publication website?

This guide explains how you can write a template for the publication website and describes the available expressions.

A template for the publication website is a single HTML page which uses the Handlebars templating language (https://handlebarsjs.com/) to control the output based on the available expressions.

The Restreamer default template is available at https://github.com/datarhei/restreamer-ui/blob/main/public/_playersite/index.html.

Expressions

The available Handlebars expressions are:

Expression	Type	Description
player	string	Currently this value is always videojs.
playersite	boolean	Whether the playersite is enabled.
title	string	The sitename of the playersite as defined in the General section.
share	boolean	Whether to enable share buttons.
support	boolean	Whether to display a link to the datarhei project website.
chromecast	boolean	Whether to enable chromecast in the player.
airplay	boolean	Whether to enable airplay in the player.
url	string	The URL to the playersite.
textcolor_title	string	Text color for titles as defined in the Design section.
textcolor_default	string	Default text color as defined in the Design section.
textcolor_link	string	Link color as defined in the Design section.
textcolor_link_hover	string	Link :hover color as defined in the Design section.
bgcolor_header	string	Background color for the header as defined in the Design section.
bgcolor_selected	string	Background color for selected items as defined in the Design section.
bgcolor_unselected	string	Background color for unselected items as defined in the Design section.
bgcolor_default	string	Default background color as defined in the Design section.
hrcolor	string	Separator color as defined in the Design section (linecolor).
bgimage_url	string	URL of the background image, empty if no background image has been uploaded.
imprint_html	string	Imprint HTML content as defined in the Notes section.
terms_html	string	Terms HTML content as defined in the Notes section.
inject1	string	HTML content for the extended header as defined in the Code injection section.
inject2	string	HTML content for the extended channel list as defined in the Code injection section.
inject3	string	HTML content for the extended content area as defined in the Code injection section.
inject4	string	HTML content for the extended footer as defined in the Code injection section.
channels	array	List of all available channels, i.e. channel objects. See below.
channel_id	string	ID of the currently selected (or default) channel.
channel_name	string	Name of the currently selected (or default) channel.
channel_description	string	Description of the currently selected (or default) channel.
channel_descriptionhtml	string	Description of the currently selected (or default) channel as HTML.
channel_creator_name	string	Name of the creator of the currently selected (or default) channel.
channel_creator_description	string	Description of the creator of the currently selected (or default) channel.
channel_creator_description_html	string	Description of the creator of the currently selected (or default) channel as HTML.
channel_license	string	License of the currently selected (or default) channel.
channel_poster	string	URL of the poster (snapshot) image of the currently selected (or default) channel.
channel_width	number	The witdh of the player, currently always 640.
channel_height	number	The height of the player, currently always 360.

Channel object

Expression	Type	Description
id	string	Full channel ID, e.g. restreamer-ui:ingest:[UUID]
channelid	string	UUID of the channel.
name	string	Name of the channel.
available	boolean	Whether the channel is available, i.e. connected.
thumbnail	string	URL to the latest snapshot of that channel, empty if not available.
egresses	array(string)	List of egress UUIDs.

Many of those expressions are for manipulating the default template. If you write your own template you are not required to use all expressions. Pick the ones that are suitable for your needs.

The template is used to create the /index.html for the default channel and for each channel a /playersite_[channelid].html. The [channelid] will be replaced by the respective ID of that channel. This can be used to link to the rendered template of an individual channel.

Handlebars

The template language "Handlebars" is used for the publication website templates. If you are new to Handlebars, please check out their guide (https://handlebarsjs.com/guide/) in order to get up to speed.

There are two additional helper defined:

ifEquals

This helper lets you check if two values are equal, e.g.

{{#ifEquals player "videojs"}}
   ...
{{/ifEquals}}

ifnoteq

This helper lets you check if two values are not equal, e.g.

{{#ifnoteq channel_license "none"}}
   ...
{{/ifnoteq}}