<script src="theme/default/libraries/colors/colors.min.js"></script>
<script src="theme/default/js/xibo-cms.js"></script>
<script src="theme/default/js/xibo-forms.js"></script>
<script src="theme/default/js/xibo-layout-designer.js"></script>
<script src="theme/default/js/xibo-preview-timeline.js"></script>
<script src="theme/default/js/xibo-calendar.js"></script>
<script src="theme/default/js/xibo-datasets.js"></script>
<script type="text/javascript">
var translations = <?php
echo Theme::Get('translations') == '' ? '{}' : Theme::Get('translations');
?>
;
var language = "<?php
echo TranslationEngine::GetJsLocale();
?>
";
var dateFormat = "<?php
echo Config::GetSetting('DATE_FORMAT', 'Y-m-d h:i');
?>
";
var calendarType = "<?php
echo Config::GetSetting('CALENDAR_TYPE');
?>
";
var calendarLanguage = "<?php
echo strlen(TranslationEngine::GetJsLocale() <= 2) ? TranslationEngine::GetJsLocale() . '-' . strtoupper(TranslationEngine::GetJsLocale()) : TranslationEngine::GetJsLocale();
?>
";
</script>
</body>
</html>
/**
* GetResource
* Return the rendered resource to be used by the client (or a preview)
* for displaying this content.
* @param integer $displayId If this comes from a real client, this will be the display id.
*/
public function GetResource($displayId = 0)
{
// Clock Type
switch ($this->GetOption('clockTypeId', 1)) {
case 1:
// Analogue
$template = file_get_contents('modules/theme/HtmlTemplateForClock.html');
// Render our clock face
$theme = $this->GetOption('theme') == 1 ? 'light' : 'dark';
$theme_face = $this->GetOption('theme') == 1 ? 'clock_bg_modern_light.png' : 'clock_bg_modern_dark.png';
$template = str_replace('<!--[[[CLOCK_FACE]]]-->', base64_encode(file_get_contents('modules/theme/' . $theme_face)), $template);
// Light or dark?
$template = str_replace('<!--[[[CLOCK_THEME]]]-->', $theme, $template);
$template = str_replace('<!--[[[OFFSET]]]-->', $this->GetOption('offset', 0), $template);
// After body content
$isPreview = Kit::GetParam('preview', _REQUEST, _WORD, 'false') == 'true';
$javaScriptContent = '<script type="text/javascript" src="' . ($isPreview ? 'modules/preview/vendor/' : '') . 'jquery-1.11.1.min.js"></script>';
$javaScriptContent .= '<script type="text/javascript" src="' . ($isPreview ? 'modules/preview/vendor/' : '') . 'moment.js"></script>';
// Replace the After body Content
$template = str_replace('<!--[[[JAVASCRIPTCONTENT]]]-->', $javaScriptContent, $template);
break;
case 2:
// Digital
// Digital clock is essentially a cut down text module which always fits to the region
$template = file_get_contents('modules/preview/HtmlTemplate.html');
// Extract the format from the raw node in the XLF
$rawXml = new DOMDocument();
$rawXml->loadXML($this->GetRaw());
$formatNodes = $rawXml->getElementsByTagName('format');
$formatNode = $formatNodes->item(0);
$format = $formatNode->nodeValue;
// Strip out the bit between the [] brackets and use that as the format mask for moment.
$matches = '';
preg_match_all('/\\[.*?\\]/', $format, $matches);
foreach ($matches[0] as $subs) {
$format = str_replace($subs, '<span class="clock" format="' . str_replace('[', '', str_replace(']', '', $subs)) . '"></span>', $format);
}
// Replace all the subs
$template = str_replace('<!--[[[BODYCONTENT]]]-->', $format, $template);
// After body content
$options = array('previewWidth' => Kit::GetParam('width', _GET, _DOUBLE, 0), 'previewHeight' => Kit::GetParam('height', _GET, _DOUBLE, 0), 'originalWidth' => $this->width, 'originalHeight' => $this->height, 'scaleOverride' => Kit::GetParam('scale_override', _GET, _DOUBLE, 0));
$isPreview = Kit::GetParam('preview', _REQUEST, _WORD, 'false') == 'true';
$javaScriptContent = '<script type="text/javascript" src="' . ($isPreview ? 'modules/preview/vendor/' : '') . 'jquery-1.11.1.min.js"></script>';
$javaScriptContent .= '<script type="text/javascript" src="' . ($isPreview ? 'modules/preview/vendor/' : '') . 'moment.js"></script>';
$javaScriptContent .= '<script type="text/javascript" src="' . ($isPreview ? 'modules/preview/' : '') . 'xibo-layout-scaler.js"></script>';
$javaScriptContent .= '<script type="text/javascript">
var locale = "' . TranslationEngine::GetJsLocale() . '";
var options = ' . json_encode($options) . ';
function updateClock() {
$(".clock").each(function() {
$(this).html(moment().add(' . $this->GetOption('offset', 0) . ', "m").format($(this).attr("format")));
});
}
$(document).ready(function() {
moment.locale(locale);
updateClock();
setInterval(updateClock, 1000);
$("body").xiboLayoutScaler(options);
});
</script>';
// Replace the After body Content
$template = str_replace('<!--[[[JAVASCRIPTCONTENT]]]-->', $javaScriptContent, $template);
// Add our fonts.css file
$headContent = '<link href="' . ($isPreview ? 'modules/preview/' : '') . 'fonts.css" rel="stylesheet" media="screen">';
$headContent .= '<style type="text/css">' . file_get_contents(Theme::ItemPath('css/client.css')) . '</style>';
$template = str_replace('<!--[[[HEADCONTENT]]]-->', $headContent, $template);
break;
case 3:
// Flip Clock
$template = file_get_contents('modules/theme/HtmlTemplateForFlipClock.html');
// Head Content (CSS for flip clock)
$template = str_replace('<!--[[[HEADCONTENT]]]-->', '<style type="text/css">' . file_get_contents('modules/preview/vendor/flipclock.css') . '</style>', $template);
$template = str_replace('<!--[[[OFFSET]]]-->', $this->GetOption('offset', 0), $template);
// After body content
$isPreview = Kit::GetParam('preview', _REQUEST, _WORD, 'false') == 'true';
$javaScriptContent = '<script type="text/javascript" src="' . ($isPreview ? 'modules/preview/vendor/' : '') . 'jquery-1.11.1.min.js"></script>';
$javaScriptContent .= '<script type="text/javascript" src="' . ($isPreview ? 'modules/preview/vendor/' : '') . 'flipclock.min.js"></script>';
// Replace the After body Content
$template = str_replace('<!--[[[JAVASCRIPTCONTENT]]]-->', $javaScriptContent, $template);
break;
}
// If we are a preview, then pass in the width and height
$template = str_replace('<!--[[[PREVIEW_WIDTH]]]-->', Kit::GetParam('width', _GET, _DOUBLE, 0), $template);
$template = str_replace('<!--[[[PREVIEW_HEIGHT]]]-->', Kit::GetParam('height', _GET, _DOUBLE, 0), $template);
// Replace the View Port Width?
if (isset($_GET['preview'])) {
$template = str_replace('[[ViewPortWidth]]', $this->width, $template);
}
// Return that content.
return $template;
}
/**
* Raw Preview
*/
public function GetResource($displayId = 0)
{
// Load in the template
if ($this->layoutSchemaVersion == 1) {
$template = file_get_contents('modules/preview/Html4TransitionalTemplate.html');
} else {
$template = file_get_contents('modules/preview/HtmlTemplate.html');
}
// Replace the View Port Width?
if (isset($_GET['preview'])) {
$template = str_replace('[[ViewPortWidth]]', $this->width, $template);
}
$width = Kit::GetParam('width', _REQUEST, _DOUBLE);
$height = Kit::GetParam('height', _REQUEST, _DOUBLE);
$duration = $this->duration;
// Get the text out of RAW
$rawXml = new DOMDocument();
$rawXml->loadXML($this->GetRaw());
// Get the Text Node
$textNodes = $rawXml->getElementsByTagName('text');
$textNode = $textNodes->item(0);
$text = $textNode->nodeValue;
// Handle older layouts that have a direction node but no effect node
$oldDirection = $this->GetOption('direction', 'none');
if ($oldDirection != 'none') {
$oldDirection = 'marquee' . ucfirst($oldDirection);
}
$effect = $this->GetOption('effect', $oldDirection);
// Set some options
$options = array('type' => $this->type, 'fx' => $effect, 'duration' => $duration, 'durationIsPerItem' => false, 'numItems' => 1, 'takeItemsFrom' => 'start', 'itemsPerPage' => 0, 'speed' => $this->GetOption('speed', 0), 'originalWidth' => $this->width, 'originalHeight' => $this->height, 'previewWidth' => Kit::GetParam('width', _GET, _DOUBLE, 0), 'previewHeight' => Kit::GetParam('height', _GET, _DOUBLE, 0), 'scaleOverride' => Kit::GetParam('scale_override', _GET, _DOUBLE, 0));
// See if we need to replace out any [clock] or [date] tags
$clock = false;
if (stripos($text, '[Clock]')) {
$clock = true;
$text = str_replace('[Clock]', '[HH:mm]', $text);
}
if (stripos($text, '[Clock|')) {
$clock = true;
$text = str_replace('[Clock|', '[', $text);
}
if (stripos($text, '[Date]')) {
$clock = true;
$text = str_replace('[Date]', '[DD/MM/YYYY]', $text);
}
if ($clock) {
// Strip out the bit between the [] brackets and use that as the format mask for moment.
$matches = '';
preg_match_all('/\\[.*?\\]/', $text, $matches);
foreach ($matches[0] as $subs) {
$text = str_replace($subs, '<span class="clock" format="' . str_replace('[', '', str_replace(']', '', $subs)) . '"></span>', $text);
}
}
// Generate a JSON string of substituted items.
$items[] = $text;
// Replace the head content
$isPreview = Kit::GetParam('preview', _REQUEST, _WORD, 'false') == 'true';
$javaScriptContent = '<script type="text/javascript" src="' . ($isPreview ? 'modules/preview/vendor/' : '') . 'jquery-1.11.1.min.js"></script>';
// Need the marquee plugin?
if (stripos($effect, 'marquee') !== false) {
$javaScriptContent .= '<script type="text/javascript" src="' . ($isPreview ? 'modules/preview/vendor/' : '') . 'jquery.marquee.min.js"></script>';
}
// Need the cycle plugin?
if ($effect != 'none') {
$javaScriptContent .= '<script type="text/javascript" src="' . ($isPreview ? 'modules/preview/vendor/' : '') . 'jquery-cycle-2.1.6.min.js"></script>';
}
$javaScriptContent .= '<script type="text/javascript" src="' . ($isPreview ? 'modules/preview/' : '') . 'xibo-layout-scaler.js"></script>';
$javaScriptContent .= '<script type="text/javascript" src="' . ($isPreview ? 'modules/preview/' : '') . 'xibo-text-render.js"></script>';
// Do we need to include moment?
if ($clock) {
$javaScriptContent .= '<script type="text/javascript" src="' . ($isPreview ? 'modules/preview/vendor/' : '') . 'moment.js"></script>';
}
$javaScriptContent .= '<script type="text/javascript">';
$javaScriptContent .= ' var options = ' . json_encode($options) . ';';
$javaScriptContent .= ' var items = ' . json_encode($items) . ';';
$javaScriptContent .= ' $(document).ready(function() { ';
$javaScriptContent .= ' $("#content").xiboTextRender(options, items); $("body").xiboLayoutScaler(options);';
if ($clock) {
$javaScriptContent .= ' updateClock(); setInterval(updateClock, 1000); moment.locale("' . TranslationEngine::GetJsLocale() . '"); ';
}
$javaScriptContent .= ' }); ';
if ($clock) {
$javaScriptContent .= '
function updateClock() {
$(".clock").each(function() {
$(this).html(moment().format($(this).attr("format")));
});
}
';
}
$javaScriptContent .= '</script>';
// Replace the Head Content with our generated javascript
$template = str_replace('<!--[[[JAVASCRIPTCONTENT]]]-->', $javaScriptContent, $template);
// Add our fonts.css file
$headContent = '<link href="' . ($isPreview ? 'modules/preview/' : '') . 'fonts.css" rel="stylesheet" media="screen">';
$headContent .= '<style type="text/css">' . file_get_contents(Theme::ItemPath('css/client.css')) . '</style>';
$template = str_replace('<!--[[[HEADCONTENT]]]-->', $headContent, $template);
// Replace the Body Content with our generated text
$template = str_replace('<!--[[[BODYCONTENT]]]-->', '', $template);
return $template;
}
