Symfony Profiler

{% extends 'Nordinfo/Main/base.html.twig' %}
{% block title %}{{ title }} - Nord Info{% endblock %}
{% block body %}
{{ include('Lenord/Main/parts/epingles.html.twig') }}
<main role="main" id="mainContent" tabindex="-1" class="mBXL" style="position:relative;">
{% include 'Nordinfo/Main/parts/add_tags_bar.html.twig' %}
{% if show_date_bar is defined and show_date_bar == 1 and posts is not empty %}
{% include 'Nordinfo/Main/parts/date_bar.html.twig' %}
{% endif %}
<div style="position:relative;">
<div class="gradientPosts"></div>
</div>
<h1 class="sr-only">{{ title }}</h1>
<div class="container _masonry">
{% if posts|length == 0 and latest_epingle_1 is null and latest_two_epingles_2|length == 0 %}
<p class="messageEmptyFeed">
Créez votre Une personnalisée en sélectionnant
<a href="{{ path('vos_lieux') }}">
<span>vos lieux de vie</span>
</a>
et/ou
<a href="{{ path('topics') }}">
<span>vos centres d'intérêts</span>
</a>
préférés à l’aide des filtres en haut de ce fil
</p>
<div class="gridMasonry" id="gridMasonry">
<div class="grid-sizer"></div>
<div class="colArticleItem col-item">
<div class="articleItem _empty"></div>
</div>
<div class="colArticleItem col-item">
<div class="articleItem _empty"></div>
</div>
<div class="colArticleItem col-item">
<div class="articleItem _empty"></div>
</div>
<div class="colArticleItem col-item d-none d-lg-block">
<div class="articleItem _empty"></div>
</div>
<div class="colArticleItem col-item d-none d-lg-block">
<div class="articleItem _empty"></div>
</div>
<div class="colArticleItem col-item d-none d-lg-block">
<div class="articleItem _empty"></div>
</div>
</div>
{% else %}
<div class="pb-5"></div>
{% if latest_epingle_1 %}
{% set date = "" %}
{% if latest_epingle_1.dateDebut is defined and latest_epingle_1.dateDebut is not null %}
{% set date_segments = latest_epingle_1.dateDebut | split('/') %}
{% set date = date_segments[1] ~ '/' ~ date_segments[0] ~ '/' ~ date_segments[2] %}
{% endif %}
{% set date_fin = "" %}
{% if latest_epingle_1.dateFin is defined and latest_epingle_1.dateFin != null %}
{% set date_segmentss = latest_epingle_1.dateFin | split('/') %}
{% set date_fin = date_segmentss[1] ~ '/' ~ date_segmentss[0] ~ '/' ~ date_segmentss[2] %}
{% endif %}
<div class="containerArticleBig">
<p class="sr-only"
style="position:absolute;left:0;width:100%;height:30px;visibility:hidden;opacity:0;"
id="list-item-{{ latest_epingle_1.id }}"
data-date-bar-scroll-point>{{ date|format_datetime(locale='fr', pattern="d MMMM Y") }}</p>
<a
href="{{ path('post_detail', {"slug": latest_epingle_1.slug}) }}"
class="articleItem _big {% if latest_epingle_1.type.type == 'video' %}_video{% endif %} {% if latest_epingle_1.grandFormat == null or latest_epingle_1.grandFormat == false %}_short{% endif %}">
<div class="__inner">
<div class="__col-img">
<div
class="__img placement{% if latest_epingle_1.positionImage.id is defined %}{{ latest_epingle_1.positionImage.id }}{% endif %} lozad"
data-background-image="{% if latest_epingle_1.defautFil is defined and latest_epingle_1.defautFil is same as(true) %}{{ latest_epingle_1.illustrationfilName }}{% else %}{{ asset('upload/images/'~latest_epingle_1.illustrationfilName) | imagine_filter('thumb') }}{% endif %}"
>
{% if latest_epingle_1.type.type == 'video' %}
<p class="__tag">
VIDÉO   
<span>{{ latest_epingle_1.duree }}</span>
</p>
{% endif %}
</div>
</div>
<div class="__col-info">
<div class="__info-wrapper">
<p class="__tag">à la une</p>
<h2 class="__title">
<span>{{ latest_epingle_1.title }}</span>
</h2>
{% if latest_epingle_1.shortDescription|length > 0 %}
<p class="__desc">
{{ latest_epingle_1.shortDescription }}
</p>
{% endif %}
</div>
</div>
</div>
</a>
</div>
{% endif %}
<div class="gridMasonry" id="gridMasonry">
<div class="grid-sizer"></div>
{% if latest_two_epingles_2|length > 0 %}
{% for post in latest_two_epingles_2 %}
{% set date = "" %}
{% if post.dateDebut is defined and post.dateDebut is not null %}
{% set date_segments = post.dateDebut | split('/') %}
{% set date = date_segments[1] ~ '/' ~ date_segments[0] ~ '/' ~ date_segments[2] %}
{% endif %}
{% set date_fin = "" %}
{% if post.dateFin is defined and post.dateFin != null %}
{% set date_segmentss = post.dateFin | split('/') %}
{% set date_fin = date_segmentss[1] ~ '/' ~ date_segmentss[0] ~ '/' ~ date_segmentss[2] %}
{% endif %}
<div class="colArticleItem col-item _epingle">
<p class="sr-only"
style="position:absolute;left:0;width:100%;height:30px;visibility:hidden;opacity:0;"
id="list-item-{{ post.id }}"
data-date-bar-scroll-point>{{ date|format_datetime(locale='fr', pattern="d MMMM Y") }}</p>
<a
href="{{ path('post_detail', {"slug": post.slug}) }}"
class="articleItem _article _epingle {% if post.type.type == 'video' %}_video{% endif %} {% if post.grandFormat == null or post.grandFormat == false %}_short{% endif %}">
<div class="__inner">
<div class="__col-img">
<div
class="__img placement{% if post.positionImage.id is defined %}{{ post.positionImage.id }}{% endif %} lozad"
data-background-image="{% if post.defautFil is defined and post.defautFil is same as(true) %}{{ post.illustrationfilName }}{% else %}{{ asset('upload/images/'~post.illustrationfilName) | imagine_filter('thumb') }}{% endif %}"
>
{% if post.type.type == 'video' %}
<p class="__tag">
VIDÉO   
<span>{{ post.duree }}</span>
</p>
{% endif %}
</div>
</div>
<div class="__col-info">
<div class="__info-wrapper">
<h2 class="__title">
<span>{{ post.title }}</span>
</h2>
{% if post.shortDescription|length > 0 %}
<p class="__desc">
{{ post.shortDescription }}
</p>
{% endif %}
</div>
</div>
</div>
</a>
</div>
{% endfor %}
{% endif %}
{% for post in posts %}
{% if post.type.type == 'event' and post.dateDebut >= date_day %}
{% else %}
{{ include('Nordinfo/Main/parts/item_list.html.twig') }}
{% endif %}
{% endfor %}
</div>
{% if items_total > initial_limit %}
{% include 'Nordinfo/Main/parts/loader_ajax.html.twig' %}
{% endif %}
{% endif %}
</div>
<script>
(() => {
const containerArticleBig = document.querySelector('.containerArticleBig');
const articleItemsEpingle = document.querySelectorAll('.colArticleItem._epingle');
const gradientPosts = document.querySelector('.gradientPosts');
function calculateHeights() {
let heightContainerArticleBig = 0;
let heightArticleItemsEpingle = 0;
if (document.body.contains(containerArticleBig)) {
const styles = window.getComputedStyle(containerArticleBig);
heightContainerArticleBig = containerArticleBig.offsetHeight +
parseFloat(styles.marginTop) +
parseFloat(styles.marginBottom);
}
// Check if screen is larger than 991px
const isLargeScreen = window.matchMedia('(min-width: 992px)').matches;
if (isLargeScreen) {
// For large screens, get only the tallest element
let maxHeight = 0;
articleItemsEpingle.forEach((item) => {
const styles = window.getComputedStyle(item);
const itemHeight = item.offsetHeight +
parseFloat(styles.marginTop) +
parseFloat(styles.marginBottom);
if (itemHeight > maxHeight) {
maxHeight = itemHeight;
}
});
heightArticleItemsEpingle = maxHeight;
} else {
// For smaller screens, add all heights together
articleItemsEpingle.forEach((item) => {
const styles = window.getComputedStyle(item);
const itemHeight = item.offsetHeight +
parseFloat(styles.marginTop) +
parseFloat(styles.marginBottom);
heightArticleItemsEpingle += itemHeight;
});
}
const totalHeight = heightContainerArticleBig + heightArticleItemsEpingle;
if (document.body.contains(gradientPosts)) {
gradientPosts.style.height = totalHeight + 'px';
}
}
// Initial calculation
calculateHeights();
// Create ResizeObserver
const resizeObserver = new ResizeObserver(() => {
calculateHeights();
});
// Observe the container
if (containerArticleBig) {
resizeObserver.observe(containerArticleBig);
}
// Observe each article item
articleItemsEpingle.forEach(item => {
resizeObserver.observe(item);
});
})();
</script>
</main>
{{ include('Nordinfo/Main/parts/cookieManager.js.html.twig') }}
{% endblock %}

templates/Nordinfo/Main/actus.html.twig line 1