OTSSigns/CMS-Server
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

init commit

Browse Source
This commit is contained in:
Matt Batchelder
2026-02-11 20:55:38 -05:00
commit 6e3929c459
2240 changed files with 467828 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

143
modules/templates/article-elements.xml Normal file
View File

@@ -0,0 +1,143 @@
<!--
~ 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/>.
-->
<templates>
<template>
<id>article_title</id>
<extends override="text" with="data.title">text</extends>
<title>Title</title>
<type>element</type>
<dataType>article</dataType>
<icon>fas fa-font</icon>
<canRotate>true</canRotate>
<startWidth>500</startWidth>
<startHeight>100</startHeight>
</template>
<template>
<id>article_summary</id>
<extends override="text" with="data.summary">text</extends>
<title>Summary</title>
<type>element</type>
<dataType>article</dataType>
<icon>fas fa-font</icon>
<canRotate>true</canRotate>
<startWidth>500</startWidth>
<startHeight>250</startHeight>
</template>
<template>
<id>article_content</id>
<extends override="text" with="data.content" escapeHtml="false">text</extends>
<title>Content</title>
<type>element</type>
<dataType>article</dataType>
<icon>fas fa-font</icon>
<canRotate>true</canRotate>
<startWidth>500</startWidth>
<startHeight>500</startHeight>
<properties>
<property id="removeNewLines" type="checkbox">
<title>Remove new lines?</title>
<default>0</default>
<helpText>Should new lines (\n) be removed from content?</helpText>
</property>
</properties>
<onElementParseData><![CDATA[
// value - element to be parsed
// properties
if (
(
properties.removeNewLines === true ||
properties.removeNewLines === 1
) &&
value != ''
) {
return value.replaceAll('\n', '');
} else {
return value;
}
]]></onElementParseData>
</template>
<template>
<id>article_author</id>
<extends override="text" with="data.author">text</extends>
<title>Author</title>
<type>element</type>
<dataType>article</dataType>
<icon>fas fa-user</icon>
<canRotate>true</canRotate>
<startWidth>400</startWidth>
<startHeight>100</startHeight>
</template>
<template>
<id>article_date</id>
<extends override="date" with="data.date">date</extends>
<title>Date</title>
<type>element</type>
<dataType>article</dataType>
<icon>fas fa-calendar-week</icon>
<canRotate>true</canRotate>
<startWidth>400</startWidth>
<startHeight>100</startHeight>
</template>
<template>
<id>article_publishedDate</id>
<extends override="date" with="data.publishedDate">date</extends>
<title>Published Date</title>
<type>element</type>
<dataType>article</dataType>
<icon>fas fa-calendar-week</icon>
<canRotate>true</canRotate>
<startWidth>400</startWidth>
<startHeight>100</startHeight>
</template>
<template>
<id>article_image</id>
<extends override="url" with="data.image">global_image</extends>
<title>Image</title>
<type>element</type>
<dataType>article</dataType>
<icon>fas fa-image</icon>
<canRotate>true</canRotate>
<startWidth>200</startWidth>
<startHeight>200</startHeight>
</template>
<template>
<id>article_link</id>
<extends override="text" with="data.link">text</extends>
<title>Link</title>
<type>element</type>
<dataType>article</dataType>
<icon>fas fa-link</icon>
<canRotate>true</canRotate>
<startWidth>480</startWidth>
<startHeight>100</startHeight>
</template>
<template>
<id>article_permalink</id>
<extends override="text" with="data.permalink">text</extends>
<title>Permalink</title>
<type>element</type>
<dataType>article</dataType>
<icon>fas fa-link</icon>
<canRotate>true</canRotate>
<startWidth>480</startWidth>
<startHeight>100</startHeight>
</template>
</templates>

1454
modules/templates/article-static.xml Normal file
View File

File diff suppressed because it is too large Load Diff

1185
modules/templates/currency-elements.xml Normal file
View File

File diff suppressed because it is too large Load Diff

634
modules/templates/currency-static.xml Normal file
View File

@@ -0,0 +1,634 @@
<!--
~ Copyright (C) 2024 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/>.
-->
<templates>
<template>
<id>currencies_custom_html</id>
<type>static</type>
<dataType>currency</dataType>
<showIn>none</showIn>
<title>Currencies Custom HTML</title>
<properties>
<property id="effect" type="effectSelector" variant="showPaged">
<title>Effect</title>
<helpText>Please select the effect that will be used to transition between items.</helpText>
<default>noTransition</default>
</property>
<property id="speed" type="number">
<title>Speed</title>
<helpText>The transition speed of the selected effect in milliseconds (normal = 1000).</helpText>
</property>
<property id="backgroundColor" type="color">
<title>Background Colour</title>
<helpText>The selected effect works best with a background colour. Optionally add one here.</helpText>
<default></default>
</property>
<property id="itemsPerPage" type="number">
<title>Items per Page</title>
<helpText>This is the intended number of items on each page.</helpText>
<default>4</default>
</property>
<property id="customTemplate" type="hidden">
<default>1</default>
</property>
<property id="moduleType" type="hidden">
<default>currencies</default>
</property>
<property id="widgetDesignWidth" type="number">
<title>Original Width</title>
<helpText>This is the intended width of the template and is used to scale the Widget within its region when the template is applied.</helpText>
</property>
<property id="widgetDesignHeight" type="number">
<title>Original Height</title>
<helpText>This is the intended height of the template and is used to scale the Widget within its region when the template is applied.</helpText>
</property>
<property id="mainTemplate" type="code" allowLibraryRefs="true" parseTranslations="true" variant="html">
<title>mainTemplate</title>
</property>
<property id="itemTemplate" type="code" allowLibraryRefs="true" parseTranslations="true" variant="html">
<title>itemTemplate</title>
</property>
<property id="styleSheet" type="code" allowLibraryRefs="true" variant="css">
<title>styleSheet</title>
</property>
</properties>
<stencil>
<twig><![CDATA[
<div class="template-container" style="display: none;">
{{mainTemplate|raw}}
</div>
<div class="item-template" style="display: none;">
{{itemTemplate|raw}}
</div>
<div class="sample-image" style="display: none;">
<div class="img-circle center-block flag-icon-container">
<img src="[[assetId=flags]]" class="flag-icon flag-icon-[NameShort]">
</div>
</div>
]]></twig>
<style><![CDATA[
{{styleSheet|raw}}
]]></style>
</stencil>
<onTemplateRender><![CDATA[
// Template renderer options
// id: The id of the widget
// target: The target element to render
// items: The items to render
// properties: The properties for the widget
$(target).xiboLayoutScaler(properties);
// Get body
var body = $(target).find('.template-container > div');
// Get items
var templateItems = $(target).find('#content > .template-item');
// Run only if there are items
if (templateItems.length > 0) {
// Render items
$(target).find('#content').xiboFinanceRender(properties, templateItems, body);
} else {
// Hide container
$(body).hide();
}
$(target).find('img').xiboImageRender(properties);
]]></onTemplateRender>
<onTemplateVisible><![CDATA[
// Start effects for this template
$(target).xiboLayoutAnimate(properties);
]]></onTemplateVisible>
<assets>
<asset id="flags" type="path" mimeType="image/webp" path="/modules/assets/currency/flags.webp"></asset>
<asset id="flagsCSS" type="path" mimeType="text/css" path="/modules/assets/currency/flags.css"></asset>
</assets>
</template>
<template>
<id>currencies1</id>
<type>static</type>
<dataType>currency</dataType>
<title>Currencies 1</title>
<thumbnail>currencies1</thumbnail>
<startWidth>500</startWidth>
<startHeight>300</startHeight>
<properties>
<property id="effect" type="effectSelector" variant="showPaged">
<title>Effect</title>
<helpText>Please select the effect that will be used to transition between items.</helpText>
<default>noTransition</default>
</property>
<property id="speed" type="number">
<title>Speed</title>
<helpText>The transition speed of the selected effect in milliseconds (normal = 1000).</helpText>
</property>
<property id="backgroundColor" type="color">
<title>Background Colour</title>
<helpText>The selected effect works best with a background colour. Optionally add one here.</helpText>
<default></default>
</property>
<property id="itemBackgroundColor" type="color">
<title>Item Colour</title>
<helpText>Background colour for each currency item.</helpText>
<default>rgba(0, 0, 0, 0.87)</default>
</property>
<property id="itemFontColor" type="color">
<title>Item Font Colour</title>
<helpText>Font colour for each currency item.</helpText>
<default>#fff</default>
</property>
<property id="headerFontColor" type="color">
<title>Header Font Colour</title>
<helpText>Font colour for the header.</helpText>
<default>#fff</default>
</property>
<property id="upArrowColor" type="color">
<title>Up Arrow Colour</title>
<helpText>Colour for the up change arrow.</helpText>
<default>green</default>
</property>
<property id="downArrowColor" type="color">
<title>Down Arrow Colour</title>
<helpText>Colour for the down change arrow.</helpText>
<default>red</default>
</property>
<property id="fontFamily" type="fontSelector">
<title>Font</title>
<helpText>Select a custom font - leave empty to use the default font.</helpText>
</property>
<property id="itemsPerPage" type="hidden" saveDefault="true">
<default>4</default>
</property>
</properties>
<stencil>
<width id="width">820</width>
<height id="height">420</height>
<hbs><![CDATA[
<div class="row-finance template-item">
<div class="flags">
<div class="img-circle center-block flag-icon-container">
<img src="[[assetId=flags]]" class="flag-icon flag-icon-{{NameShort}}">
</div>
</div>
<div class="name value">{{NameShort}}</div>
<div class="price text-center value">{{RawLastTradePriceOnly}}</div>
</div>
]]></hbs>
<twig><![CDATA[
<div class="container-main template-container">
<div class="container">
<div class="row-header">
<div class="header-rate value">||RATE||</div>
</div>
<div id="cycle-container" class="items-container">
</div>
</div>
</div>
]]></twig>
<style><![CDATA[
body {
width: 820px !important;
height: 420px !important;
line-height: 1;
{% if fontFamily %}
font-family: {{fontFamily}};
{% else %}
font-family: "Helvetica", "Arial", sans-serif;
{% endif %}
}
.container-main {
height: 420px !important;
width: 820px !important;
{% if backgroundColor %}
background-color: {{backgroundColor}};
{% endif %}
}
.container {
height: 420px !important;
width: 820px !important;
float: left;
}
.row-finance {
height: 60px;
margin-bottom: 20px;
{% if itemBackgroundColor %}
background-color: {{itemBackgroundColor}};
{% endif %}
}
.row-header {
margin-right: -15px;
margin-left: -15px;
margin-bottom: 20px;
{% if headerFontColor %}
color: {{headerFontColor}};
{% endif %}
}
.header-rate {
margin-left: 70%;
width: 30%;
text-align: center;
}
.value {
font-size: 20px;
padding-top: 20px;
font-weight: bold;
}
.page .value {
{% if itemFontColor %}
color: {{itemFontColor}};
{% endif %}
}
.img-circle {
border-radius: 50%;
vertical-align: middle;
border: 0;
}
.center-block {
width: 50px;
height: 50px;
display: block;
margin-right: auto;
margin-left: auto;
}
.down-arrow {
font-size: 20px;
{% if downArrowColor %}
color: {{downArrowColor}};
{% endif %}
padding-top: 17px;
}
.up-arrow {
font-size: 20px;
{% if upArrowColor %}
color: {{upArrowColor}};
{% endif %}
padding-top: 17px;
}
.variant {
font-size: 20px;
padding-top: 17px;
}
.flags {
padding-top: 4px;
width: 15%;
float: left;
}
.name {
width: 30%;
float: left;
}
.price {
float: right;
width: 30%;
text-align: center;
}
.center-block {
width: 50px;
height: 50px;
}
]]></style>
</stencil>
<onTemplateRender><![CDATA[
// Template renderer options
// id: The id of the widget
// target: The target element to render
// items: The items to render
// properties: The properties for the widget
var overrideItemPerPage = {
itemsPerPage: 0,
};
$(target).xiboLayoutScaler($.extend({}, properties, overrideItemPerPage));
// Get items
var templateItems = $(target).find(".template-item");
// Get body
var body = $(target).find(".template-container");
// Run only if there are items
if (templateItems.length > 0) {
// Render items
$(target).find("#content").xiboFinanceRender(properties, templateItems, body);
} else {
// Hide container
$(body).hide();
}
$(target).find("img").xiboImageRender(properties);
]]></onTemplateRender>
<onTemplateVisible><![CDATA[
// Start effects for this template
$(target).xiboLayoutAnimate(properties);
]]></onTemplateVisible>
<assets>
<asset id="currencies1" type="path" mimeType="image/png" cmsOnly="true" path="/modules/assets/template-thumbnails/currency/currencies1.png"></asset>
<asset id="flags" type="path" mimeType="image/webp" path="/modules/assets/currency/flags.webp"></asset>
<asset id="flagsCSS" type="path" mimeType="text/css" path="/modules/assets/currency/flags.css"></asset>
</assets>
</template>
<template>
<id>currencies2</id>
<type>static</type>
<dataType>currency</dataType>
<title>Currencies 2</title>
<thumbnail>currencies2</thumbnail>
<startWidth>500</startWidth>
<startHeight>300</startHeight>
<properties>
<property id="effect" type="effectSelector" variant="showPaged">
<title>Effect</title>
<helpText>Please select the effect that will be used to transition between items.</helpText>
<default>noTransition</default>
</property>
<property id="speed" type="number">
<title>Speed</title>
<helpText>The transition speed of the selected effect in milliseconds (normal = 1000).</helpText>
</property>
<property id="backgroundColor" type="color">
<title>Background Colour</title>
<helpText>The selected effect works best with a background colour. Optionally add one here.</helpText>
<default></default>
</property>
<property id="itemBackgroundColor" type="color">
<title>Item Colour</title>
<helpText>Background colour for each currency item.</helpText>
<default>#e0e0e0</default>
</property>
<property id="itemFontColor" type="color">
<title>Item Font Colour</title>
<helpText>Font colour for each currency item.</helpText>
<default>#000</default>
</property>
<property id="borderLeftColor" type="color">
<title>Item Border Colour</title>
<helpText>Border colour for each currency item.</helpText>
<default>#264a88</default>
</property>
<property id="upArrowColor" type="color">
<title>Up Arrow Colour</title>
<helpText>Colour for the up change arrow.</helpText>
<default>green</default>
</property>
<property id="downArrowColor" type="color">
<title>Down Arrow Colour</title>
<helpText>Colour for the down change arrow.</helpText>
<default>red</default>
</property>
<property id="equalArrowColor" type="color">
<title>Equal Arrow Colour</title>
<helpText>Colour for the equal change arrow.</helpText>
<default>gray</default>
</property>
<property id="fontFamily" type="fontSelector">
<title>Font</title>
<helpText>Select a custom font - leave empty to use the default font.</helpText>
</property>
<property id="itemsPerPage" type="hidden" saveDefault="true">
<default>5</default>
</property>
</properties>
<stencil>
<width id="width">820</width>
<height id="height">420</height>
<hbs><![CDATA[
<div class="row-finance template-item">
<div class="flags">
<div class="img-circle center-block flag-icon-container">
<img src="[[assetId=flags]]" class="flag-icon flag-icon-{{NameShort}}">
</div>
</div>
<div class="name value">{{NameShort}}</div>
<div class="price value">{{RawLastTradePriceOnly}}</div>
<div class="perc value {{ChangeStyle}}">{{ChangePercentage}}%</div>
<div class="arrow"><div class="{{ChangeIcon}}"></div></div>
</div>
]]></hbs>
<twig><![CDATA[
<div class="container-main template-container">
<div id="cycle-container" class="items-container">
</div>
</div>
]]></twig>
<style><![CDATA[
body {
width: 820px !important;
height: 420px !important;
{% if fontFamily %}
font-family: {{fontFamily}};
{% else %}
font-family: "Helvetica", "Arial", sans-serif;
{% endif %}
line-height: 1;
}
.img-circle {
border-radius: 50%;
vertical-align: middle;
border: 0;
}
.container-main {
height: 370px !important;
width: 820px !important;
float: left;
padding: 25px 0;
{% if backgroundColor %}
background-color: {{backgroundColor}};
{% endif %}
}
.row-finance {
height: 60px;
margin-bottom: 17px;
border-left: #264a88 10px solid;
{% if borderLeftColor %}
border-left-color: {{borderLeftColor}};
{% endif %}
{% if itemBackgroundColor %}
background: {{itemBackgroundColor}};
{% endif %}
}
.row-finance>div {
float: left;
}
.value {
font-size: 20px;
padding-top: 20px;
{% if itemFontColor %}
color: {{itemFontColor}};
{% endif %}
white-space: nowrap;
}
.down-arrow {
margin: 25px 0px 0px 20px;
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-top: 10px solid red;
{% if downArrowColor %}
border-top-color: {{downArrowColor}};
{% endif %}
}
.up-arrow {
margin: 25px 0px 0px 20px;
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-bottom: 10px solid green;
{% if upArrowColor %}
border-bottom-color: {{upArrowColor}};
{% endif %}
}
.right-arrow {
margin: 20px 0px 0px 25px;
width: 0;
height: 0;
border-left: 10px solid gray;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
{% if equalArrowColor %}
border-left-color: {{equalArrowColor}};
{% endif %}
}
.img-circle {
border-radius: 50%;
vertical-align: middle;
border: 0;
}
.center-block {
width: 50px;
height: 50px;
display: block;
margin-right: auto;
margin-left: auto;
}
.variant {
font-size: 20px;
padding-top: 17px;
}
.flags {
padding-top: 4px;
width: 15%;
}
.name {
width: 20%;
}
.price {
width: 20%;
margin-left: 15%;
text-align: right;
}
.perc {
width: 20%;
text-align: right;
}
.arrow {
width: 8%;
margin-left: 2%;
}
.value-up {
font-weight: bold;
{% if upArrowColor %}
color: {{upArrowColor}};
{% endif %}
}
.value-down {
font-weight: bold;
{% if downArrowColor %}
color: {{downArrowColor}};
{% endif %}
}
.value-equal {
font-weight: bold;
{% if equalArrowColor %}
color: {{equalArrowColor}};
{% endif %}
}
.name-stock {
color: gray;
}
]]></style>
</stencil>
<onTemplateRender><![CDATA[
// Template renderer options
// id: The id of the widget
// target: The target element to render
// items: The items to render
// properties: The properties for the widget
var overrideItemPerPage = {
itemsPerPage: 0,
};
$(target).xiboLayoutScaler($.extend({}, properties, overrideItemPerPage));
// Get template items
var templateItems = $(target).find(".template-item");
// Get body
var body = $(target).find(".template-container");
$(target).find("#content").xiboFinanceRender(properties, templateItems, body);
$(target).find("img").xiboImageRender(properties);
]]></onTemplateRender>
<onTemplateVisible><![CDATA[
// Start effects for this template
$(target).xiboLayoutAnimate(properties);
]]></onTemplateVisible>
<assets>
<asset id="currencies2" type="path" mimeType="image/png" cmsOnly="true" path="/modules/assets/template-thumbnails/currency/currencies2.png"></asset>
<asset id="flags" type="path" mimeType="image/webp" path="/modules/assets/currency/flags.webp"></asset>
<asset id="flagsCSS" type="path" mimeType="text/css" path="/modules/assets/currency/flags.css"></asset>
</assets>
</template>
</templates>

30
modules/templates/dashboard-static.xml Normal file
View File

@@ -0,0 +1,30 @@
<!--
~ 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/>.
-->
<templates>
<template>
<id>dashboard_image</id>
<type>static</type>
<dataType>xibo-dashboard-service</dataType>
<title>Dashboard Image</title>
<icon>fa fa-file-image</icon>
</template>
</templates>

238
modules/templates/dataset-elements.xml Normal file
View File

@@ -0,0 +1,238 @@
<!--
~ 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/>.
-->
<templates>
<template>
<id>dataset_data_string</id>
<extends override="text" with="datasetString">text</extends>
<title>String</title>
<type>element</type>
<dataType>dataset</dataType>
<canRotate>true</canRotate>
<icon>fa fa-font</icon>
<startWidth>360</startWidth>
<startHeight>100</startHeight>
<properties>
<property id="dataTypeId" type="hidden">
<default>1</default>
</property>
<property type="message">
<title>Please choose a Dataset from the Configure tab to be able to customise this element.</title>
<visibility>
<test>
<condition field="dataSetId" type="eq"></condition>
</test>
</visibility>
</property>
<property type="message">
<title>No field is available for that type of DataSet element.</title>
<visibility>
<test>
<condition field="dataSetId" type="neq"></condition>
<condition field="datasetField" type="eq"></condition>
</test>
</visibility>
</property>
<property id="datasetField" type="datasetField">
<dependsOn>dataSetId</dependsOn>
<title>Select DataSet Field</title>
<helpText>Please choose a DataSet field for this element.</helpText>
<default></default>
<visibility>
<test>
<condition field="dataSetId" type="neq"></condition>
</test>
</visibility>
</property>
</properties>
</template>
<template>
<id>dataset_data_number</id>
<extends override="text" with="datasetNumber">text</extends>
<title>Number</title>
<type>element</type>
<dataType>dataset</dataType>
<canRotate>true</canRotate>
<icon>fas fa-sort-numeric-up</icon>
<startWidth>360</startWidth>
<startHeight>100</startHeight>
<properties>
<property id="dataTypeId" type="hidden">
<default>2</default>
</property>
<property type="message">
<title>Please choose a Dataset from the Configure tab to be able to customise this element.</title>
<visibility>
<test>
<condition field="dataSetId" type="eq"></condition>
</test>
</visibility>
</property>
<property type="message">
<title>No field is available for that type of DataSet element.</title>
<visibility>
<test>
<condition field="dataSetId" type="neq"></condition>
<condition field="datasetField" type="eq"></condition>
</test>
</visibility>
</property>
<property id="datasetField" type="datasetField">
<dependsOn>dataSetId</dependsOn>
<title>Select DataSet Field</title>
<helpText>Please choose a DataSet field for this element.</helpText>
<visibility>
<test>
<condition field="dataSetId" type="neq"></condition>
</test>
</visibility>
</property>
</properties>
</template>
<template>
<id>dataset_data_date</id>
<extends override="date">date</extends>
<title>Date</title>
<type>element</type>
<dataType>dataset</dataType>
<canRotate>true</canRotate>
<icon>fas fa-calendar-week</icon>
<startWidth>360</startWidth>
<startHeight>100</startHeight>
<properties>
<property id="dataTypeId" type="hidden">
<default>3</default>
</property>
<property type="message">
<title>Please choose a Dataset from the Configure tab to be able to customise this element.</title>
<visibility>
<test>
<condition field="dataSetId" type="eq"></condition>
</test>
</visibility>
</property>
<property type="message">
<title>No field is available for that type of DataSet element.</title>
<visibility>
<test>
<condition field="dataSetId" type="neq"></condition>
<condition field="datasetField" type="eq"></condition>
</test>
</visibility>
</property>
<property id="datasetField" type="datasetField">
<dependsOn>dataSetId</dependsOn>
<title>Select DataSet Field</title>
<helpText>Please choose a DataSet field for this element.</helpText>
<visibility>
<test>
<condition field="dataSetId" type="neq"></condition>
</test>
</visibility>
</property>
</properties>
</template>
<template>
<id>dataset_data_img</id>
<extends override="url">global_image</extends>
<title>Image</title>
<type>element</type>
<dataType>dataset</dataType>
<canRotate>true</canRotate>
<icon>fas fa-image</icon>
<startWidth>150</startWidth>
<startHeight>150</startHeight>
<properties>
<property id="dataTypeId" type="hidden">
<default>4,5</default>
</property>
<property type="message">
<title>Please choose a Dataset from the Configure tab to be able to customise this element.</title>
<visibility>
<test>
<condition field="dataSetId" type="eq"></condition>
</test>
</visibility>
</property>
<property type="message">
<title>No field is available for that type of DataSet element.</title>
<visibility>
<test>
<condition field="dataSetId" type="neq"></condition>
<condition field="datasetField" type="eq"></condition>
</test>
</visibility>
</property>
<property id="datasetField" type="datasetField">
<dependsOn>dataSetId</dependsOn>
<title>Select DataSet Field</title>
<helpText>Please choose a DataSet field for this element.</helpText>
<visibility>
<test>
<condition field="dataSetId" type="neq"></condition>
</test>
</visibility>
</property>
</properties>
</template>
<template>
<id>dataset_data_html</id>
<extends override="text" escapeHtml="false">text</extends>
<title>HTML</title>
<type>element</type>
<dataType>dataset</dataType>
<canRotate>true</canRotate>
<icon>fas fa-file-code</icon>
<startWidth>360</startWidth>
<startHeight>100</startHeight>
<properties>
<property id="dataTypeId" type="hidden">
<default>6</default>
</property>
<property type="message">
<title>Please choose a Dataset from the Configure tab to be able to customise this element.</title>
<visibility>
<test>
<condition field="dataSetId" type="eq"></condition>
</test>
</visibility>
</property>
<property type="message">
<title>No field is available for that type of DataSet element.</title>
<visibility>
<test>
<condition field="dataSetId" type="neq"></condition>
<condition field="datasetField" type="eq"></condition>
</test>
</visibility>
</property>
<property id="datasetField" type="datasetField">
<dependsOn>dataSetId</dependsOn>
<title>Select DataSet Field</title>
<helpText>Please choose a DataSet field for this element.</helpText>
<visibility>
<test>
<condition field="dataSetId" type="neq"></condition>
</test>
</visibility>
</property>
</properties>
</template>
</templates>

3686
modules/templates/dataset-static.xml Normal file
View File

File diff suppressed because it is too large Load Diff

154
modules/templates/emergency-alert-elements.xml Normal file
View File

@@ -0,0 +1,154 @@
<!--
~ Copyright (C) 2024 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/>.
-->
<templates>
<template>
<id>source</id>
<extends override="text" with="data.source">text</extends>
<title>Source</title>
<type>element</type>
<dataType>emergency-alert</dataType>
<icon>fas fa-external-link-alt</icon>
<canRotate>true</canRotate>
<startWidth>500</startWidth>
<startHeight>80</startHeight>
</template>
<template>
<id>note</id>
<extends override="text" with="data.note">text</extends>
<title>Note</title>
<type>element</type>
<dataType>emergency-alert</dataType>
<icon>fas fa-sticky-note</icon>
<canRotate>true</canRotate>
<startWidth>500</startWidth>
<startHeight>80</startHeight>
</template>
<template>
<id>event</id>
<extends override="text" with="data.event">text</extends>
<title>Event</title>
<type>element</type>
<dataType>emergency-alert</dataType>
<icon>fas fa-calendar-o</icon>
<canRotate>true</canRotate>
<startWidth>500</startWidth>
<startHeight>80</startHeight>
</template>
<template>
<id>dateTimeEffective</id>
<extends override="date" with="data.dateTimeEffective">date</extends>
<title>Date &amp; Time Effective</title>
<type>element</type>
<dataType>emergency-alert</dataType>
<icon>fas fa-clock</icon>
<canRotate>true</canRotate>
<startWidth>450</startWidth>
<startHeight>80</startHeight>
</template>
<template>
<id>dateTimeOnset</id>
<extends override="date" with="data.dateTimeOnset">date</extends>
<title>Date &amp; Time Onset</title>
<type>element</type>
<dataType>emergency-alert</dataType>
<icon>fas fa-clock</icon>
<canRotate>true</canRotate>
<startWidth>450</startWidth>
<startHeight>80</startHeight>
</template>
<template>
<id>dateTimeExpires</id>
<extends override="date" with="data.dateTimeExpires">date</extends>
<title>Date &amp; Time Expires</title>
<type>element</type>
<dataType>emergency-alert</dataType>
<icon>fas fa-clock</icon>
<canRotate>true</canRotate>
<startWidth>450</startWidth>
<startHeight>80</startHeight>
</template>
<template>
<id>senderName</id>
<extends override="text" with="data.senderName">text</extends>
<title>Sender Name</title>
<type>element</type>
<dataType>emergency-alert</dataType>
<icon>fas fa-address-card</icon>
<canRotate>true</canRotate>
<startWidth>500</startWidth>
<startHeight>80</startHeight>
</template>
<template>
<id>headline</id>
<extends override="text" with="data.headline">text</extends>
<title>Headline</title>
<type>element</type>
<dataType>emergency-alert</dataType>
<icon>fas fa-newspaper-o</icon>
<canRotate>true</canRotate>
<startWidth>500</startWidth>
<startHeight>80</startHeight>
</template>
<template>
<id>description</id>
<extends override="text" with="data.description">text</extends>
<title>Description</title>
<type>element</type>
<dataType>emergency-alert</dataType>
<icon>fas fa-align-justify</icon>
<canRotate>true</canRotate>
<startWidth>700</startWidth>
<startHeight>350</startHeight>
</template>
<template>
<id>instruction</id>
<extends override="text" with="data.instruction">text</extends>
<title>Instruction</title>
<type>element</type>
<dataType>emergency-alert</dataType>
<icon>fas fa-list</icon>
<canRotate>true</canRotate>
<startWidth>500</startWidth>
<startHeight>80</startHeight>
</template>
<template>
<id>contact</id>
<extends override="text" with="data.contact">text</extends>
<title>Contact</title>
<type>element</type>
<dataType>emergency-alert</dataType>
<icon>fas fa-phone-square</icon>
<canRotate>true</canRotate>
<startWidth>500</startWidth>
<startHeight>80</startHeight>
</template>
<template>
<id>areaDesc</id>
<extends override="text" with="data.areaDesc">text</extends>
<title>Area Description</title>
<type>element</type>
<dataType>emergency-alert</dataType>
<icon>fas fa-map</icon>
<canRotate>true</canRotate>
<startWidth>700</startWidth>
<startHeight>80</startHeight>
</template>
</templates>

494
modules/templates/event-elements.xml Normal file
View File

@@ -0,0 +1,494 @@
<!--
~ 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/>.
-->
<templates>
<template>
<id>event_summary</id>
<extends override="text" with="data.summary">text</extends>
<title>Summary</title>
<type>element</type>
<dataType>event</dataType>
<canRotate>true</canRotate>
<icon>fa fa-font</icon>
<startWidth>300</startWidth>
<startHeight>80</startHeight>
</template>
<template>
<id>event_description</id>
<extends override="text" with="data.description">text</extends>
<title>Description</title>
<type>element</type>
<dataType>event</dataType>
<canRotate>true</canRotate>
<icon>fa fa-font</icon>
<startWidth>650</startWidth>
<startHeight>250</startHeight>
</template>
<template>
<id>event_startDate</id>
<extends override="date" with="data.startDate">date</extends>
<title>Start Date</title>
<type>element</type>
<dataType>event</dataType>
<canRotate>true</canRotate>
<icon>fas fa-calendar-week</icon>
<startWidth>450</startWidth>
<startHeight>80</startHeight>
</template>
<template>
<id>event_endDate</id>
<extends override="date" with="data.endDate">date</extends>
<title>End Date</title>
<type>element</type>
<dataType>event</dataType>
<canRotate>true</canRotate>
<icon>fas fa-calendar-week</icon>
<startWidth>450</startWidth>
<startHeight>80</startHeight>
</template>
<template>
<id>event_location</id>
<extends override="text" with="data.location">text</extends>
<title>Location</title>
<type>element</type>
<dataType>event</dataType>
<canRotate>true</canRotate>
<icon>fas fa-map-marker-alt</icon>
<startWidth>650</startWidth>
<startHeight>250</startHeight>
</template>
<template>
<id>calendar_event_detailed</id>
<type>element-group</type>
<dataType>event</dataType>
<title>Calendar Detailed Event</title>
<thumbnail>calendar-event-detailed</thumbnail>
<stencil>
<hbs></hbs>
<startWidth>300</startWidth>
<startHeight>300</startHeight>
<elements>
<element id="rectangle">
<title>Background</title>
<top>0</top>
<left>0</left>
<layer>0</layer>
<width>300</width>
<height>300</height>
<defaultProperties>
<property id="backgroundColor">rgba(74,74,74,0.66)</property>
<property id="outline">0</property>
<property id="roundBorder">1</property>
<property id="borderRadius">12</property>
</defaultProperties>
</element>
<element id="line">
<title>Separator</title>
<top>90</top>
<left>60</left>
<width>230</width>
<height>30</height>
<layer>0</layer>
<defaultProperties>
<property id="lineColor">#4a4a4a</property>
<property id="lineWidth">7</property>
<property id="lineStyle">dotted</property>
</defaultProperties>
</element>
<element id="circle">
<title>Day background</title>
<top>10</top>
<left>10</left>
<width>110</width>
<height>110</height>
<layer>1</layer>
<defaultProperties>
<property id="backgroundColor">#4a4a4a</property>
<property id="outline">0</property>
</defaultProperties>
</element>
<element id="event_startDate">
<title>Day of the month</title>
<top>25</top>
<left>25</left>
<width>80</width>
<height>80</height>
<layer>2</layer>
<rotation>0</rotation>
<defaultProperties>
<property id="dateFormat">d</property>
<property id="fontFamily">linear regular</property>
<property id="fontSize">80</property>
<property id="lineHeight">1.25</property>
<property id="bold">1</property>
<property id="fontColor">#6fedf8</property>
<property id="horizontalAlign">center</property>
<property id="verticalAlign">center</property>
</defaultProperties>
</element>
<element id="event_startDate">
<title>Day of the week</title>
<top>10</top>
<left>120</left>
<width>170</width>
<height>45</height>
<layer>2</layer>
<rotation>0</rotation>
<defaultProperties>
<property id="dateFormat">l</property>
<property id="fontFamily">railway regular</property>
<property id="fontSize">30</property>
<property id="fontColor">#fff</property>
<property id="horizontalAlign">flex-end</property>
<property id="verticalAlign">center</property>
</defaultProperties>
</element>
<element id="event_startDate">
<title>Hour</title>
<top>60</top>
<left>120</left>
<width>170</width>
<height>30</height>
<layer>2</layer>
<rotation>0</rotation>
<defaultProperties>
<property id="dateFormat">H:i</property>
<property id="fontFamily">railway regular</property>
<property id="fontSize">24</property>
<property id="fontColor">#fff</property>
<property id="horizontalAlign">flex-end</property>
<property id="verticalAlign">center</property>
</defaultProperties>
</element>
<element id="event_summary">
<title>Summary</title>
<top>130</top>
<left>10</left>
<width>280</width>
<height>35</height>
<rotation>0</rotation>
<layer>2</layer>
<defaultProperties>
<property id="fontFamily">aileron regular</property>
<property id="bold">1</property>
<property id="fontSize">24</property>
<property id="fontColor">#6fedf8</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">flex-end</property>
</defaultProperties>
</element>
<element id="event_description">
<title>Description</title>
<top>165</top>
<left>10</left>
<width>280</width>
<height>125</height>
<layer>2</layer>
<rotation>0</rotation>
<defaultProperties>
<property id="fontFamily">aileron regular</property>
<property id="fontSize">22</property>
<property id="fontColor">#fff</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">flex-start</property>
<property id="showOverflow">0</property>
<property id="justify">1</property>
</defaultProperties>
</element>
</elements>
</stencil>
<assets>
<asset id="calendar-event-detailed" type="path" cmsOnly="true" mimeType="image/png" path="/modules/assets/template-thumbnails/event/elements/calendar-event-detailed.png" />
</assets>
</template>
<template>
<id>calendar_event_simple</id>
<type>element-group</type>
<dataType>event</dataType>
<title>Calendar Simple Event</title>
<thumbnail>calendar-event-simple</thumbnail>
<stencil>
<hbs></hbs>
<startWidth>400</startWidth>
<startHeight>160</startHeight>
<elements>
<element id="rectangle">
<title>Background</title>
<top>0</top>
<left>0</left>
<layer>0</layer>
<width>400</width>
<height>160</height>
<defaultProperties>
<property id="backgroundColor">rgba(234,234,234,0.66)</property>
<property id="outline">0</property>
</defaultProperties>
</element>
<element id="rectangle">
<title>Header Background</title>
<top>0</top>
<left>0</left>
<width>400</width>
<height>55</height>
<layer>1</layer>
<defaultProperties>
<property id="backgroundColor">rgba(66,66,66,0.64)</property>
<property id="outline">0</property>
</defaultProperties>
</element>
<element id="event_startDate">
<title>Day of the week</title>
<top>5</top>
<left>5</left>
<width>390</width>
<height>45</height>
<rotation>0</rotation>
<layer>2</layer>
<defaultProperties>
<property id="dateFormat">l</property>
<property id="fontFamily">aileron regular</property>
<property id="bold">1</property>
<property id="fontSize">32</property>
<property id="fontColor">#ffffff</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
<property id="showOverflow">0</property>
<property id="lineHeight">1.5</property>
</defaultProperties>
</element>
<element id="event_summary">
<title>Summary</title>
<top>55</top>
<left>5</left>
<width>390</width>
<height>40</height>
<rotation>0</rotation>
<layer>2</layer>
<defaultProperties>
<property id="fontFamily">aileron regular</property>
<property id="fontSize">24</property>
<property id="fontColor">#2f5c7d</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
<property id="showOverflow">0</property>
<property id="lineHeight">1.5</property>
</defaultProperties>
</element>
<element id="event_startDate">
<title>Hour</title>
<top>95</top>
<left>5</left>
<width>390</width>
<height>35</height>
<rotation>0</rotation>
<layer>2</layer>
<defaultProperties>
<property id="dateFormat">M jS @ H:i</property>
<property id="fontFamily">aileron regular</property>
<property id="fontSize">18</property>
<property id="fontColor">#535353</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
<property id="showOverflow">0</property>
<property id="lineHeight">1.5</property>
</defaultProperties>
</element>
<element id="event_location">
<title>Location</title>
<top>130</top>
<left>5</left>
<width>390</width>
<height>25</height>
<layer>2</layer>
<rotation>0</rotation>
<defaultProperties>
<property id="fontFamily">aileron regular</property>
<property id="fontSize">16</property>
<property id="fontColor">#828282</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">flex-start</property>
<property id="showOverflow">0</property>
<property id="justify">1</property>
</defaultProperties>
</element>
</elements>
</stencil>
<assets>
<asset id="calendar-event-simple" type="path" cmsOnly="true" mimeType="image/png" path="/modules/assets/template-thumbnails/event/elements/calendar-event-simple.png" />
</assets>
</template>
<template>
<id>calendar_event_row</id>
<type>element-group</type>
<dataType>event</dataType>
<title>Calendar Event Row</title>
<thumbnail>calendar-event-row</thumbnail>
<stencil>
<hbs></hbs>
<startWidth>600</startWidth>
<startHeight>100</startHeight>
<elements>
<element id="rectangle">
<title>Background</title>
<top>0</top>
<left>0</left>
<layer>0</layer>
<width>600</width>
<height>100</height>
<defaultProperties>
<property id="backgroundColor">rgba(25,25,25,0.7)</property>
<property id="roundBorder">1</property>
<property id="borderRadius">12</property>
<property id="outline">0</property>
</defaultProperties>
</element>
<element id="rectangle">
<title>Separator</title>
<top>0</top>
<left>200</left>
<width>10</width>
<height>100</height>
<layer>1</layer>
<defaultProperties>
<property id="backgroundColor">rgba(201,84,59,0.89)</property>
<property id="outline">0</property>
</defaultProperties>
</element>
<element id="event_startDate">
<title>Day</title>
<top>10</top>
<left>10</left>
<width>180</width>
<height>40</height>
<rotation>0</rotation>
<layer>2</layer>
<defaultProperties>
<property id="dateFormat">d F</property>
<property id="fontFamily">aileron regular</property>
<property id="bold">1</property>
<property id="fontSize">30</property>
<property id="fontColor">#e9e9e9</property>
<property id="horizontalAlign">flex-end</property>
<property id="verticalAlign">center</property>
<property id="showOverflow">0</property>
</defaultProperties>
</element>
<element id="event_startDate">
<title>Week day</title>
<top>50</top>
<left>10</left>
<width>180</width>
<height>40</height>
<rotation>0</rotation>
<layer>2</layer>
<defaultProperties>
<property id="dateFormat">D</property>
<property id="fontFamily">aileron regular</property>
<property id="bold">1</property>
<property id="fontSize">26</property>
<property id="fontColor">#cacaca</property>
<property id="horizontalAlign">flex-end</property>
<property id="verticalAlign">center</property>
<property id="showOverflow">0</property>
</defaultProperties>
</element>
<element id="event_summary">
<title>Summary</title>
<top>10</top>
<left>220</left>
<width>380</width>
<height>40</height>
<rotation>0</rotation>
<layer>2</layer>
<defaultProperties>
<property id="fontFamily">aileron regular</property>
<property id="bold">1</property>
<property id="fontSize">30</property>
<property id="fontColor">#e9e9e9</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
<property id="showOverflow">0</property>
</defaultProperties>
</element>
<element id="event_startDate">
<title>Start Date</title>
<top>50</top>
<left>220</left>
<width>60</width>
<height>40</height>
<rotation>0</rotation>
<layer>2</layer>
<defaultProperties>
<property id="dateFormat">H:i</property>
<property id="fontFamily">aileron regular</property>
<property id="bold">1</property>
<property id="fontSize">20</property>
<property id="fontColor">#d18170</property>
<property id="horizontalAlign">flex-end</property>
<property id="verticalAlign">center</property>
<property id="showOverflow">0</property>
<property id="lineHeight">2</property>
</defaultProperties>
</element>
<element id="event_endDate">
<title>End Date</title>
<top>50</top>
<left>285</left>
<width>65</width>
<height>40</height>
<rotation>0</rotation>
<layer>2</layer>
<defaultProperties>
<property id="dateFormat">- H:i</property>
<property id="fontFamily">aileron regular</property>
<property id="bold">1</property>
<property id="fontSize">20</property>
<property id="fontColor">#d18170</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
<property id="showOverflow">0</property>
<property id="lineHeight">2</property>
</defaultProperties>
</element>
<element id="event_location">
<title>Location</title>
<top>50</top>
<left>360</left>
<width>230</width>
<height>40</height>
<layer>2</layer>
<rotation>0</rotation>
<defaultProperties>
<property id="fontFamily">aileron regular</property>
<property id="fontSize">18</property>
<property id="fontColor">#bcbcbc</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">flex-start</property>
<property id="showOverflow">0</property>
<property id="lineHeight">2</property>
</defaultProperties>
</element>
</elements>
</stencil>
<assets>
<asset id="calendar-event-row" type="path" cmsOnly="true" mimeType="image/png" path="/modules/assets/template-thumbnails/event/elements/calendar-event-row.png" />
</assets>
</template>
</templates>

3367
modules/templates/event-static.xml Normal file
View File

File diff suppressed because it is too large Load Diff

1335
modules/templates/forecast-elements.xml Normal file
View File

File diff suppressed because it is too large Load Diff

7155
modules/templates/forecast-static.xml Normal file
View File

File diff suppressed because it is too large Load Diff

2028
modules/templates/global-elements.xml Normal file
View File

File diff suppressed because it is too large Load Diff

67
modules/templates/message-elements.xml Normal file
View File

@@ -0,0 +1,67 @@
<!--
~ 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/>.
-->
<templates>
<template>
<id>message_subject</id>
<extends override="text" with="data.subject">text</extends>
<title>Subject</title>
<type>element</type>
<dataType>message</dataType>
<icon>fas fa-font</icon>
<canRotate>true</canRotate>
<startWidth>500</startWidth>
<startHeight>100</startHeight>
</template>
<template>
<id>message_body</id>
<extends override="text" with="data.body">text</extends>
<title>Body</title>
<type>element</type>
<dataType>message</dataType>
<icon>fas fa-envelope</icon>
<canRotate>true</canRotate>
<startWidth>500</startWidth>
<startHeight>100</startHeight>
</template>
<template>
<id>message_date</id>
<extends override="date" with="data.date">date</extends>
<title>Date</title>
<type>element</type>
<dataType>message</dataType>
<icon>fas fa-calendar-week</icon>
<canRotate>true</canRotate>
<startWidth>500</startWidth>
<startHeight>100</startHeight>
</template>
<template>
<id>message_created_date</id>
<extends override="date" with="data.createdAt">date</extends>
<title>Created Date</title>
<type>element</type>
<dataType>message</dataType>
<icon>fas fa-calendar-week</icon>
<canRotate>true</canRotate>
<startWidth>500</startWidth>
<startHeight>100</startHeight>
</template>
</templates>

125
modules/templates/message-static.xml Normal file
View File

@@ -0,0 +1,125 @@
<!--
~ 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/>.
-->
<templates>
<template>
<id>message_custom_html</id>
<type>static</type>
<dataType>message</dataType>
<showIn>none</showIn>
<properties>
<property id="dateFormat" type="text" variant="dateFormat">
<title>Date Format</title>
<helpText>The format to apply to all dates returned by the Widget.</helpText>
<default>#DATE_FORMAT#</default>
</property>
<property id="template" type="richText" allowLibraryRefs="true" variant="html">
<title>Main Template</title>
<helpText>The template for formatting your notifications. Enter [Subject] and [Body] with your desired formatting. Enter text or HTML in the box below.</helpText>
</property>
<property id="dateFormatSnippets" type="snippet" mode="options" target="template">
<title>Snippets</title>
<helpText>Choose element to add to template</helpText>
<options>
<option name="Subject">Subject</option>
<option name="Body">Body</option>
<option name="Date">Date</option>
</options>
</property>
<property id="embedStyle" type="code" allowLibraryRefs="true" variant="css">
<title>Custom Style Sheets</title>
</property>
<property id="noDataMessage" type="richText" allowLibraryRefs="true" variant="html">
<title>No data message</title>
<helpText>A message to display when there are no notifications to show. Enter text or HTML in the box below.</helpText>
</property>
<property id="effect" type="effectSelector" variant="all">
<title>Effect</title>
<helpText>Please select the effect that will be used to transition between items.</helpText>
<default>noTransition</default>
</property>
<property id="speed" type="number">
<title>Speed</title>
<helpText>The transition speed of the selected effect in milliseconds (normal = 1000) or the Marquee Speed in a low to high scale (normal = 1).</helpText>
<visibility>
<test>
<condition field="effect" type="neq">noTransition</condition>
</test>
</visibility>
</property>
</properties>
<stencil>
<twig><![CDATA[
{% if javaScript %}
<script type="text/javascript">
{{javaScript|raw}}
</script>
{% endif %}
]]></twig>
<style><![CDATA[
{{embedStyle|raw}}
]]></style>
</stencil>
<onTemplateRender><![CDATA[
// id: The id of the widget
// target: The target element to render
// items: The items to render
// properties: The properties for the widget
// -------------------------------------------
// Adjust some misformed template options.
if (properties.template && properties.template.indexOf('[Body]') >= 0) {
properties.template = properties.template.replace('[Body]', '[body]');
}
if (properties.template && properties.template.indexOf('[Subject]') >= 0) {
properties.template = properties.template.replace('[Subject]', '[subject]');
}
if (properties.template && properties.template.indexOf('[Date]') >= 0) {
properties.template = properties.template.replace('[Date]', '[date]');
}
if (items.length > 0) {
items = $(items).xiboSubstitutesParser(properties.template, properties.dateFormat, ['date', 'createdAt']);
}
// No data message
if (items.length <= 0 && properties.noDataMessage && properties.noDataMessage !== '') {
items.push(properties.noDataMessage);
}
// Clear container
$(target).find('#content').empty();
// Add items to container
for (var index = 0; index < items.length; index++) {
$(items[index]).appendTo($(target).find('#content'));
}
// Render
$(target).xiboLayoutScaler(properties);
$(target).xiboTextRender(properties, $(target).find('#content > *'));
$(target).find('img').xiboImageRender(properties);
]]></onTemplateRender>
<onTemplateVisible><![CDATA[
// Start effects for this template
$(target).xiboLayoutAnimate(properties);
]]></onTemplateVisible>
</template>
</templates>

54
modules/templates/product-category-elements.xml Normal file
View File

@@ -0,0 +1,54 @@
<!--
~ 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/>.
-->
<templates>
<template>
<id>product_category_name</id>
<extends override="text" with="data.name">text</extends>
<title>Name</title>
<type>element</type>
<dataType>product-category</dataType>
<icon>fas fa-font</icon>
<canRotate>true</canRotate>
<startWidth>500</startWidth>
<startHeight>100</startHeight>
</template>
<template>
<id>product_category_description</id>
<extends override="text" with="data.description">text</extends>
<title>Description</title>
<type>element</type>
<dataType>product-category</dataType>
<icon>fas fa-font</icon>
<canRotate>true</canRotate>
<startWidth>500</startWidth>
<startHeight>100</startHeight>
</template>
<template>
<id>product_category_photo</id>
<extends override="url" with="data.image">global_image</extends>
<type>element</type>
<dataType>product-category</dataType>
<icon>fas fa-image</icon>
<title>Category Photo</title>
<startWidth>100</startWidth>
<startHeight>100</startHeight>
</template>
</templates>

475
modules/templates/product-elements.xml Normal file
View File

@@ -0,0 +1,475 @@
<!--
~ 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/>.
-->
<templates>
<template>
<id>product_name</id>
<extends override="text" with="data.name">text</extends>
<title>Name</title>
<type>element</type>
<dataType>product</dataType>
<icon>fas fa-font</icon>
<canRotate>true</canRotate>
<startWidth>500</startWidth>
<startHeight>100</startHeight>
<properties>
<property id="dimWhenUnavailable" type="checkbox">
<title>Dim when unavailable?</title>
<default>0</default>
</property>
<property id="dimColor" type="color">
<title>Dim Colour</title>
<default>#888</default>
<visibility>
<test>
<condition field="dimWhenUnavailable" type="eq">1</condition>
</test>
</visibility>
</property>
</properties>
<onTemplateRender><![CDATA[
if (properties.dimWhenUnavailable && properties.data && properties.data.availability === 0) {
$(target).find('div:first').css('color', properties.dimColor);
}
if(properties.fitToArea) {
// Set target for the text
properties.fitTarget = 'div';
// Scale text to container
$(target).find('.global-elements-text').xiboTextScaler(properties);
}
]]></onTemplateRender>
</template>
<template>
<id>product_description</id>
<extends override="text" with="data.description">text</extends>
<title>Description</title>
<type>element</type>
<dataType>product</dataType>
<icon>fas fa-font</icon>
<canRotate>true</canRotate>
<startWidth>500</startWidth>
<startHeight>100</startHeight>
</template>
<template>
<id>product_price</id>
<extends override="text" with="data.price">text</extends>
<title>Price</title>
<type>element</type>
<dataType>product</dataType>
<icon>fas fa-money-bill-alt</icon>
<canRotate>true</canRotate>
<startWidth>500</startWidth>
<startHeight>100</startHeight>
<properties>
<property id="currencyCode" type="text">
<title>Currency Code</title>
<helpText>The 3 digit currency code to apply to the price, e.g. USD/GBP/EUR</helpText>
<default></default>
</property>
<property id="prefix" type="text">
<title>Prefix</title>
<default></default>
</property>
<property id="suffix" type="text">
<title>Suffix</title>
<default></default>
</property>
</properties>
<onElementParseData><![CDATA[
// value - element to be parsed
// properties
if (String(value).length === 0) {
return '';
}
var options = {};
if (properties.currencyCode && properties.currencyCode !== '') {
options.style = 'currency';
options.currency = properties.currencyCode;
} else {
options.minimumFractionDigits = 2;
}
value = new Intl.NumberFormat(undefined, options).format(value);
if (properties.prefix && properties.prefix !== '') {
value = properties.prefix + '' + value;
}
if (properties.suffix && properties.suffix !== '') {
value = value + '' + properties.suffix;
}
return value;
]]></onElementParseData>
</template>
<template>
<id>product_allergy_info</id>
<extends override="text" with="data.allergyInfo">text</extends>
<title>Allergy info</title>
<type>element</type>
<dataType>product</dataType>
<icon>fas fa-allergies</icon>
<canRotate>true</canRotate>
<startWidth>500</startWidth>
<startHeight>100</startHeight>
</template>
<template>
<id>product_photo</id>
<extends override="url" with="data.image">global_image</extends>
<type>element</type>
<dataType>product</dataType>
<icon>fas fa-image</icon>
<title>Photo</title>
<startWidth>100</startWidth>
<startHeight>100</startHeight>
</template>
<template>
<id>product_options_name</id>
<title>Options: Name</title>
<type>element</type>
<dataType>product</dataType>
<icon>fas fa-list</icon>
<canRotate>true</canRotate>
<startWidth>500</startWidth>
<startHeight>100</startHeight>
<properties>
<property id="optionSlot" type="number">
<title>Option slot</title>
<default>1</default>
</property>
<property id="fitToArea" type="checkbox">
<title>Fit to selection</title>
<playerCompatibility tizen=""></playerCompatibility>
<helpText>Fit to selected area instead of using the font size?</helpText>
<default>0</default>
</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="fontSize" type="number">
<title>Font Size</title>
<default>24</default>
<visibility>
<test>
<condition field="fitToArea" type="neq">1</condition>
</test>
</visibility>
</property>
<property id="fontColor" type="color">
<title>Font Colour</title>
<default>%THEME_COLOR%</default>
</property>
<property id="prefix" type="text">
<title>Prefix</title>
<default></default>
</property>
<property id="suffix" type="text">
<title>Suffix</title>
<default></default>
</property>
<property id="horizontalAlign" type="dropdown">
<title>Horizontal Align</title>
<default>center</default>
<visibility>
<test>
<condition field="fitToArea" type="neq">1</condition>
</test>
</visibility>
<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="product-elements-options-name"
style="
display: flex;
{{#if fitToArea}}
white-space: nowrap;
{{else}}
{{#if horizontalAlign}}
justify-content: {{horizontalAlign}};
{{/if}}
{{#if fontFamily}}font-family: {{fontFamily}};{{/if}}
{{#if fontSize}}font-size: {{fontSize}}px;{{/if}}
{{#eq horizontalAlign "flex-start"}}text-align: left;{{/eq}}
{{#eq horizontalAlign "center"}}text-align: center;{{/eq}}
{{#eq horizontalAlign "flex-end"}}text-align: right;{{/eq}}
{{/if}}
{{#if fontColor}}color: {{fontColor}};{{/if}}
{{#if verticalAlign}}align-items: {{verticalAlign}};{{/if}}
overflow: hidden;
width: 100%; height: 100%;"
><div></div>
</div>
]]></hbs>
</stencil>
<onTemplateRender><![CDATA[
var optionSlot = Number(properties.optionSlot) - 1;
var $productContainer = null;
if ($(target).is('.element-content')) {
$productContainer = $(target).find('.product-elements-options-name');
} else {
$productContainer = $(target);
}
if (
properties.data &&
properties.data.productOptions &&
properties.data.productOptions.length > 0 &&
properties.data.productOptions[optionSlot]
) {
var option = properties.data.productOptions[optionSlot];
var name = option.name;
if (properties.prefix && properties.prefix !== '') {
name = properties.prefix + '' + name;
}
if (properties.suffix && properties.suffix !== '') {
name = name + '' + properties.suffix;
}
$productContainer.find('div').html(name);
}
if(properties.fitToArea) {
// Set target for the text
properties.fitTarget = 'div';
// Scale text to container
$(target).find('.product-elements-options-name').xiboTextScaler(properties);
}
]]></onTemplateRender>
</template>
<template>
<id>product_options_value</id>
<title>Options: Value</title>
<type>element</type>
<dataType>product</dataType>
<icon>fas fa-money-bill-alt</icon>
<canRotate>true</canRotate>
<startWidth>500</startWidth>
<startHeight>100</startHeight>
<properties>
<property id="optionSlot" type="number">
<title>Option slot</title>
<default>1</default>
</property>
<property id="fitToArea" type="checkbox">
<title>Fit to selection</title>
<playerCompatibility tizen=""></playerCompatibility>
<helpText>Fit to selected area instead of using the font size?</helpText>
<default>0</default>
</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="fontSize" type="number">
<title>Font Size</title>
<default>24</default>
<visibility>
<test>
<condition field="fitToArea" type="neq">1</condition>
</test>
</visibility>
</property>
<property id="fontColor" type="color">
<title>Font Colour</title>
<default>%THEME_COLOR%</default>
</property>
<property id="currencyCode" type="text">
<title>Currency Code</title>
<helpText>The 3 digit currency code to apply to the price, e.g. USD/GBP/EUR</helpText>
<default></default>
</property>
<property id="prefix" type="text">
<title>Prefix</title>
<default></default>
</property>
<property id="suffix" type="text">
<title>Suffix</title>
<default></default>
</property>
<property id="horizontalAlign" type="dropdown">
<title>Horizontal Align</title>
<default>center</default>
<visibility>
<test>
<condition field="fitToArea" type="neq">1</condition>
</test>
</visibility>
<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="product-elements-options-value"
style="
display: flex;
{{#if fitToArea}}
white-space: nowrap;
{{else}}
{{#if horizontalAlign}}
justify-content: {{horizontalAlign}};
{{/if}}
{{#if fontFamily}}font-family: {{fontFamily}};{{/if}}
{{#if fontSize}}font-size: {{fontSize}}px;{{/if}}
{{#eq horizontalAlign "flex-start"}}text-align: left;{{/eq}}
{{#eq horizontalAlign "center"}}text-align: center;{{/eq}}
{{#eq horizontalAlign "flex-end"}}text-align: right;{{/eq}}
{{/if}}
{{#if fontColor}}color: {{fontColor}};{{/if}}
{{#if verticalAlign}}align-items: {{verticalAlign}};{{/if}}
overflow: hidden;
width: 100%; height: 100%;"
><div></div>
</div>
]]></hbs>
</stencil>
<onTemplateRender><![CDATA[
var optionSlot = Number(properties.optionSlot) - 1;
var $productContainer = null;
if ($(target).is('.element-content')) {
$productContainer = $(target).find('.product-elements-options-value');
} else {
$productContainer = $(target);
}
if (
properties.data &&
properties.data.productOptions &&
properties.data.productOptions.length > 0 &&
properties.data.productOptions[optionSlot]
) {
var option = properties.data.productOptions[optionSlot];
var value = option.value;
var options = {};
if (properties.currencyCode && properties.currencyCode !== '') {
options.style = 'currency';
options.currency = properties.currencyCode;
}
value = new Intl.NumberFormat(undefined, options).format(value);
if (properties.prefix && properties.prefix !== '') {
value = properties.prefix + '' + value;
}
if (properties.suffix && properties.suffix !== '') {
value = value + '' + properties.suffix;
}
$productContainer.find('div').html(value);
}
if(properties.fitToArea) {
// Set target for the text
properties.fitTarget = 'div';
// Scale text to container
$(target).find('.product-elements-options-value').xiboTextScaler(properties);
}
]]></onTemplateRender>
</template>
<template>
<id>product_calories</id>
<extends override="text" with="data.calories">text</extends>
<title>Calories</title>
<type>element</type>
<dataType>product</dataType>
<icon>fas fa-weight</icon>
<canRotate>true</canRotate>
<startWidth>500</startWidth>
<startHeight>100</startHeight>
<properties>
<property id="units" type="text">
<title>Units</title>
<default>kcal</default>
</property>
<property id="unitMargin" type="number">
<title>Units margin</title>
<default>4</default>
<visibility>
<test>
<condition field="units" type="neq"></condition>
</test>
</visibility>
</property>
<property id="unitColor" type="color">
<title>Units color</title>
<default></default>
<visibility>
<test>
<condition field="units" type="neq"></condition>
</test>
</visibility>
</property>
<property id="fitToArea" type="hidden">
</property>
</properties>
<onTemplateRender><![CDATA[
if (properties.units != '') {
$(target).find('div:first').append('<span class="calories-label">' + properties.units + '</span>');
if (properties.unitMargin > 0) {
$(target).find('.calories-label').css('margin-left', properties.unitMargin + 'px');
}
if (properties.unitColor != '') {
$(target).find('.calories-label').css('color', properties.unitColor);
}
}
]]></onTemplateRender>
</template>
</templates>

361
modules/templates/social-media-elements.xml Normal file
View File

@@ -0,0 +1,361 @@
<!--
~ 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/>.
-->
<templates>
<template>
<id>profile_photo</id>
<extends override="url" with="data.userProfileImage">global_image</extends>
<type>element</type>
<dataType>social-media</dataType>
<title>Profile Photo</title>
<icon>fas fa-user</icon>
<startWidth>100</startWidth>
<startHeight>100</startHeight>
</template>
<template>
<id>social_media_description</id>
<extends override="text" with="data.text">text</extends>
<title>Description</title>
<type>element</type>
<dataType>social-media</dataType>
<canRotate>true</canRotate>
<icon>fas fa-font</icon>
<startWidth>650</startWidth>
<startHeight>250</startHeight>
</template>
<template>
<id>social_media_screen_name</id>
<extends override="text" with="data.screenName">text</extends>
<title>Screen name</title>
<type>element</type>
<dataType>social-media</dataType>
<canRotate>true</canRotate>
<icon>fas fa-id-card</icon>
<startWidth>650</startWidth>
<startHeight>250</startHeight>
</template>
<template>
<id>social_media_username</id>
<extends override="text" with="data.user">text</extends>
<title>Username</title>
<type>element</type>
<dataType>social-media</dataType>
<canRotate>true</canRotate>
<icon>fas fa-at</icon>
<startWidth>650</startWidth>
<startHeight>250</startHeight>
</template>
<template>
<id>social_media_date</id>
<extends override="date" with="data.date">date</extends>
<title>Date</title>
<type>element</type>
<dataType>social-media</dataType>
<canRotate>true</canRotate>
<icon>fas fa-calendar-week</icon>
<startWidth>450</startWidth>
<startHeight>80</startHeight>
</template>
<template>
<id>post_photo</id>
<extends override="url" with="data.photo">global_image</extends>
<type>element</type>
<dataType>social-media</dataType>
<title>Post Photo</title>
<icon>fas fa-image</icon>
<startWidth>100</startWidth>
<startHeight>100</startHeight>
</template>
<template>
<id>post_horizontal</id>
<type>element-group</type>
<dataType>social-media</dataType>
<title>Post</title>
<thumbnail>social-media-post-horizontal</thumbnail>
<stencil>
<hbs></hbs>
<startWidth>800</startWidth>
<startHeight>200</startHeight>
<elements>
<element id="rectangle">
<title>Background</title>
<top>0</top>
<left>0</left>
<layer>0</layer>
<width>800</width>
<height>200</height>
<defaultProperties>
<property id="backgroundColor">#f4f8ff</property>
<property id="outlineColor">#3c3ad3</property>
<property id="outlineWidth">4</property>
<property id="roundBorder">1</property>
<property id="borderRadius">10</property>
</defaultProperties>
</element>
<element id="profile_photo">
<title>Profile Photo</title>
<top>20</top>
<left>20</left>
<width>160</width>
<height>160</height>
<rotation>0</rotation>
<layer>1</layer>
</element>
<element id="social_media_username">
<title>Username</title>
<top>20</top>
<left>190</left>
<layer>1</layer>
<width>400</width>
<height>40</height>
<rotation>0</rotation>
<defaultProperties>
<property id="fontFamily">aileron regular</property>
<property id="bold">1</property>
<property id="fontSize">24</property>
<property id="fontColor">#3c3ad3</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">flex-start</property>
<property id="showOverflow">0</property>
</defaultProperties>
</element>
<element id="social_media_date">
<title>Date</title>
<top>20</top>
<left>590</left>
<layer>1</layer>
<width>190</width>
<height>40</height>
<rotation>0</rotation>
<defaultProperties>
<property id="dateFormat">H:i - d/m/Y</property>
<property id="fontFamily">aileron regular</property>
<property id="fontSize">20</property>
<property id="fontColor">#3c3ad3</property>
<property id="horizontalAlign">flex-end</property>
<property id="verticalAlign">flex-start</property>
</defaultProperties>
</element>
<element id="social_media_description">
<title>Description</title>
<top>60</top>
<left>190</left>
<layer>1</layer>
<width>590</width>
<height>120</height>
<rotation>0</rotation>
<defaultProperties>
<property id="fontFamily">linear regular</property>
<property id="fontSize">22</property>
<property id="fontColor">#3c3ad3</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">flex-start</property>
<property id="showOverflow">0</property>
</defaultProperties>
</element>
</elements>
</stencil>
<assets>
<asset id="social-media-post-horizontal" type="path" cmsOnly="true" mimeType="image/png" path="/modules/assets/template-thumbnails/social-media/elements/social-media-post-horizontal.png" />
</assets>
</template>
<template>
<id>post_vintage_photo</id>
<type>element-group</type>
<dataType>social-media</dataType>
<title>Vintage Photo</title>
<thumbnail>social-media-post-vintage-photo</thumbnail>
<stencil>
<hbs></hbs>
<startWidth>300</startWidth>
<startHeight>350</startHeight>
<elements>
<element id="rectangle">
<title>Background</title>
<top>0</top>
<left>0</left>
<layer>0</layer>
<width>300</width>
<height>350</height>
<defaultProperties>
<property id="backgroundColor">#f9f9f9</property>
<property id="outlineColor">#333</property>
<property id="outlineWidth">1</property>
</defaultProperties>
</element>
<element id="rectangle">
<title>Photo area</title>
<top>20</top>
<left>20</left>
<layer>1</layer>
<width>260</width>
<height>260</height>
<defaultProperties>
<property id="backgroundColor">#333</property>
<property id="outline">0</property>
</defaultProperties>
</element>
<element id="post_photo">
<title>Post Photo</title>
<top>20</top>
<left>20</left>
<layer>2</layer>
<width>260</width>
<height>260</height>
</element>
<element id="social_media_username">
<title>Username</title>
<top>280</top>
<left>20</left>
<width>260</width>
<height>35</height>
<layer>2</layer>
<rotation>0</rotation>
<defaultProperties>
<property id="fontFamily">linear regular</property>
<property id="bold">1</property>
<property id="fontSize">18</property>
<property id="fontColor">#96614a</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
<property id="showOverflow">0</property>
</defaultProperties>
</element>
<element id="social_media_date">
<title>Date</title>
<top>315</top>
<left>20</left>
<width>260</width>
<height>30</height>
<layer>2</layer>
<rotation>0</rotation>
<defaultProperties>
<property id="dateFormat">F d, Y H:i</property>
<property id="fontFamily">railway regular</property>
<property id="fontSize">16</property>
<property id="fontColor">#626262</property>
<property id="horizontalAlign">flex-end</property>
<property id="verticalAlign">flex-end</property>
<property id="lineHeight">2.5</property>
</defaultProperties>
</element>
</elements>
</stencil>
<assets>
<asset id="social-media-post-vintage-photo" type="path" cmsOnly="true" mimeType="image/png" path="/modules/assets/template-thumbnails/social-media/elements/social-media-post-vintage-photo.png" />
</assets>
</template>
<template>
<id>post_dark</id>
<type>element-group</type>
<dataType>social-media</dataType>
<title>Post - Dark</title>
<thumbnail>social-media-post-dark</thumbnail>
<stencil>
<hbs></hbs>
<startWidth>440</startWidth>
<startHeight>250</startHeight>
<elements>
<element id="rectangle">
<title>Background</title>
<top>0</top>
<left>0</left>
<layer>0</layer>
<width>440</width>
<height>250</height>
<defaultProperties>
<property id="backgroundColor">rgba(0,0,0,0.60)</property>
<property id="outline">0</property>
</defaultProperties>
</element>
<element id="profile_photo">
<title>Profile Photo</title>
<top>20</top>
<left>20</left>
<width>80</width>
<height>80</height>
<rotation>0</rotation>
<layer>1</layer>
<defaultProperties>
<property id="objectFit">fill</property>
<property id="roundBorder">1</property>
</defaultProperties>
</element>
<element id="social_media_username">
<title>Username</title>
<top>25</top>
<left>110</left>
<width>300</width>
<height>30</height>
<layer>1</layer>
<rotation>0</rotation>
<defaultProperties>
<property id="fontFamily">linear regular</property>
<property id="bold">1</property>
<property id="fontSize">22</property>
<property id="fontColor">#ffffff</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">flex-start</property>
<property id="showOverflow">0</property>
</defaultProperties>
</element>
<element id="social_media_date">
<title>Date</title>
<top>55</top>
<left>110</left>
<width>300</width>
<height>30</height>
<layer>1</layer>
<rotation>0</rotation>
<defaultProperties>
<property id="dateFormat">M d, H:i</property>
<property id="fontFamily">linear regular</property>
<property id="fontSize">20</property>
<property id="fontColor">#aeaeae</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">flex-start</property>
</defaultProperties>
</element>
<element id="social_media_description">
<title>Description</title>
<top>105</top>
<left>20</left>
<width>400</width>
<height>125</height>
<layer>1</layer>
<rotation>0</rotation>
<defaultProperties>
<property id="fontFamily">linear regular</property>
<property id="fontSize">20</property>
<property id="fontColor">#fff</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">flex-start</property>
<property id="showOverflow">0</property>
<property id="justify">1</property>
<property id="lineHeight">1</property>
</defaultProperties>
</element>
</elements>
</stencil>
<assets>
<asset id="social-media-post-dark" type="path" cmsOnly="true" mimeType="image/png" path="/modules/assets/template-thumbnails/social-media/elements/social-media-post-dark.png" />
</assets>
</template>
</templates>

3084
modules/templates/social-media-static.xml Normal file
View File

File diff suppressed because it is too large Load Diff

734
modules/templates/stock-elements.xml Normal file
View File

@@ -0,0 +1,734 @@
<!--
~ 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/>.
-->
<templates>
<template>
<id>stock_name</id>
<extends override="text" with="data.Name">text</extends>
<title>Name</title>
<type>element</type>
<dataType>stock</dataType>
<canRotate>true</canRotate>
<icon>fas fa-font</icon>
<startWidth>420</startWidth>
<startHeight>100</startHeight>
</template>
<template>
<id>stock_symbol</id>
<extends override="text" with="data.SymbolTrimmed">text</extends>
<title>Symbol</title>
<type>element</type>
<dataType>stock</dataType>
<canRotate>true</canRotate>
<icon>fas fa-font</icon>
<startWidth>420</startWidth>
<startHeight>100</startHeight>
</template>
<template>
<id>stock_lastTradePrice</id>
<extends override="text" with="data.LastTradePriceOnly">text</extends>
<title>Last Trade Price</title>
<type>element</type>
<dataType>stock</dataType>
<icon>fas fa-money-bill-alt</icon>
<canRotate>true</canRotate>date
<startWidth>200</startWidth>
<startHeight>100</startHeight>
</template>
<template>
<id>stock_changePercentage</id>
<extends override="text" with="data.ChangePercentage">text</extends>
<title>Change Percentage</title>
<type>element</type>
<dataType>stock</dataType>
<canRotate>true</canRotate>
<icon>fas fa-percentage</icon>
<startWidth>200</startWidth>
<startHeight>100</startHeight>
<onElementParseData><![CDATA[
// value - element to be parsed
if (String(value).length === 0) {
return '';
}
if (String(value).includes('%')) {
return value;
}
return value + '%';
]]></onElementParseData>
<onTemplateRender><![CDATA[
var elementData = null;
if (properties.hasOwnProperty('data')) {
elementData = properties.data;
}
if (elementData !== null && elementData.hasOwnProperty('ChangeStyle')) {
var changeStyle = elementData.ChangeStyle;
var $changePercent = $(target).find('div:first');
if (changeStyle === 'value-equal') {
$changePercent.css({color: 'gray'});
} else {
$changePercent.css({color: changeStyle === 'value-down' ? 'red' : 'green'});
}
}
if(properties.fitToArea) {
// Set target for the text
properties.fitTarget = 'div';
// Scale text to container
$(target).find('.global-elements-text').xiboTextScaler(properties);
}
]]></onTemplateRender>
</template>
<template>
<id>stock_changeIcon</id>
<title>Stock Icon</title>
<type>element</type>
<dataType>stock</dataType>
<canRotate>true</canRotate>
<icon>fas fa-arrows-alt-v</icon>
<startWidth>80</startWidth>
<startHeight>60</startHeight>
<stencil>
<hbs><![CDATA[
<div class="stock-elements-icon" data-css-url="[[assetId=font-awesome]]" style="width: 100%;
height: 100%;
position: relative;
display: inline-block;
text-align: center;">
<div class="fa {{data.ChangeIcon}}
{{#eq data.ChangeIcon "up-arrow"}}fa-caret-up{{/eq}}
{{#eq data.ChangeIcon "down-arrow"}}fa-caret-down{{/eq}}
{{#eq data.ChangeIcon "right-arrow"}}fa-caret-right{{/eq}}"
style="
font-size: calc({{prop.width}}px * 0.75);
{{#if prop.height}}line-height: {{prop.height}}px;{{/if}}
{{#eq data.ChangeIcon "up-arrow"}}color: green;{{/eq}}
{{#eq data.ChangeIcon "down-arrow"}}color: red;{{/eq}}
{{#eq data.ChangeIcon "right-arrow"}}color: gray;{{/eq}}
"></div></div>
]]></hbs>
</stencil>
<onTemplateRender><![CDATA[
var $arrowContainer = $(target).find('.stock-elements-icon');
var $targetContainer = $(target).is('body') ? $('body') : $(target).parent().parent();
// Inject CSS into target container if it's not added yet
if ($targetContainer.find('.sampleCSS').length == 0) {
$targetContainer.prepend(`<link rel="stylesheet" href="${$arrowContainer.data('cssUrl')}" class="sampleCSS" media="screen"/>`);
}
]]></onTemplateRender>
<assets>
<asset id="font-awesome" type="path" mimeType="text/css" path="/modules/assets/common/font-awesome.min.css" />
<asset id="fontawesome-webfont.ttf" type="path" mimeType="application/x-font-ttf" path="/modules/assets/common/fontawesome-webfont.ttf"></asset>
<asset id="fontawesome-webfont.woff" type="path" mimeType="application/font-woff" path="/modules/assets/common/fontawesome-webfont.woff"></asset>
<asset id="fontawesome-webfont.woff2" type="path" mimeType="application/font-woff2" path="/modules/assets/common/fontawesome-webfont.woff2"></asset>
</assets>
</template>
<template>
<id>stocks_single_1</id>
<type>element-group</type>
<dataType>stock</dataType>
<title>Stocks - Single 1</title>
<thumbnail>stocks-single-1</thumbnail>
<stencil>
<hbs></hbs>
<startWidth>419</startWidth>
<startHeight>169</startHeight>
<elements>
<element id="rectangle">
<title>Background</title>
<layer>0</layer>
<top>0</top>
<left>0</left>
<width>419</width>
<height>169</height>
<defaultProperties>
<property id="backgroundColor">#001061</property>
<property id="roundBorder">1</property>
<property id="borderRadius">20</property>
<property id="outline">0</property>
</defaultProperties>
</element>
<element id="rectangle">
<title>Temp area</title>
<layer>2</layer>
<top>20</top>
<left>28</left>
<width>124</width>
<height>124</height>
<defaultProperties>
<property id="backgroundColor">#fff</property>
<property id="roundBorder">1</property>
<property id="borderRadius">10</property>
<property id="outline">0</property>
</defaultProperties>
</element>
<element id="stock_changeIcon">
<title>Stock change icon</title>
<layer>4</layer>
<top>31</top>
<left>40</left>
<width>100</width>
<height>100</height>
</element>
<element id="stock_name">
<title>Stock name</title>
<layer>4</layer>
<top>21</top>
<left>185</left>
<width>208</width>
<height>63</height>
<defaultProperties>
<property id="fontFamily">Poppins Regular</property>
<property id="fontColor">#fff</property>
<property id="fontSize">40</property>
<property id="bold">1</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
<property id="textWrap">0</property>
<property id="showOverflow">0</property>
</defaultProperties>
</element>
<element id="text">
<title>Stocks symbol</title>
<layer>8</layer>
<top>85</top>
<left>184</left>
<width>39</width>
<height>63</height>
<defaultProperties>
<property id="text">$</property>
<property id="fontFamily">Poppins Regular</property>
<property id="fontColor">#fff</property>
<property id="fontSize">40</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
</defaultProperties>
</element>
<element id="stock_lastTradePrice">
<title>Last trade price</title>
<layer>3</layer>
<top>85</top>
<left>223</left>
<width>169</width>
<height>63</height>
<defaultProperties>
<property id="fontFamily">Poppins Regular</property>
<property id="fontColor">#fff</property>
<property id="fontSize">40</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
</defaultProperties>
</element>
</elements>
</stencil>
<assets>
<asset id="stocks-single-1" type="path" cmsOnly="true" mimeType="image/png" path="/modules/assets/template-thumbnails/stocks/elements/stocks-single-1.png" />
</assets>
</template>
<template>
<id>stocks_single_2</id>
<type>element-group</type>
<dataType>stock</dataType>
<title>Stocks - Single 2</title>
<thumbnail>stocks-single-2</thumbnail>
<stencil>
<hbs></hbs>
<startWidth>479</startWidth>
<startHeight>225</startHeight>
<elements>
<element id="rectangle">
<title>Background</title>
<layer>0</layer>
<top>0</top>
<left>0</left>
<width>479</width>
<height>225</height>
<defaultProperties>
<property id="backgroundColor">#171717</property>
<property id="roundBorder">1</property>
<property id="borderRadius">20</property>
<property id="outline">0</property>
</defaultProperties>
</element>
<element id="stock_name">
<title>Stock name</title>
<layer>4</layer>
<top>41</top>
<left>44</left>
<width>392</width>
<height>63</height>
<defaultProperties>
<property id="fontFamily">open sans regular</property>
<property id="fontColor">#fff</property>
<property id="fontSize">60</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
<property id="textWrap">0</property>
<property id="showOverflow">0</property>
</defaultProperties>
</element>
<element id="text">
<title>Stock symbol</title>
<layer>8</layer>
<top>124</top>
<left>45</left>
<width>39</width>
<height>64</height>
<defaultProperties>
<property id="text">$</property>
<property id="fontFamily">open sans regular</property>
<property id="fontColor">#b4b4b4</property>
<property id="fontSize">40</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
</defaultProperties>
</element>
<element id="stock_lastTradePrice">
<title>Last trade price</title>
<layer>3</layer>
<top>124</top>
<left>84</left>
<width>119</width>
<height>63</height>
<defaultProperties>
<property id="fontFamily">open sans regular</property>
<property id="fontColor">#b4b4b4</property>
<property id="fontSize">40</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
</defaultProperties>
</element>
<element id="stock_changeIcon">
<title>Stock change icon</title>
<layer>10</layer>
<top>125</top>
<left>222</left>
<width>58</width>
<height>63</height>
</element>
<element id="stock_changePercentage">
<title>Change percentage</title>
<layer>9</layer>
<top>124</top>
<left>288</left>
<width>148</width>
<height>63</height>
<defaultProperties>
<property id="fontFamily">open sans regular</property>
<property id="fontSize">40</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
</defaultProperties>
</element>
</elements>
</stencil>
<assets>
<asset id="stocks-single-2" type="path" cmsOnly="true" mimeType="image/png" path="/modules/assets/template-thumbnails/stocks/elements/stocks-single-2.png" />
</assets>
</template>
<template>
<id>stocks_group_1</id>
<type>element-group</type>
<dataType>stock</dataType>
<title>Stocks - Group 1</title>
<thumbnail>stocks-group-1</thumbnail>
<stencil>
<hbs></hbs>
<startWidth>482</startWidth>
<startHeight>683</startHeight>
<elementGroups>
<elementGroup id="group_0">
<title>Background group</title>
<layer>0</layer>
<top>0</top>
<left>0</left>
<width>482</width>
<height>683</height>
<slot>0</slot>
<pinSlot>1</pinSlot>
</elementGroup>
<elementGroup id="group_1">
<title>Group 1</title>
<layer>3</layer>
<top>38</top>
<left>40</left>
<width>400</width>
<height>63</height>
<slot>0</slot>
</elementGroup>
<elementGroup id="group_2">
<title>Group 2</title>
<layer>3</layer>
<top>179</top>
<left>40</left>
<width>400</width>
<height>63</height>
<slot>1</slot>
</elementGroup>
<elementGroup id="group_3">
<title>Group 3</title>
<layer>3</layer>
<top>312</top>
<left>40</left>
<width>400</width>
<height>63</height>
<slot>2</slot>
</elementGroup>
<elementGroup id="group_4">
<title>Group 4</title>
<layer>3</layer>
<top>445</top>
<left>40</left>
<width>400</width>
<height>63</height>
<slot>3</slot>
</elementGroup>
<elementGroup id="group_5">
<title>Group 5</title>
<layer>3</layer>
<top>582</top>
<left>40</left>
<width>400</width>
<height>63</height>
<slot>4</slot>
</elementGroup>
</elementGroups>
<elements>
<element id="rectangle" elementGroupId="group_0">
<title>Background</title>
<layer>1</layer>
<top>0</top>
<left>0</left>
<width>482</width>
<height>683</height>
<defaultProperties>
<property id="backgroundColor">#171717</property>
<property id="outline">1</property>
<property id="outlineColor">#b4b4b4</property>
<property id="outlineWidth">2</property>
<property id="roundBorder">1</property>
<property id="borderRadius">20</property>
</defaultProperties>
</element>
<element id="line" elementGroupId="group_0">
<title>Separator 1</title>
<layer>5</layer>
<top>116</top>
<left>36</left>
<width>402</width>
<height>48</height>
<defaultProperties>
<property id="lineColor">#b4b4b4</property>
<property id="lineWidth">2</property>
</defaultProperties>
</element>
<element id="line" elementGroupId="group_0">
<title>Separator 2</title>
<layer>5</layer>
<top>253</top>
<left>36</left>
<width>402</width>
<height>48</height>
<defaultProperties>
<property id="lineColor">#b4b4b4</property>
<property id="lineWidth">2</property>
</defaultProperties>
</element>
<element id="line" elementGroupId="group_0">
<title>Separator 3</title>
<layer>5</layer>
<top>386</top>
<left>36</left>
<width>402</width>
<height>48</height>
<defaultProperties>
<property id="lineColor">#b4b4b4</property>
<property id="lineWidth">2</property>
</defaultProperties>
</element>
<element id="line" elementGroupId="group_0">
<title>Separator 4</title>
<layer>5</layer>
<top>523</top>
<left>36</left>
<width>402</width>
<height>48</height>
<defaultProperties>
<property id="lineColor">#b4b4b4</property>
<property id="lineWidth">2</property>
</defaultProperties>
</element>
<element id="stock_name" elementGroupId="group_1">
<title>Stock name</title>
<layer>4</layer>
<top>0</top>
<left>0</left>
<width>203</width>
<height>63</height>
<defaultProperties>
<property id="fontFamily">Poppins Regular</property>
<property id="fontColor">#fff</property>
<property id="fontSize">40</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
<property id="textWrap">0</property>
<property id="showOverflow">0</property>
<property id="bold">1</property>
</defaultProperties>
</element>
<element id="text" elementGroupId="group_1">
<title>Stock symbol</title>
<layer>8</layer>
<top>0</top>
<left>225</left>
<width>39</width>
<height>63</height>
<defaultProperties>
<property id="text">$</property>
<property id="fontFamily">Poppins Regular</property>
<property id="fontColor">#b4b4b4</property>
<property id="fontSize">40</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
</defaultProperties>
</element>
<element id="stock_lastTradePrice" elementGroupId="group_1">
<title>Last trade price</title>
<layer>3</layer>
<top>0</top>
<left>264</left>
<width>136</width>
<height>63</height>
<defaultProperties>
<property id="fontFamily">Poppins Regular</property>
<property id="fontColor">#b4b4b4</property>
<property id="fontSize">40</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
</defaultProperties>
</element>
<element id="stock_name" elementGroupId="group_2">
<title>Stock name</title>
<layer>4</layer>
<top>0</top>
<left>0</left>
<width>203</width>
<height>63</height>
<defaultProperties>
<property id="fontFamily">Poppins Regular</property>
<property id="fontColor">#fff</property>
<property id="fontSize">40</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
<property id="textWrap">0</property>
<property id="showOverflow">0</property>
<property id="bold">1</property>
</defaultProperties>
</element>
<element id="text" elementGroupId="group_2">
<title>Stock symbol</title>
<layer>8</layer>
<top>0</top>
<left>225</left>
<width>39</width>
<height>63</height>
<defaultProperties>
<property id="text">$</property>
<property id="fontFamily">Poppins Regular</property>
<property id="fontColor">#b4b4b4</property>
<property id="fontSize">40</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
</defaultProperties>
</element>
<element id="stock_lastTradePrice" elementGroupId="group_2">
<title>Last trade price</title>
<layer>3</layer>
<top>0</top>
<left>264</left>
<width>136</width>
<height>63</height>
<defaultProperties>
<property id="fontFamily">Poppins Regular</property>
<property id="fontColor">#b4b4b4</property>
<property id="fontSize">40</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
</defaultProperties>
</element>
<element id="stock_name" elementGroupId="group_3">
<title>Stock name</title>
<layer>4</layer>
<top>0</top>
<left>0</left>
<width>203</width>
<height>63</height>
<defaultProperties>
<property id="fontFamily">Poppins Regular</property>
<property id="fontColor">#fff</property>
<property id="fontSize">40</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
<property id="textWrap">0</property>
<property id="showOverflow">0</property>
<property id="bold">1</property>
</defaultProperties>
</element>
<element id="text" elementGroupId="group_3">
<title>Stock symbol</title>
<layer>8</layer>
<top>0</top>
<left>225</left>
<width>39</width>
<height>63</height>
<defaultProperties>
<property id="text">$</property>
<property id="fontFamily">Poppins Regular</property>
<property id="fontColor">#b4b4b4</property>
<property id="fontSize">40</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
</defaultProperties>
</element>
<element id="stock_lastTradePrice" elementGroupId="group_3">
<title>Last trade price</title>
<layer>3</layer>
<top>0</top>
<left>264</left>
<width>136</width>
<height>63</height>
<defaultProperties>
<property id="fontFamily">Poppins Regular</property>
<property id="fontColor">#b4b4b4</property>
<property id="fontSize">40</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
</defaultProperties>
</element>
<element id="stock_name" elementGroupId="group_4">
<title>Stock name</title>
<layer>4</layer>
<top>0</top>
<left>0</left>
<width>203</width>
<height>63</height>
<defaultProperties>
<property id="fontFamily">Poppins Regular</property>
<property id="fontColor">#fff</property>
<property id="fontSize">40</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
<property id="textWrap">0</property>
<property id="showOverflow">0</property>
<property id="bold">1</property>
</defaultProperties>
</element>
<element id="text" elementGroupId="group_4">
<title>Stock symbol</title>
<layer>8</layer>
<top>0</top>
<left>225</left>
<width>39</width>
<height>63</height>
<defaultProperties>
<property id="text">$</property>
<property id="fontFamily">Poppins Regular</property>
<property id="fontColor">#b4b4b4</property>
<property id="fontSize">40</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
</defaultProperties>
</element>
<element id="stock_lastTradePrice" elementGroupId="group_4">
<title>Last trade price</title>
<layer>3</layer>
<top>0</top>
<left>264</left>
<width>136</width>
<height>63</height>
<defaultProperties>
<property id="fontFamily">Poppins Regular</property>
<property id="fontColor">#b4b4b4</property>
<property id="fontSize">40</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
</defaultProperties>
</element>
<element id="stock_name" elementGroupId="group_5">
<title>Stock name</title>
<layer>4</layer>
<top>0</top>
<left>0</left>
<width>203</width>
<height>63</height>
<defaultProperties>
<property id="fontFamily">Poppins Regular</property>
<property id="fontColor">#fff</property>
<property id="fontSize">40</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
<property id="textWrap">0</property>
<property id="showOverflow">0</property>
<property id="bold">1</property>
</defaultProperties>
</element>
<element id="text" elementGroupId="group_5">
<title>Stock symbol</title>
<layer>8</layer>
<top>0</top>
<left>225</left>
<width>39</width>
<height>63</height>
<defaultProperties>
<property id="text">$</property>
<property id="fontFamily">Poppins Regular</property>
<property id="fontColor">#b4b4b4</property>
<property id="fontSize">40</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
</defaultProperties>
</element>
<element id="stock_lastTradePrice" elementGroupId="group_5">
<title>Last trade price</title>
<layer>3</layer>
<top>0</top>
<left>264</left>
<width>136</width>
<height>63</height>
<defaultProperties>
<property id="fontFamily">Poppins Regular</property>
<property id="fontColor">#b4b4b4</property>
<property id="fontSize">40</property>
<property id="horizontalAlign">flex-start</property>
<property id="verticalAlign">center</property>
</defaultProperties>
</element>
</elements>
</stencil>
<assets>
<asset id="stocks-group-1" type="path" cmsOnly="true" mimeType="image/png" path="/modules/assets/template-thumbnails/stocks/elements/stocks-group-1.png" />
</assets>
</template>
</templates>

753
modules/templates/stock-static.xml Normal file
View File

@@ -0,0 +1,753 @@
<!--
~ Copyright (C) 2024 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/>.
-->
<templates>
<template>
<id>stocks_custom_html</id>
<type>static</type>
<dataType>stock</dataType>
<showIn>none</showIn>
<title>Stocks Custom HTML</title>
<properties>
<property id="effect" type="effectSelector" variant="showPaged">
<title>Effect</title>
<helpText>Please select the effect that will be used to transition between items.</helpText>
<default>noTransition</default>
</property>
<property id="speed" type="number">
<title>Speed</title>
<helpText>The transition speed of the selected effect in milliseconds (normal = 1000).</helpText>
</property>
<property id="backgroundColor" type="color">
<title>Background Colour</title>
<helpText>The selected effect works best with a background colour. Optionally add one here.</helpText>
<default></default>
</property>
<property id="dateFormat" type="text" variant="dateFormat">
<title>Date Format</title>
<helpText>The format to apply to all dates returned by the Widget.</helpText>
<default>#DATE_FORMAT#</default>
</property>
<property id="itemsPerPage" type="number">
<title>Items per Page</title>
<helpText>This is the intended number of items on each page.</helpText>
<default>7</default>
</property>
<property id="customTemplate" type="hidden">
<default>1</default>
</property>
<property id="moduleType" type="hidden">
<default>stocks</default>
</property>
<property id="widgetDesignWidth" type="number">
<title>Original Width</title>
<helpText>This is the intended width of the template and is used to scale the Widget within its region when the template is applied.</helpText>
</property>
<property id="widgetDesignHeight" type="number">
<title>Original Height</title>
<helpText>This is the intended height of the template and is used to scale the Widget within its region when the template is applied.</helpText>
</property>
<property id="mainTemplate" type="code" allowLibraryRefs="true" parseTranslations="true" variant="html">
<title>Main Template</title>
</property>
<property id="itemTemplate" type="code" allowLibraryRefs="true" parseTranslations="true" variant="html">
<title>Item Template</title>
</property>
<property id="styleSheet" type="code" allowLibraryRefs="true" variant="css">
<title>Optional Stylesheet</title>
</property>
<property id="javaScript" type="code" allowLibraryRefs="true" variant="javascript">
<title>Optional JavaScript</title>
<helpText>Add JavaScript to be included immediately before the closing body tag. Do not use [] array notation as this is reserved for library references. Do not include script tags.</helpText>
</property>
</properties>
<stencil>
<twig><![CDATA[
{% if javaScript %}<script type="text/javascript">{{javaScript|raw}}</script>{% endif %}
<div class="template-container" style="display: none;">
{{mainTemplate|raw}}
</div>
<div class="item-template" style="display: none;">
{{itemTemplate|raw}}
</div>
]]></twig>
<style><![CDATA[
{{styleSheet|raw}}
]]></style>
</stencil>
<onTemplateRender><![CDATA[
// Template renderer options
// id: The id of the widget
// target: The target element to render
// items: The items to render
// properties: The properties for the widget
$(target).xiboLayoutScaler(properties);
// Get items
var items = $(target).find(".template-item");
// Get body
var body = $(target).find(".template-container");
$(target).find("#content").xiboFinanceRender(properties, items, body);
$(target).find("img").xiboImageRender(properties);
]]></onTemplateRender>
<onTemplateVisible><![CDATA[
// Start effects for this template
$(target).xiboLayoutAnimate(properties);
]]></onTemplateVisible>
<assets>
<asset id="stocks1" type="path" mimeType="image/png" cmsOnly="true" path="/modules/assets/template-thumbnails/stocks/stocks1.png" />
</assets>
</template>
<template>
<id>stocks1</id>
<type>static</type>
<dataType>stock</dataType>
<title>Stocks 1</title>
<thumbnail>stocks1</thumbnail>
<startWidth>800</startWidth>
<startHeight>450</startHeight>
<properties>
<property id="effect" type="effectSelector" variant="showPaged">
<title>Effect</title>
<helpText>Please select the effect that will be used to transition between items.</helpText>
<default>noTransition</default>
</property>
<property id="speed" type="number">
<title>Speed</title>
<helpText>The transition speed of the selected effect in milliseconds (normal = 1000).</helpText>
</property>
<property id="backgroundColor" type="color">
<title>Background Colour</title>
<helpText>The selected effect works best with a background colour. Optionally add one here.</helpText>
<default></default>
</property>
<property id="itemBackgroundColor" type="color">
<title>Item Colour</title>
<helpText>Background colour for each stock item.</helpText>
<default>#e0e0e0</default>
</property>
<property id="itemFontColor" type="color">
<title>Item Font Colour</title>
<helpText>Font colour for each stock item.</helpText>
<default>#000</default>
</property>
<property id="itemLabelFontColor" type="color">
<title>Item Label Font Colour</title>
<helpText>Font colour for each stock item label.</helpText>
<default>gray</default>
</property>
<property id="borderLeftColor" type="color">
<title>Item Border Colour</title>
<helpText>Border colour for each stock item.</helpText>
<default>#264a88</default>
</property>
<property id="upArrowColor" type="color">
<title>Up Arrow Colour</title>
<helpText>Colour for the up change arrow.</helpText>
<default>green</default>
</property>
<property id="downArrowColor" type="color">
<title>Down Arrow Colour</title>
<helpText>Colour for the down change arrow.</helpText>
<default>red</default>
</property>
<property id="equalArrowColor" type="color">
<title>Equal Arrow Colour</title>
<helpText>Colour for the equal change arrow.</helpText>
<default>gray</default>
</property>
<property id="fontFamily" type="fontSelector">
<title>Font</title>
<helpText>Select a custom font - leave empty to use the default font.</helpText>
</property>
<property id="itemsPerPage" type="hidden" saveDefault="true">
<default>7</default>
</property>
</properties>
<stencil>
<width id="width">820</width>
<height id="height">420</height>
<hbs><![CDATA[
<div class="row row-finance template-item">
<div class="stock-col col-2 value name-stock">{{SymbolTrimmed}}</div>
<div class="stock-col col-5 value ">{{Name}}</div>
<div class="stock-col col-2 text-right value">{{LastTradePriceOnly}} {{CurrencyUpper}}</div>
<div class="stock-col col-2 text-right value {{ChangeStyle}}">{{ChangePercentage}}%</div>
<div class="stock-col col-1 text-right"><div class="{{ChangeIcon}}"></div></div>
</div>
]]></hbs>
<twig><![CDATA[
<div class="container-main template-container">
<div class="container">
<div id="cycle-container" class="items-container">
</div>
</div>
</div>
]]></twig>
<style><![CDATA[
body {
width: 820px !important;
height: 420px !important;
}
{% if backgroundColor %}body { background-color: {{backgroundColor}} !important; }{% endif %}
.text-right {
text-align: right;
}
.center-block {
display: block;
margin-right: auto;
margin-left: auto;
}
.container {
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto;
}
.text-center {
text-align: center;
}
h1 {
margin: 0.67em 0;
font-size: 2em;
}
.container:after, .container:before, .row:after, .row:before {
display: table;
content: " ";
}
.container:after, .row:after {
clear: both;
}
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
:after,:before {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
body {
{% if fontFamily %}
font-family: {{fontFamily}};
{else}
font-family: "Helvetica", "Arial", sans-serif;
{% endif %}
line-height: 1;
}
.container-main {
height: 420px !important;
width: 820px !important;
}
.container {
width: 820px !important;
height: 420px !important;
float: left;
padding-top: 20px;
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto;
}
.row-finance {
height: 40px;
background: #e0e0e0;
margin-bottom: 17px;
border-left: #264a88 10px solid;
{% if borderLeftColor %}
border-left-color: {{borderLeftColor}};
{% endif %}
{% if itemBackgroundColor %}
background: {{itemBackgroundColor}};
{% endif %}
}
.row {
margin-right: 0;
margin-left: 0;
}
#cycle-container {
margin-left: -15px;
margin-right: -15px;
}
.value {
font-size: 19px;
padding-top: 10px;
{% if itemFontColor %}
color: {{itemFontColor}};
{% endif %}
white-space: nowrap;
}
.down-arrow {
margin: 15px 0px 0px 20px;
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-top: 10px solid red;
{% if downArrowColor %}
border-top-color: {{downArrowColor}};
{% endif %}
}
.up-arrow {
margin: 15px 0px 0px 20px;
width: 0;
height: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-bottom: 10px solid green;
{% if upArrowColor %}
border-bottom-color: {{upArrowColor}};
{% endif %}
}
.right-arrow {
margin: 10px 0px 0px 25px;
width: 0;
height: 0;
border-left: 10px solid gray;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
{% if equalArrowColor %}
border-left-color: {{equalArrowColor}};
{% endif %}
}
.variant {
font-size: 20px;
padding-top: 17px;
}
.flags {
padding-top: 4px;
}
.value-up {
font-weight: bold
{% if upArrowColor %}
color: {{upArrowColor}};
{% endif %}
}
.value-down {
{% if downArrowColor %}
color: {{downArrowColor}};
{% endif %}
font-weight: bold
}
.value-equal {
{% if equalArrowColor %}
color: {{equalArrowColor}};
{% endif %}
font-weight: bold
}
.name-stock {
{% if itemLabelFontColor %}
color: {{itemLabelFontColor}};
{% endif %}
}
.col-1 {
width: 8.33333333%;
}
.col-2 {
width: 16.66666667%;
}
.col-5 {
width: 41.66666667%;
}
.stock-col {
float: left;
position: relative;
min-height: 1px;
padding-right: 15px;
padding-left: 15px;
}
]]></style>
</stencil>
<onTemplateRender><![CDATA[
// Template renderer options
// id: The id of the widget
// target: The target element to render
// items: The items to render
// properties: The properties for the widget
var overrideItemPerPage = {
itemsPerPage: 0,
};
$(target).xiboLayoutScaler($.extend({}, properties, overrideItemPerPage));
// Get items
var items = $(target).find(".template-item");
// Get body
var body = $(target).find(".template-container");
$(target).find("#content").xiboFinanceRender(properties, items, body);
$(target).find("img").xiboImageRender(properties);
]]></onTemplateRender>
<onTemplateVisible><![CDATA[
// Start effects for this template
$(target).xiboLayoutAnimate(properties);
]]></onTemplateVisible>
<assets>
<asset id="stocks1" type="path" mimeType="image/png" cmsOnly="true" path="/modules/assets/template-thumbnails/stocks/stocks1.png" />
</assets>
</template>
<template>
<id>stocks2</id>
<type>static</type>
<dataType>stock</dataType>
<title>Stocks 2</title>
<thumbnail>stocks2</thumbnail>
<startWidth>550</startWidth>
<startHeight>350</startHeight>
<properties>
<property id="effect" type="effectSelector" variant="showPaged">
<title>Effect</title>
<helpText>Please select the effect that will be used to transition between items.</helpText>
<default>noTransition</default>
</property>
<property id="speed" type="number">
<title>Speed</title>
<helpText>The transition speed of the selected effect in milliseconds (normal = 1000).</helpText>
</property>
<property id="backgroundColor" type="color">
<title>Background Colour</title>
<helpText>The selected effect works best with a background colour. Optionally add one here.</helpText>
<default></default>
</property>
<property id="itemFontColor" type="color">
<title>Item Font Colour</title>
<helpText>Font colour for each stock item.</helpText>
<default>#000</default>
</property>
<property id="itemLabelFontColor" type="color">
<title>Item Label Font Colour</title>
<helpText>Font colour for each stock item label.</helpText>
<default>gray</default>
</property>
<property id="upArrowColor" type="color">
<title>Up Arrow Colour</title>
<helpText>Colour for the up change arrow.</helpText>
<default>green</default>
</property>
<property id="downArrowColor" type="color">
<title>Down Arrow Colour</title>
<helpText>Colour for the down change arrow.</helpText>
<default>red</default>
</property>
<property id="equalArrowColor" type="color">
<title>Equal Arrow Colour</title>
<helpText>Colour for the equal change arrow.</helpText>
<default>gray</default>
</property>
<property id="fontFamily" type="fontSelector">
<title>Font</title>
<helpText>Select a custom font - leave empty to use the default font.</helpText>
</property>
<property id="itemsPerPage" type="hidden">
<default>1</default>
</property>
</properties>
<stencil>
<width id="width">500</width>
<height id="height">380</height>
<hbs><![CDATA[
<div class="row row-finance template-item">
<div class="stock-col col-12 name">{{Name}}</div>
<div class="stock-col col-12 subname">{{SymbolTrimmed}}</div>
<div class="stock-col col-12 value-currency">{{LastTradePriceOnly}} {{CurrencyUpper}}</div>
<div class="stock-col col-12 total">
<div class="subtotal {{ChangeStyle}}">{{ChangePercentage}}%</div>
<div class="subtotal {{ChangeIcon}}"></div>
</div>
</div>
]]></hbs>
<twig><![CDATA[
<div class="container-main template-container">
<div class="container">
<div id="cycle-container" class="items-container">
</div>
</div>
</div>
]]></twig>
<style><![CDATA[
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
body {
width: 500px !important;
height: 380px !important;
{% if fontFamily %}
font-family: {{fontFamily}};
{else}
font-family: "Helvetica", "Arial", sans-serif;
{% endif %}
line-height: 1;
}
{% if backgroundColor %}body { background-color: {{backgroundColor}} !important; }{% endif %}
.text-right {
text-align: right;
}
.center-block {
display: block;
margin-right: auto;
margin-left: auto;
}
.container {
padding-right: 15px;
padding-left: 15px;
margin-right: auto;
margin-left: auto;
width: 500px !important;
height: 380px !important;
float: left;
margin: 0;
padding: 0;
}
.text-center {
text-align: center;
}
h1 {
margin: 0.67em 0;
font-size: 2em;
}
.container:after, .container:before, .row:after, .row:before {
display: table;
content: " ";
}
.container:after, .row:after {
clear: both;
}
:after, :before {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.container-main {
height: 380px !important;
width: 500px !important;
}
.row {
margin: 0;
}
.value {
font-size: 20px;
padding-top: 10px;
{% if itemFontColor %}
color: {{itemFontColor}};
{% endif %}
}
.value-currency {
font-size: 45px;
text-align: right;
margin-bottom: 40px;
}
.value-up {
font-weight: bold;
{% if upArrowColor %}
color: {{upArrowColor}};
{% endif %}
}
.value-down {
font-weight: bold;
{% if downArrowColor %}
color: {{downArrowColor}};
{% endif %}
}
.value-equal {
font-weight: bold;
{% if equalArrowColor %}
color: {{equalArrowColor}};
{% endif %}
}
.variant {
font-size: 20px;
padding-top: 17px;
}
.flags {
padding-top: 4px;
}
.live-title {
font-size: 30px;
font-weight: bold;
}
.time-title {
font-size: 14px;
padding-top: 10;
}
.name-stock {
{% if itemLabelFontColor %}
color: {{itemLabelFontColor}};
{% endif %}
}
.name {
font-size: 40px;
margin-top: 40px;
}
.subname {
font-size: 35px;
margin-bottom: 30px;
{% if itemLabelFontColor %}
color: {{itemLabelFontColor}};
{% endif %}
}
.total {
margin-top: 30px;
font-size: 80px;
font-weight: bold;
}
.subtotal {
display: inline-block;
}
.down-arrow {
margin: 0px 0px 10px 0px;
width: 0;
height: 0;
border-left: 30px solid transparent;
border-right: 30px solid transparent;
border-top: 30px solid red;
{% if downArrowColor %}
border-top-color: {{downArrowColor}};
{% endif %}
}
.up-arrow {
margin: 0px 0px 10px 0px;
width: 0;
height: 0;
border-left: 30px solid transparent;
border-right: 30px solid transparent;
border-bottom: 30px solid green;
{% if upArrowColor %}
border-bottom-color: {{upArrowColor}};
{% endif %}
}
.right-arrow {
margin: 0px 0px 0px 10px;
width: 0;
height: 0;
border-left: 30px solid gray;
border-top: 30px solid transparent;
border-bottom: 30px solid transparent;
{% if equalArrowColor %}
border-left-color: {{equalArrowColor}};
{% endif %}
}
.col-12 {
width: 100%;
}
.stock-col {
float: left;
position: relative;
min-height: 1px;
padding-right: 15px;
padding-left: 15px;
}
.logo {
height: 40px;
}
]]></style>
</stencil>
<onTemplateRender><![CDATA[
// Template renderer options
// id: The id of the widget
// target: The target element to render
// items: The items to render
// properties: The properties for the widget
$(target).xiboLayoutScaler(properties);
// Get items
var items = $(target).find(".template-item");
// Get body
var body = $(target).find(".template-container");
$(target).find("#content").xiboFinanceRender(properties, items, body);
$(target).find("img").xiboImageRender(properties);
]]></onTemplateRender>
<onTemplateVisible><![CDATA[
// Start effects for this template
$(target).xiboLayoutAnimate(properties);
]]></onTemplateVisible>
<assets>
<asset id="stocks2" type="path" mimeType="image/png" cmsOnly="true" path="/modules/assets/template-thumbnails/stocks/stocks2.png" />
</assets>
</template>
</templates>