388 lines
20 KiB
Twig
388 lines
20 KiB
Twig
{% extends "base.html.twig" %}
|
|
{% block localstyle %}
|
|
<style>
|
|
h1 {
|
|
border-color: var(--colorbgbodydark);
|
|
border-block-width: 3px;
|
|
}
|
|
|
|
.tag, .tagalpha, .tagname {
|
|
background-color: var(--colorbgbodylight);
|
|
border-radius: 10px;
|
|
padding:5px 10px;
|
|
margin-bottom:5px;
|
|
display:inline-block;
|
|
min-width:35px;
|
|
text-align: center;
|
|
}
|
|
#selectcatparent, #selecttype, #selecttag {width:100%}
|
|
</style>
|
|
{% endblock %}
|
|
|
|
{% block body %}
|
|
|
|
<div class="row mb-5">
|
|
<div class="col-md-12 pt-3">
|
|
<div style="display:none">
|
|
<button data-types="16,17" class="btn btn-search mb-1 {% if childtypes=="16,17" %} btn-success{%else%} btn-primary{%endif%}">Ressources</button>
|
|
<button data-types="1,2" class="btn btn-search mb-1 {% if childtypes=="1,2" %} btn-success{%else%} btn-primary{%endif%}">Articles</button>
|
|
<button data-types="12,13" class="btn btn-search mb-1 {% if childtypes=="12,13" %} btn-success{%else%} btn-primary{%endif%}">Images</button>
|
|
<button data-types="10" class="btn btn-search mb-1 {% if childtypes=="10" %} btn-success{%else%} btn-primary{%endif%}">Visites Guidées</button>
|
|
<button data-types="11" class="btn btn-search mb-1 {% if childtypes=="11" %} btn-success{%else%} btn-primary{%endif%}">Sentiers</button>
|
|
<button data-types="14,15" class="btn btn-search mb-1 {% if childtypes=="14,15" %} btn-success{%else%} btn-primary{%endif%}">Vidéos</button>
|
|
<button data-types="18,19" class="btn btn-search mb-1 {% if childtypes=="18,19" %} btn-success{%else%} btn-primary{%endif%}">Interviews</button>
|
|
<button data-types="22" class="btn btn-search mb-1 {% if childtypes=="22" %} btn-success{%else%} btn-primary{%endif%}">Bibliographies</button>
|
|
<button data-types="30" class="btn btn-search mb-1 {% if childtypes=="30" %} btn-success{%else%} btn-primary{%endif%}">Photos Aériennes</button>
|
|
|
|
{% if is_granted('ROLE_ADMIN') %}
|
|
<button data-types="20" class="btn btn-search mb-1 {% if childtypes=="20" %} btn-success{%else%} btn-primary{%endif%}">Contacts</button>
|
|
<button data-types="21" class="btn btn-search mb-1 {% if childtypes=="21" %} btn-success{%else%} btn-primary{%endif%}">Liens</button>
|
|
{% endif %}
|
|
</div>
|
|
|
|
<div class="card card-body mt-3">
|
|
<div class="row">
|
|
<div class="col col-md-6">
|
|
<div class="form-group ">
|
|
<label class="control-label">Recherche</label>
|
|
<input id="searchname" class="form-control rounded" placeholder="Recherche" value="{{query}}"/>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col col-md-6" style="display:none">
|
|
<div class="form-group ">
|
|
<label for="selectcatparent">Types de Contenus</label>
|
|
<select id="selectcatparent">
|
|
{% for catparent in catparents %}
|
|
{% set selected ="" %}
|
|
{% if catparent == "map" %}
|
|
{% set selected ="selected" %}
|
|
{% endif %}
|
|
<option value="map" {{selected}}>Cartes</option>
|
|
|
|
{% set selected ="" %}
|
|
{% if catparent == "blog" %}
|
|
{% set selected ="selected" %}
|
|
{% endif %}
|
|
<option value="blog" {{selected}}>Actualités</option>
|
|
|
|
{% set selected ="" %}
|
|
{% if catparent == "page" %}
|
|
{% set selected ="selected" %}
|
|
{% endif %}
|
|
<option value="page" {{selected}}>Pages</option>
|
|
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col col-md-6">
|
|
<div class="form-group ">
|
|
<label for="selecttag">Tags</label>
|
|
<select id="selecttag" multiple="multiple">
|
|
{% for tag in lsttags %}
|
|
{% set selected ="" %}
|
|
{% for selectag in tags %}
|
|
{% if tag.id == selectag %}
|
|
{% set selected ="selected" %}
|
|
{% endif %}
|
|
{% endfor %}
|
|
<option value="{{tag.id}}" {{selected}}>{{tag.id}}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-9 pt-3">
|
|
{% set idchildtype=-100 %}
|
|
{% set idparent=-100 %}
|
|
{% set tbtag=[] %}
|
|
{% set tbname=[] %}
|
|
|
|
{% for child in childs %}
|
|
{% if loop.first %}
|
|
<h1 class="mt-3 mb-3">{{ child.childtype.name|replace({"Embed ":""}) }}</h1>
|
|
|
|
{% if not nopagination %}
|
|
<div class="mypaginationup mb-3" style="text-align:center;zoom:120%";></div>
|
|
{% endif %}
|
|
|
|
{% if not isalpha and child.childtype.id!=30 %}
|
|
<div class="grid">
|
|
<div class="grid-sizer"></div>
|
|
<div class="gutter-sizer"></div>
|
|
{% endif %}
|
|
{% endif %}
|
|
|
|
{% if isalpha or child.childtype.id==30 %}
|
|
{% if child.idparent != idparent %}
|
|
{% if not loop.first %} </div> {% endif %}
|
|
<h2 class="mt-3 mb-3 MAP{{child.idparent}}">{{ child.nameparent }}</h2>
|
|
<div class="grid MAP{{child.idparent}}">
|
|
<div class="grid-sizer"></div>
|
|
<div class="gutter-sizer"></div>
|
|
{% set idparent=child.idparent %}
|
|
{% set tbname = tbname|merge({("MAP"~child.idparent):child.nameparent}) %}
|
|
{% endif %}
|
|
{% endif %}
|
|
|
|
{% set tagsclass="" %}
|
|
{% for tag in child.tags %}
|
|
{% set tagid=tag.id|replace({" ":""}) %}
|
|
{% if tag.id not in tbtag %}
|
|
{% set tbtag = tbtag|merge({(tagid):tag.id}) %}
|
|
{% endif %}
|
|
{% set tagsclass=tagsclass~" tag-"~tagid %}
|
|
{%endfor%}
|
|
|
|
{% if child.childtype.id==10 %}
|
|
<!--
|
|
{% set style="" %}
|
|
{% set url = "/"~appAlias~"/uploads/child/"~child.id~"/"~child.filename %}
|
|
<a href="{{url}}" target="_blank" class="d-block text-center">
|
|
<div class="grid-item grid-item-size-2 grid-square d-flex align-items-stretch {{tagsclass}}">
|
|
<div class="grid-image d-flex align-items-center pr-2 pl-2" style="{{style}}">
|
|
<div class="grid-item-title">{{ child.name }}</div>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
-->
|
|
{% set url = "/"~appAlias~"/uploads/child/"~child.id~"/"~child.filename %}
|
|
<h2>{{ child.name }}</h2>
|
|
<a href="{{path("app_child_view",{catparent:child.catparent,idparent:child.idparent,idchild:0})}}">En savoir plus</a>
|
|
<iframe src="{{url}}" class="align-self-stretch" style="width:100%; background-color:#000;border:none; height:400px;"></iframe>
|
|
<a href="{{url}}" target="_blank" class="d-block text-center mb-5"><i class="fas fa-search-plus fa-2x"></i></a>
|
|
|
|
{% elseif child.childtype.id==12 or child.childtype.id==13 or child.childtype.id==30 %}
|
|
{% if child.childtype.id==12 or child.childtype.id==30 %}
|
|
{% set background="/"~appAlias~"/uploads/child/"~child.id~"/thumb/"~child.filename %}
|
|
{% else %}
|
|
{% set background=child.url %}
|
|
{% endif %}
|
|
|
|
{% set style="height:auto;background-position: center ; background-size: cover; background-image: url("~background~")" %}
|
|
|
|
<div class="grid-item grid-item-size-2 grid-square grid-modal d-flex align-items-stretch {{tagsclass}}" data-catparent="{{child.catparent}}" data-idparent="{{child.idparent}}" data-idchild="{{child.id}}">
|
|
<div class="grid-image d-flex align-items-center pr-2 pl-2" style="{{style}}"></div>
|
|
</div>
|
|
{% elseif child.childtype.id==16 or child.childtype.id==17 %}
|
|
{% set style="" %}
|
|
{%if child.image %}
|
|
{% set background=child.image|replace({"**appAlias**":appAlias}) %}
|
|
{% set style="height:auto;background-position: center ; background-size: cover; background-image: url("~background~")" %}
|
|
{% else %}
|
|
|
|
{%endif%}
|
|
<a href="{{path("app_child_view",{catparent:child.catparent,idparent:child.idparent,idchild:child.id})}}">
|
|
<div class="grid-item grid-item-size-2 grid-a4 d-flex align-items-stretch {{tagsclass}}">
|
|
<div class="grid-image d-flex align-items-center pr-2 pl-2" style="{{style}}">
|
|
<div class="grid-item-title">{{ child.name }}</div>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
{%else%}
|
|
{% set style="" %}
|
|
{%if child.image %}
|
|
{% set background=child.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:child.catparent,idparent:child.idparent,idchild:child.id})}}">
|
|
<div class="grid-item grid-item-size-2 grid-square d-flex align-items-stretch {{tagsclass}}">
|
|
<div class="grid-image d-flex align-items-center pr-2 pl-2" style="{{style}}">
|
|
<div class="grid-item-title">{{ child.name }}</div>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
{% endif %}
|
|
|
|
{% if loop.last %}
|
|
</div>
|
|
{% endif %}
|
|
{%endfor%}
|
|
|
|
{% if not nopagination %}
|
|
<div class="mypaginationdown" style="text-align:center;zoom:120%";></div>
|
|
{% endif %}
|
|
</div>
|
|
<div class="col-md-3">
|
|
<div class="mt-3 p-3" style="height:100%; background-color:#efefef;">
|
|
{% if isalpha %}
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"a"})}}">A</a>
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"b"})}}">B</a>
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"c"})}}">C</a>
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"d"})}}">D</a>
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"e"})}}">E</a>
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"f"})}}">F</a>
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"g"})}}">G</a>
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"h"})}}">H</a>
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"i"})}}">I</a>
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"j"})}}">J</a>
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"k"})}}">K</a>
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"l"})}}">L</a>
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"m"})}}">M</a>
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"n"})}}">N</a>
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"o"})}}">O</a>
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"p"})}}">P</a>
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"q"})}}">Q</a>
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"r"})}}">R</a>
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"s"})}}">S</a>
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"t"})}}">T</a>
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"u"})}}">U</a>
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"v"})}}">V</a>
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"w"})}}">W</a>
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"x"})}}">X</a>
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"y"})}}">Y</a>
|
|
<a class="btn-link tagalpha" href="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,alpha:"z"})}}">Z</a>
|
|
<br><br>
|
|
{% endif %}
|
|
|
|
{% if isalpha %}
|
|
<div style="zoom:80%">
|
|
<span data-id="tag-all" class="btn-link tagname"><i class="fas fa-tag"></i> Afficher Tout</span>
|
|
{% for key, name in tbname %}
|
|
<span data-id="{{key}}" class="btn-link tagname"><i class="fas fa-tag"></i> {{name}}</span>
|
|
{% endfor %}
|
|
</div>
|
|
{%else%}
|
|
<span data-id="tag-all" class="btn-link tag"><i class="fas fa-tag"></i> Afficher Tout</span>
|
|
{% for key, tag in tbtag %}
|
|
<span data-id="tag-{{key}}" class="btn-link tag"><i class="fas fa-tag"></i> {{tag}}</span>
|
|
{% endfor %}
|
|
{%endif%}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block localscript %}
|
|
<script>
|
|
$(window).resize(function() {
|
|
resizegrid();
|
|
});
|
|
$(document).ready(function() {
|
|
$("#selectcatparent").select2();
|
|
$("#selecttag").select2();
|
|
$("#selecttype").select2();
|
|
|
|
{% if not nopagination and count>maxresult%}
|
|
var itemsCount = {{count}};
|
|
var itemsOnPage = {{maxresult}};
|
|
|
|
url="{{path("app_child_search",{childtypes:childtypes,tags:tags|join(','),query:query,first:"{{page}}"})}}";
|
|
url=url.replaceAll("&","&");
|
|
url=url.replaceAll("%7B","{");
|
|
url=url.replaceAll("%7D","}");
|
|
|
|
var pagination = new Pagination({
|
|
container: $(".mypaginationup"),
|
|
pageClickUrl: url
|
|
});
|
|
pagination.make(itemsCount, itemsOnPage, {{first}});
|
|
|
|
var pagination = new Pagination({
|
|
container: $(".mypaginationdown"),
|
|
pageClickUrl: url
|
|
});
|
|
pagination.make(itemsCount, itemsOnPage, {{first}});
|
|
{% endif %}
|
|
resizegrid();
|
|
});
|
|
function resizegrid() {
|
|
width=$('.grid-item').width();
|
|
console.log(width);
|
|
$('.grid-square').not('.grid-video').height(width);
|
|
$('.grid-a4').not('.grid-video').height(width/0.7);
|
|
|
|
$('.grid').masonry({
|
|
columnWidth: '.grid-sizer',
|
|
gutter: '.gutter-sizer',
|
|
itemSelector: '.grid-item',
|
|
percentPosition: true,
|
|
horizontalOrder: false,
|
|
});
|
|
}
|
|
$(".tag").click(function(){
|
|
id=$(this).data("id");
|
|
if(id=="tag-all") {
|
|
$('.grid-item').each(function() {
|
|
$(this).addClass("d-flex");
|
|
$(this).show();
|
|
});
|
|
}
|
|
else {
|
|
$('.grid-item').each(function() {
|
|
$(this).removeClass("d-flex");
|
|
$(this).hide();
|
|
});
|
|
|
|
$('.'+id).each(function() {
|
|
$(this).addClass("d-flex");
|
|
$(this).show();
|
|
});
|
|
}
|
|
$('.grid').masonry();
|
|
});
|
|
|
|
$(".tagname").click(function(){
|
|
id=$(this).data("id");
|
|
if(id=="tag-all") {
|
|
$('.grid').show();
|
|
$('h2').show();
|
|
}
|
|
else {
|
|
$('.grid').hide();
|
|
$('h2').hide();
|
|
|
|
$('.'+id).each(function() {
|
|
$(this).show();
|
|
});
|
|
}
|
|
$("html, body").animate({ scrollTop: 0 },200);
|
|
});
|
|
|
|
$('#searchname').bind("enterKey",function(e){
|
|
$('.btn-success').click();
|
|
});
|
|
$('#searchname').keyup(function(e){
|
|
if(e.keyCode == 13)
|
|
{
|
|
$('.btn-success').click();
|
|
}
|
|
});
|
|
|
|
$('.grid-modal').click(function(){
|
|
url='{{path("app_child_view",{catparent:"ccc",idparent:"ppp",idchild:"iii"})}}';
|
|
url=url.replace("ccc",$(this).data("catparent"));
|
|
url=url.replace("ppp",$(this).data("idparent"));
|
|
url=url.replace("iii",$(this).data("idchild"));
|
|
ModalLoad('mymodallarge','Galerie',url );
|
|
});
|
|
|
|
$('.btn-search').click(function(){
|
|
catparent=$("#selectcatparent").val();
|
|
types=$(this).data("types");
|
|
tags=$("#selecttag").val().join(',');
|
|
query=$("#searchname").val();
|
|
|
|
url="{{path("app_child_search",{tags:"ttt",childtypes:"ppp",query:"qqq",catparents:"ccc"})}}";
|
|
url=url.replace("ccc",catparent);
|
|
url=url.replace("qqq",query);
|
|
url=url.replace("ppp",types);
|
|
url=url.replace("ttt",tags);
|
|
url=url.replaceAll("&","&");
|
|
|
|
document.location=url;
|
|
});
|
|
|
|
$( ".grid-item" ).hover(function() {
|
|
$( this ).children(".grid-image").css("transform","scale(1.05)");
|
|
}, function() {
|
|
$( this ).children(".grid-image").css("transform","scale(1)");
|
|
});
|
|
</script>
|
|
{% endblock %}
|