116 lines
4.5 KiB
Twig
116 lines
4.5 KiB
Twig
|
|
{% extends 'base.html.twig' %}
|
|
|
|
{% block title %}{{app.session.get("appname")}} - {{child.name}}{% endblock %}
|
|
|
|
{% block useractions %}
|
|
{% if is_granted('ROLE_ADMIN') %}
|
|
<li>
|
|
<a href="{{path("app_child",{catparent:catparent,idparent:parent.id})}}"><i class="fa fa-file fa-2x"></i></a>
|
|
</li>
|
|
{% endif %}
|
|
{% endblock %}
|
|
|
|
{% block body %}
|
|
<h1 class="child-name pt-0 text-uppercase mb-4" style="margin-top:30px">{{child.name}}</h1>
|
|
{% if child.subname %}<div style="margin-top:-23px"><small class="child-subname">{{child.subname}}</small></div>{% endif %}
|
|
|
|
<center>
|
|
{% if child.childtype.id==14 or child.childtype.id==18 %}
|
|
{% set url = "/"~appAlias~"/uploads/child/"~child.id~"/"~child.filename %}
|
|
<video class="align-self-stretch" style="width:100%;background-color:#000;" controls="" name="media"><source src="{{url}}"></video>
|
|
{% elseif child.childtype.id==10 %}
|
|
{% set url = "/"~appAlias~"/uploads/child/"~child.id~"/"~child.filename %}
|
|
<iframe src='{{url}}' class="align-self-stretch" style="width:100%; background-color:#000;border:none; height:500px;"></iframe>
|
|
{% else %}
|
|
<iframe class='widyoutube' src='{{child.url}}' class="align-self-stretch" style="width:100%; background-color:#000;border:none; height:500px;"></iframe>
|
|
{% endif %}
|
|
</center>
|
|
|
|
{% for attributorder in child.childtype.childtypeattributs %}
|
|
{% if attributorder.childattribut.name in child.attributs|keys and not child.attributs[attributorder.childattribut.name] is empty %}
|
|
<strong>{{ attributorder.childattribut.label }}</strong> = {{ child.attributs[attributorder.childattribut.name]}}<br>
|
|
{% endif %}
|
|
{% endfor %}
|
|
|
|
<div class="mt-2">{{child.description|raw}}</div>
|
|
|
|
{% set separator="g" %}
|
|
{%if otherpages %}
|
|
<div class="child-separator mt-5" >
|
|
<img src="/{{appAlias}}/images/separateur-{{separator}}.png" width="100%">
|
|
{% if separator=="d" %} {% set separator="g" %} {%else%} {% set separator="d" %} {%endif%}
|
|
</div>
|
|
|
|
<div class="child-pages mb-5">
|
|
<h3 class="mt-5">Articles associés</h3>
|
|
<div class="grid">
|
|
<div class="grid-sizer"></div>
|
|
<div class="gutter-sizer"></div>
|
|
{% for page in otherpages %}
|
|
{% set style="" %}
|
|
{%if page.image %}
|
|
{% set background=page.image|replace({"**appAlias**":appAlias}) %}
|
|
{% set style="height:auto;background-position: center ; background-size: cover; background-image: url("~background~")" %}
|
|
{%endif%}
|
|
<a href="{{path("app_child_view",{catparent:catparent,idparent:parent.id,idchild:page.id,framed:framed,size:size})}}">
|
|
<div class="grid-item grid-item-size-2 grid-square d-flex align-items-stretch">
|
|
<div class="grid-image d-flex align-items-center pr-2 pl-2" style="{{style}}">
|
|
<div class="grid-item-title">{{ page.name }}</div>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
{% endblock %}
|
|
|
|
{% block localscript %}
|
|
<script>
|
|
$(window).resize(function() {
|
|
resizegrid();
|
|
});
|
|
|
|
$(document).ready(function() {
|
|
$('.grid-item').imagesLoaded(function() {
|
|
$('.grid').masonry({
|
|
columnWidth: '.grid-sizer',
|
|
gutter: '.gutter-sizer',
|
|
itemSelector: '.grid-item',
|
|
percentPosition: true,
|
|
horizontalOrder: false,
|
|
});
|
|
|
|
resizegrid();
|
|
});
|
|
|
|
|
|
|
|
});
|
|
|
|
function resizegrid() {
|
|
$('.grid-square').each(function() {
|
|
$(this).height($(this).width());
|
|
});
|
|
|
|
$('.grid').masonry({
|
|
columnWidth: '.grid-sizer',
|
|
gutter: '.gutter-sizer',
|
|
itemSelector: '.grid-item',
|
|
percentPosition: true,
|
|
horizontalOrder: false,
|
|
});
|
|
}
|
|
|
|
$( ".grid-item" ).hover(function() {
|
|
$( this ).children(".grid-image").css("transform","scale(1.05)");
|
|
}, function() {
|
|
$( this ).children(".grid-image").css("transform","scale(1)");
|
|
});
|
|
</script>
|
|
{% endblock %}
|
|
|
|
|
|
|