113 lines
5.4 KiB
Twig
113 lines
5.4 KiB
Twig
|
{#
|
||
|
|
/**
|
||
|
|
* Copyright (C) 2020 Xibo Signage Ltd
|
||
|
|
*
|
||
|
|
* Xibo - Digital Signage - http://www.xibo.org.uk
|
||
|
|
*
|
||
|
|
* 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/>.
|
||
|
|
*/
|
||
|
|
#}
|
||
|
|
{% extends "authed.twig" %}
|
||
|
|
{% import "inline.twig" as inline %}
|
||
|
|
|
||
|
|
{% block pageContent %}
|
||
|
|
<div class="widget">
|
||
|
|
<div class="widget-title">
|
||
|
|
{% set campaignName = campaign.campaign %}
|
||
|
|
{% if campaign.isLayoutSpecific %}
|
||
|
|
{% trans %}Layout Preview for {{ campaignName }}{% endtrans %}
|
||
|
|
{% else %}
|
||
|
|
{% trans %}Campaign Preview for {{ campaignName }}{% endtrans %}
|
||
|
|
{% endif %}
|
||
|
|
</div>
|
||
|
|
<div class="widget-body">
|
||
|
|
<p><b>{% trans "total duration" %}</b> {{ duration|datehms }} <i>({% trans "hours:min:sec" %})</i></p>
|
||
|
|
<p><b>{% trans "number of layouts" %}</b> : {{ campaign.numberLayouts }} </p>
|
||
|
|
<div class="row clearfix">
|
||
|
|
{% for extendedLayout in extendedLayouts %}
|
||
|
|
<div class="col-sm-6 col-md-4 col-lg-3">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-sm-12">
|
||
|
|
<div class="embed-responsive embed-responsive-4by3">
|
||
|
|
<div class="embed-responsive-item preview-container"
|
||
|
|
data-url="{{ url_for('layout.preview', { "id": extendedLayout.layout.layoutId }) }}">
|
||
|
|
<div id="preview_canvas_container_{{extendedLayout.layout.layoutId}}" style="width: 100%; height: 100%;"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-sm-8">
|
||
|
|
<small>{% trans "id" %}:</small> {{ extendedLayout.layout.layoutId }}<br/>
|
||
|
|
<small>{% trans "name" %}:</small> {{ extendedLayout.layout.layout }}<br/>
|
||
|
|
<small>{% trans "duration" %}:</small> {{ extendedLayout.duration|datehms }}<br/>
|
||
|
|
</div>
|
||
|
|
<div class="col-sm-4">
|
||
|
|
<a class="btn btn-white" href="{{ url_for("layout.preview", {id: extendedLayout.layout.layoutId}) }}" target="_blank">
|
||
|
|
{% trans "Open full screen" %}
|
||
|
|
<span class="fa fa-tablet"></span>
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
{% endfor %}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
{% endblock %}
|
||
|
|
|
||
|
|
{% block javaScript %}
|
||
|
|
<script src="{{ theme.rootUri() }}dist/preview.bundle.min.js?v={{ version }}&rev={{revision}}" nonce="{{ cspNonce }}"></script>
|
||
|
|
<script src="{{ theme.rootUri() }}dist/vendor/html5preloader/html5Preloader.js?v={{ version }}&rev={{revision}}" nonce="{{ cspNonce }}"></script>
|
||
|
|
<script type="text/javascript" nonce="{{ cspNonce }}">
|
||
|
|
var previewTranslations = {};
|
||
|
|
// Translations we want always available
|
||
|
|
{% autoescape "js" %}
|
||
|
|
previewTranslations.actionControllerTitle = "{{ "Webhook Controller"|trans }}";
|
||
|
|
previewTranslations.navigateToLayout = "{{ "Navigate to layout with code [layoutTag]?"|trans }}";
|
||
|
|
previewTranslations.emptyRegionMessage = "{{ "Empty region!"|trans }}";
|
||
|
|
previewTranslations.nextItem = "{{ "Next Item"|trans }}";
|
||
|
|
previewTranslations.previousItem = "{{ "Previous Item"|trans }}";
|
||
|
|
previewTranslations.navWidget = "{{ "Navigate to Widget"|trans }}";
|
||
|
|
previewTranslations.navLayout = "{{ "Navigate to Layout"|trans }}";
|
||
|
|
previewTranslations.widgetId = "{{ "Widget ID"|trans }}";
|
||
|
|
previewTranslations.layoutCode = "{{ "Layout Code"|trans }}";
|
||
|
|
previewTranslations.target = "{{ "Target"|trans }}";
|
||
|
|
{% endautoescape %}
|
||
|
|
|
||
|
|
(function($){
|
||
|
|
$(document).ready(function(){
|
||
|
|
{% for extendedLayout in extendedLayouts %}
|
||
|
|
var iframe = $('<iframe>', {
|
||
|
|
src: '{{ url_for("layout.preview", {id: extendedLayout.layout.layoutId}) }}', // URL to load in the iframe
|
||
|
|
id: 'player_frame_{{extendedLayout.layout.layoutId}}',
|
||
|
|
frameborder: 0,
|
||
|
|
css: {
|
||
|
|
position: 'absolute',
|
||
|
|
'pointer-events': 'unset',
|
||
|
|
top: 0,
|
||
|
|
left: 0
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
// Append the iframe to the container
|
||
|
|
$('#preview_canvas_container_{{extendedLayout.layout.layoutId}}').append(iframe);
|
||
|
|
{% endfor %}
|
||
|
|
});
|
||
|
|
}(jQuery));
|
||
|
|
</script>
|
||
|
|
{% endblock %}
|