Skip to content

Commit

Permalink
Revert default date and added custom
Browse files Browse the repository at this point in the history 
relates to xibosignageltd/xibo-private#662
  • Loading branch information
@maurofmferrao
maurofmferrao committed Apr 2, 2024
1 parent 918b146 commit 0f73979
Showing 1 changed file with 227 additions and 2 deletions.
229 changes: 227 additions & 2 deletions modules/templates/global-elements.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -193,12 +193,13 @@
<title>Date</title>
<type>element</type>
<dataType>global</dataType>
<showIn>none</showIn>
<canRotate>true</canRotate>
<thumbnail>date-thumb</thumbnail>
<startWidth>380</startWidth>
<startWidth>300</startWidth>
<startHeight>80</startHeight>
<properties>
<property id="date" type="date" format="DD/MM/Y HH:mm:ss" variant="dateTime">
<property id="date" type="date" format="d/m/Y H:i:s" variant="dateTime">
<title>Date</title>
<default></default>
</property>
Expand Down Expand Up @@ -361,6 +362,230 @@ $(target).find('.date').each(function(_idx, dateEl){
<asset id="date-thumb" type="path" cmsOnly="true" mimeType="image/png" path="/modules/assets/template-thumbnails/global/date.png" />
</assets>
</template>
<template>
<id>date_advanced</id>
<title>Date</title>
<type>element</type>
<dataType>global</dataType>
<canRotate>true</canRotate>
<thumbnail>date-thumb</thumbnail>
<startWidth>380</startWidth>
<startHeight>80</startHeight>
<properties>
<property id="currentDate" type="checkbox">
<title>Current date?</title>
<helpText>Use the current date to be displayed.</helpText>
<default>1</default>
</property>
<property id="offset" type="number">
<title>Offset</title>
<helpText>The offset in minutes that should be applied to the current date.</helpText>
<default></default>
<visibility>
<test>
<condition field="currentDate" type="eq">1</condition>
</test>
</visibility>
</property>
<property id="date" type="date" format="DD/MM/Y HH:mm:ss" variant="dateTime">
<title>Custom Date</title>
<helpText>Insert date to be displayed.</helpText>
<default></default>
<visibility>
<test>
<condition field="currentDate" type="eq">0</condition>
</test>
</visibility>
</property>
<property id="dateFormat" type="text" variant="dateFormat">
<title>Date Format</title>
<default>d/m/Y H:i:s</default>
</property>
<property id="lang" type="languageSelector" variant="momentLocales">
<title>Language</title>
<helpText>Select the language you would like to use.</helpText>
</property>
<property id="fontFamily" type="fontSelector">
<title>Font Family</title>
<helpText>Select a custom font - leave empty to use the default font.</helpText>
</property>
<property id="fontColor" type="color">
<title>Font Colour</title>
<default>%THEME_COLOR%</default>
</property>
<property id="fontSize" type="number">
<title>Font Size</title>
<default>40</default>
</property>
<property id="lineHeight" type="number">
<title>Line Height</title>
<default>1.2</default>
</property>
<property id="bold" type="checkbox">
<title>Bold</title>
<helpText>Should the text be bold?</helpText>
<default>0</default>
</property>
<property id="italics" type="checkbox">
<title>Italics</title>
<helpText>Should the text be italicised?</helpText>
<default>0</default>
</property>
<property id="underline" type="checkbox">
<title>Underline</title>
<helpText>Should the text be underlined?</helpText>
<default>0</default>
</property>
<property id="textWrap" type="checkbox">
<title>Text Wrap</title>
<helpText>Should the text wrap to the next line?</helpText>
<default>1</default>
</property>
<property id="showOverflow" type="checkbox">
<title>Show Overflow</title>
<helpText>Should the widget overflow the region?</helpText>
<default>1</default>
</property>
<property id="textShadow" type="checkbox">
<title>Text Shadow</title>
<default>0</default>
<helpText>Should the text have a shadow?</helpText>
</property>
<property id="textShadowColor" type="color">
<title>Text Shadow Colour</title>
<visibility>
<test>
<condition field="textShadow" type="eq">1</condition>
</test>
</visibility>
</property>
<property id="shadowX" type="number">
<title>Shadow X Offset</title>
<default>1</default>
<visibility>
<test>
<condition field="textShadow" type="eq">1</condition>
</test>
</visibility>
</property>
<property id="shadowY" type="number">
<title>Shadow Y Offset</title>
<default>1</default>
<visibility>
<test>
<condition field="textShadow" type="eq">1</condition>
</test>
</visibility>
</property>
<property id="shadowBlur" type="number">
<title>Shadow Blur</title>
<default>2</default>
<visibility>
<test>
<condition field="textShadow" type="eq">1</condition>
</test>
</visibility>
</property>
<property id="horizontalAlign" type="dropdown">
<title>Horizontal Align</title>
<default>center</default>
<options>
<option name="flex-start">Left</option>
<option name="center">Center</option>
<option name="flex-end">Right</option>
</options>
</property>
<property id="verticalAlign" type="dropdown">
<title>Vertical Align</title>
<default>center</default>
<options>
<option name="flex-start">Top</option>
<option name="center">Middle</option>
<option name="flex-end">Bottom</option>
</options>
</property>
</properties>
<stencil>
<hbs><![CDATA[
<div class="global-elements-date-advanced"
style="
display: flex;
{{#if fontFamily}}font-family: {{fontFamily}};{{/if}}
{{#if fontSize}}font-size: {{fontSize}}px;{{/if}}
{{#if lineHeight}}line-height: {{lineHeight}};{{/if}}
{{#if fontColor}}color: {{fontColor}};{{/if}}
{{#if bold}}font-weight: bold;{{/if}}
{{#if italics}}font-style: italic;{{/if}}
{{#if underline}}text-decoration: underline;{{/if}}
{{#if showOverflow}}overflow: visible;{{else}}overflow: hidden;{{/if}}
{{#if horizontalAlign}}justify-content: {{horizontalAlign}};{{/if}}
{{#if verticalAlign}}align-items: {{verticalAlign}};{{/if}}
{{#if textWrap}}white-space: break-spaces;{{else}}white-space: nowrap;{{/if}}
{{#if textShadow}}text-shadow: {{shadowX}}px {{shadowY}}px {{shadowBlur}}px {{textShadowColor}};{{/if}}
width: 100%; height: 100%;"
>
<div class="date-advanced"></div>
</div>
]]></hbs>
</stencil>
<onTemplateRender><![CDATA[
var $dateEl = $(target).find('.date-advanced');
var useCurrentDate = (properties.currentDate == 1);
if (useCurrentDate) {
// Use current date
var offset = properties.offset || 0;
// Clear previous interval if exists
if (window['updateInterval_' + id]) {
clearInterval(window['updateInterval_' + id]);
}
// Update every second
window['updateInterval_' + id] = setInterval(function() {
// If element was removed, clear interval
if(!$dateEl.is(':visible')) {
clearInterval(window['updateInterval_' + id]);
return;
}
// Update date value
var currentDate = moment().add(offset, "m");
// Check for lang config
if (properties.lang !== null && String(properties.lang).length > 0) {
currentDate.locale(properties.lang);
}
$dateEl.html(currentDate.format(properties.dateFormat));
}, 1000);
} else {
// Use custom date
// If date is not defined, don't render
if (String(properties.date).length === 0) {
$dateEl.html('');
return;
}
var customDate = moment(properties.date);
// Check for lang config
if (properties.lang !== null && String(properties.lang).length > 0) {
customDate.locale(properties.lang);
}
// Format the date with the dateFormat property
var formattedDate = customDate.format(properties.dateFormat);
// Set the date div value to the formatted date
$dateEl.html(formattedDate);
}
]]></onTemplateRender>
<assets>
<asset id="date-thumb" type="path" cmsOnly="true" mimeType="image/png" path="/modules/assets/template-thumbnails/global/date.png" />
</assets>
</template>
<template>
<id>global_image</id>
<type>element</type>
Expand Down

0 comments on commit 0f73979

Please sign in to comment.