245 lines
12 KiB
HTML
245 lines
12 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<title>OTS Signs Command Center Documentation</title>
|
||
<meta name="viewport" content="width=device-width">
|
||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||
|
||
<!-- favicon -->
|
||
<link href="../img/favicon.ico" rel="shortcut icon"/>
|
||
|
||
<!-- Bootstrap -->
|
||
<link href="../vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen">
|
||
|
||
<!-- Stylesheets -->
|
||
<link href="../manual.css" rel="stylesheet" media="screen">
|
||
|
||
<!-- META -->
|
||
<meta name="keywords" content="digital signage, signage, narrow-casting, ots-signs, open source, agpl, documentation" />
|
||
<meta name="description" content="OTS Signs Command Center is an open source digital signage solution. It supports all main media types and can be interfaced to other sources of data using CSV, Databases or RSS." />
|
||
</head>
|
||
<body data-toc="widgets">
|
||
<!-- Copyright 2020 Xibo Signage Ltd. Part of the Xibo Open Source Digital Signage Solution. Released under the AGPLv3 or later. -->
|
||
<nav id="top-nav" class="navbar navbar-inverse navbar-fixed-top" role="navigation">
|
||
<div class="container">
|
||
<div class="navbar-header">
|
||
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#ss-navbar">
|
||
<span class="sr-only">Toggle navigation</span>
|
||
<span class="icon-bar"></span>
|
||
<span class="icon-bar"></span>
|
||
<span class="icon-bar"></span>
|
||
</button>
|
||
<a href="#" class="navbar-brand">OTS Signs Command Center Documentation</a>
|
||
</div>
|
||
|
||
<div class="collapse navbar-collapse" id="ss-navbar">
|
||
<ul class="nav navbar-nav">
|
||
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</nav>
|
||
|
||
<div class="ss_body container">
|
||
<div class="row">
|
||
<div class="col-md-3">
|
||
<ul id="side-nav" class="nav nav-pills nav-stacked">
|
||
<li><a href="index.html" data-toc-name="getting_started">Getting Started</a></li><li><a href="layouts_editor.html" data-toc-name="layouts">Layouts</a></li><li><a href="media_library.html" data-toc-name="media">Media</a></li><li><a href="media_modules.html" data-toc-name="widgets">Modules</a></li><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
|
||
<html><body><ul>
|
||
<li>
|
||
<a href="media_modules.html">Modules</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_modules_connectors.html">Connectors</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_audio.html">Audio</a>
|
||
</li>
|
||
<li class="active">
|
||
<a href="media_module_calendar.html">Calendar</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_clock.html">Clock</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_countdown.html">Countdown</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_currencies.html">Currencies</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_dashboard.html">Dashboard</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_dataset.html">DataSet</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_embedded.html">Embedded</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_emergency_alerts.html">Emergency Alert</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_flash.html">Flash</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_googletraffic.html">Google Traffic</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_hls.html">HLS</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_htmlpackage.html">HTML Package</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_image.html">Image</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_localvideo.html">Local Video</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_mastodon.html">Mastodon</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_menuboards_category.html">Menu Board Category</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_menuboards_products.html">Menu Board Products</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_national_weather_service.html">National Weather Service</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_notifications.html">Notifications</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_pdf.html">PDF</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_powerpoint.html">PowerPoint</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_shellcommand.html">Shell Command</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_stocks.html">Stocks</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_ticker.html">Ticker</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_video.html">Video</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_video_in.html">Video In</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_weather.html">Weather</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_webpage.html">Webpage</a>
|
||
</li>
|
||
<li>
|
||
<a href="media_module_world_clock.html">World Clock</a>
|
||
</li>
|
||
</ul>
|
||
</body></html>
|
||
<li><a href="scheduling_events.html" data-toc-name="scheduling">Scheduling</a></li><li><a href="displays.html" data-toc-name="displays">Displays</a></li><li><a href="users_administration.html" data-toc-name="users">Users</a></li><li><a href="configure_cms_settings.html" data-toc-name="configure">Configuration and Organisation</a></li><li><a href="troubleshooting.html" data-toc-name="troubleshooting">Troubleshooting</a></li>
|
||
</ul>
|
||
</div>
|
||
<div class="col-md-9" role="main">
|
||
<h1 id="calendar">Calendar <a href="#calendar" class="header-link"><span class="glyphicon glyphicon-link"></span></a></h1>
|
||
<p>Display Calendar events pulled in from an iCal feed anywhere on a Layout using <strong>Elements</strong> or select a <strong>Static Template</strong> to display results in Layouts/Playlists.</p>
|
||
<p>Calendar data is provided by an iCal feed which will feed into configured Elements and Static Templates.</p>
|
||
<blockquote class="tip"><p>Ensure that the ICS feed URL is available to the CMS. If the feed loads in a browser without authentication then the feed should display in the CMS without issue.</p>
|
||
<p>For further information on how to view your Google Calendar in applications, use the following link selecting the <strong>Get your calendar (view only)</strong> option: <a href="https://support.google.com/calendar/answer/37648?hl=en">https://support.google.com/calendar/answer/37648?hl=en</a></p>
|
||
</blockquote>
|
||
<h2 id="calendar_elements">Calendar Elements <a href="#calendar_elements" class="header-link"><span class="glyphicon glyphicon-link"></span></a></h2>
|
||
<p>Elements are available for selection when adding the Calendar Widget to a <a href="layouts_editor.html">Layout</a> to give Users more control over what components of the Calendar Widget to use and where they can be placed.</p>
|
||
<p><img src="img/v4_media_modules_calendar_elements.png" alt="Calendar Elements" /></p>
|
||
<p>Each Element has a set of configuration options in the Properties Panel. Enter the iCal feed to use to return results from the <strong>Configure</strong> tab.</p>
|
||
<p>Control how items should be cycled by specifying a <a href="layouts_editor.html#content-data-slots">Data Slot</a> to use for each of the added Elements. Data Elements can be further complimented by adding Global Elements to add shapes and text which can all be put into an Element Group for easier configuration and positioning.</p>
|
||
<p>Take advantage of Stencils to add a predesigned group of Elements to your Layout.</p>
|
||
<blockquote class="tip"><p>All Elements in the Stencil are treated as ‘one’ when configured and can be easily duplicated from a right click!</p>
|
||
</blockquote>
|
||
<h2 id="calendar_static_templates">Calendar Static Templates <a href="#calendar_static_templates" class="header-link"><span class="glyphicon glyphicon-link"></span></a></h2>
|
||
<p>Static Templates define how returned results should be laid out and styled and are a simple way to show your data using pre-styled templates.</p>
|
||
<p><img src="img/v4_media_modules_calendar_templates.png" alt="Calendar Elements" /></p>
|
||
<p>Templates can be configured to make changes to the design appearance using a range of options in the Properties Panel. Enter an iCal to return results from the <strong>Configure</strong> tab for each Template added to the Layout/Playlist.</p>
|
||
<h2 id="overview">Overview <a href="#overview" class="header-link"><span class="glyphicon glyphicon-link"></span></a></h2>
|
||
<ul>
|
||
<li>Return events within a specified date range.</li>
|
||
<li>Options to exclude all day and current events from the feed so they won’t be shown.</li>
|
||
<li>Use event and calendar timezones.</li>
|
||
<li>Set duration per item.</li>
|
||
<li>Specify how many events to display.</li>
|
||
<li>Execute a Web Hook trigger when certain conditions are detected.</li>
|
||
<li>Data for this media is cached by the Players for off-line playback.</li>
|
||
</ul>
|
||
<h3>Web Hook Triggers</h3>
|
||
<p>Trigger a Web Hook <a href="layouts_interactive_actions.html">Action</a> when there is a <strong>Current Event</strong> or <strong>No Event</strong> from the Trigger tab.</p>
|
||
<blockquote class="tip"><p><strong>Example Scenario</strong>:</p>
|
||
<p>A user has a meeting room calendar configured using the Calendar Widget on a Layout which shows the current occupancy for a room and would like to change LED lights to show when vacant or in use.</p>
|
||
<ul>
|
||
<li>The user would first need to create <a href="displays_command_functionality.html#content-shell-commands">Shell Commands</a> which issued commands to an LED IoT device or the inbuilt LEDS’s on some of the Philips Commercial Displays.</li>
|
||
<li>Next an <a href="layouts_interactive_actions.html">Interactive Action</a> would need to be defined on the <strong>Layout</strong>, which would <strong>Navigate to Widget</strong> and <strong>Target the Screen</strong>, with the <a href="media_module_shellcommand.html">Shell Command Widget.</a>
|
||
</li>
|
||
<li>From the <strong>Trigger</strong> tab, assign the code’s to trigger the <strong>Web Hooks</strong> for <strong>Current Event</strong> and <strong>No Event</strong>.</li>
|
||
</ul>
|
||
</blockquote>
|
||
|
||
</div>
|
||
</div>
|
||
</div> <!-- container-->
|
||
<footer class="ss_footer" role="contentinfo">
|
||
<div class="container">
|
||
<div class="pull-right">
|
||
<img class="img-responsive logo" src="../img/logo.png" alt="OTS Signs Command Center" />
|
||
</div>
|
||
|
||
<p class="ss_back_to_top">Back to Top</p>
|
||
|
||
<p class="ss_footer_links">Currently v4</p>
|
||
|
||
<p class="ss_languages"><a href="../en/index.html">en</a></p>
|
||
</div>
|
||
</footer>
|
||
|
||
<!-- JavaScript -->
|
||
<script src="../vendor/jquery/jquery.min.js"></script>
|
||
<script src="../vendor/bootstrap/js/bootstrap.min.js"></script>
|
||
<script type="text/javascript">
|
||
$(document).ready(function() {
|
||
$(".ss-sidebar .list-group li").addClass("list-group-item");
|
||
$(".ss_body img").addClass("img-thumbnail");
|
||
$(".ss_body table").addClass("table");
|
||
|
||
// Set the selected page based on the TOC name
|
||
// Mark the appropriate top nav element as the selected page
|
||
$("#top-nav a").each(function() {
|
||
if ($(this).data().tocName == $("body").data().toc)
|
||
$(this).parent().addClass("active");
|
||
});
|
||
|
||
$(".ss_back_to_top").click(function() {
|
||
$('html, body').animate({scrollTop : 0},800);
|
||
});
|
||
|
||
if (inIframe()) {
|
||
console.log("In Frame");
|
||
$("#top-nav").css("display", "none");
|
||
$(".ss-sidebar").parent().css("display", "none");
|
||
}
|
||
});
|
||
|
||
function inIframe () {
|
||
try {
|
||
return window.self !== window.top;
|
||
} catch (e) {
|
||
return true;
|
||
}
|
||
}
|
||
</script>
|
||
</body>
|
||
</html>
|