124 lines
4.8 KiB
XML
124 lines
4.8 KiB
XML
<!--
|
|
~ Copyright (C) 2023 Xibo Signage Ltd
|
|
~
|
|
~ Xibo - Digital Signage - https://xibosignage.com
|
|
~
|
|
~ This file is part of Xibo.
|
|
~
|
|
~ Xibo is free software: you can redistribute it and/or modify
|
|
~ it under the terms of the GNU Affero General Public License as published by
|
|
~ the Free Software Foundation, either version 3 of the License, or
|
|
~ any later version.
|
|
~
|
|
~ Xibo is distributed in the hope that it will be useful,
|
|
~ but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
~ MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
~ GNU Affero General Public License for more details.
|
|
~
|
|
~ You should have received a copy of the GNU Affero General Public License
|
|
~ along with Xibo. If not, see <http://www.gnu.org/licenses/>.
|
|
-->
|
|
<module>
|
|
<id>core-clock-digital</id>
|
|
<name>Clock - Digital</name>
|
|
<author>Core</author>
|
|
<description>Digital Clock</description>
|
|
<icon>fa fa-clock-o</icon>
|
|
<class></class>
|
|
<compatibilityClass>\Xibo\Widget\Compatibility\ClockWidgetCompatibility</compatibilityClass>
|
|
<type>clock-digital</type>
|
|
<group id="clock" icon="fa fa-clock">Clock</group>
|
|
<legacyType condition="clockTypeId==2">clock</legacyType>
|
|
<dataType></dataType>
|
|
<schemaVersion>2</schemaVersion>
|
|
<assignable>1</assignable>
|
|
<regionSpecific>1</regionSpecific>
|
|
<renderAs>html</renderAs>
|
|
<defaultDuration>10</defaultDuration>
|
|
<thumbnail>clock-digital-thumb</thumbnail>
|
|
<startWidth>300</startWidth>
|
|
<startHeight>150</startHeight>
|
|
<settings></settings>
|
|
<properties>
|
|
<property type="message">
|
|
<title>Enter a format for the Digital Clock e.g. [HH:mm] or [DD/MM/YYYY]. See the manual for more information.</title>
|
|
</property>
|
|
<property id="format" type="richText" allowLibraryRefs="true">
|
|
<title>Enter text in the box below.</title>
|
|
<default><![CDATA[
|
|
<span style="font-size: 48px; color:#1c1c1c;">[HH:mm:ss]</span>
|
|
]]></default>
|
|
</property>
|
|
<property id="dateFormatSnippets" type="snippet" mode="options" target="format">
|
|
<title>Date Formats</title>
|
|
<helpText>Choose from a preset date format</helpText>
|
|
<options>
|
|
<option name="HH:mm">Time only</option>
|
|
<option name="DD/MM/YYYY">Day/Month/Year</option>
|
|
<option name="LT">Localised - Time</option>
|
|
<option name="LTS">Localised - Time with seconds</option>
|
|
<option name="L">Localised - Month numeral, day of month, year</option>
|
|
<option name="LL">Localised - Month name, day of month, year</option>
|
|
<option name="LLL">Localised - Month name, day of month, year, time</option>
|
|
<option name="LLLL">Localised - Month name, day of month, day of week, year, time</option>
|
|
</options>
|
|
</property>
|
|
<property id="lang" type="languageSelector" variant="momentLocales">
|
|
<title>Language</title>
|
|
<helpText>Select the language you would like to use.</helpText>
|
|
</property>
|
|
<property id="offset" type="number">
|
|
<title>Offset</title>
|
|
<helpText>The offset in minutes that should be applied to the current time.</helpText>
|
|
<default></default>
|
|
</property>
|
|
</properties>
|
|
<preview></preview>
|
|
<onInitialize><![CDATA[
|
|
// Set moment locale
|
|
moment.locale(properties.lang || globalOptions.locale);
|
|
|
|
// Parse any Clock elements
|
|
// Use regex to out the bit between the [] brackets and use that as the format mask for moment.
|
|
var text = properties.format;
|
|
var regex = /\[.*?\]/g;
|
|
|
|
properties.format = text.replace(regex, function (match) {
|
|
return '<span class="clock" format="' + match.replace('[', '').replace(']', '') + '"></span>';
|
|
});
|
|
|
|
// Replace content with the parsed text
|
|
$(target).find('#content').html(properties.format);
|
|
|
|
// Create updateClock method and save to the interactive controller
|
|
xiboIC.set(
|
|
id,
|
|
'updateClock',
|
|
function updateClock() {
|
|
var offset = properties.offset || 0;
|
|
$(".clock").each(function() {
|
|
$(this).html(moment().format($(this).attr("format")));
|
|
$(this).html(moment().add(offset, "m").format($(this).attr("format")));
|
|
});
|
|
}
|
|
);
|
|
]]></onInitialize>
|
|
<onVisible><![CDATA[
|
|
var updateClock = xiboIC.get(id, 'updateClock');
|
|
// Run update clock if it's defined in the template
|
|
if (typeof updateClock === 'function') {
|
|
// Start the first time
|
|
updateClock();
|
|
|
|
// Update every second
|
|
setInterval(updateClock, 1000);
|
|
}
|
|
]]></onVisible>
|
|
<onRender><![CDATA[
|
|
$('body').xiboLayoutScaler(properties);
|
|
]]></onRender>
|
|
<assets>
|
|
<asset id="clock-digital-thumb" type="path" cmsOnly="true" mimeType="image/png" path="/modules/assets/template-thumbnails/clock/clock-digital-thumb.png" />
|
|
</assets>
|
|
</module>
|