Symfony Profiler

{% extends 'base.html.twig' %}
{% set totalPages = news['totalPages']|default() %}
{% set total = news['total']|default() %}
{% set limit = 10 %}
{% set firstNews = news['list']|slice(0, 1)|default([]) %}
{% set secondNews = news['list']|slice(1, 4)|default([]) %}
{% set restsNews = news['list'][5:]|default([]) %}
{% block page_contents %}
<section class="section section-page-title bg-gradient py-xl-5 py-4" data-aos='fade-down'>
<div class="container">
<div class="row">
<div class="col-12 text-center text-white">
<h1 class="page-name font-weight-bold my-2">{% trans %}Suivez les dernières actualités ÉSTIAM{% endtrans %}</h1>
<p class="mb-0">{%trans%}Retrouvez toute l'actualité de l'école ÉSTIAM : vie de l'école, pédagogie, événements, toutes les actualités par campus...{%endtrans%}</p>
</div>
</div>
</div>
</section>
<section class="section section-top-news py-4 mb-4">
<div class="container">
<div class="row">
<div class="col-lg-6">
{% if firstNews %}
{% set news = (firstNews|first) %}
<div class="top-news d-flex flex-column h-100 mb-4 mr-xl-3 mt-3" data-aos='fade-right'>
<div class="t-img hover-zoom">
<a href="{{ news.url }}">
<img class="w-100" src="{{ news.media }}" alt="{{ news.title }}"
onerror="this.onerror=null;this.src='{{ asset('assets/images/no-img/news.jpg') }}';"/>
</a>
</div>
<div class="p-xl-3 p-2">
<div class="n-title mb-3">
<a href="{{ news.url }}">{{ news.title }}</a>
</div>
<div class="n-time mb-3">
<div class="n-icon"><i class="fa-solid fa-calendar-week"></i></div>
<div class="n-text">{{ news.createdDate|date('d M Y') }}</div>
</div>
<div class="n-text mb-3">
<div class="truncate-text">
{{ news.description }}
</div>
</div>
<div class="n-link mt-auto">
<a href="{{ news.url }}">{% trans %}Lire l'article{% endtrans %}<i class="fa-solid fa-arrow-right"></i></a>
</div>
</div>
</div>
{% endif %}
</div>
<div class="col-lg-6">
{% if secondNews %}
<div class="d-flex flex-column h-100 mb-4 ml-xl-2" data-aos='fade-left'>
{% for news in secondNews %}
<div class="related-item py-3 d-flex">
<div class="r-content flex-1 d-flex flex-column h-100 py-2 mr-md-3 mr-2">
<div class="r-title font-weight-bold mb-auto">
<a href="{{ news.url }}">{{ news.title }}</a>
</div>
<div class="r-time my-md-3 my-2">
<div class="r-icon"><i class="fa-solid fa-calendar-week"></i></div>
<div class="r-text">{{ news.createdDate|date('d M Y') }}</div>
</div>
<div class="r-link mt-auto">
<a href="{{ news.url }}">{% trans %}Lire l'article{% endtrans %}<i class="fa-solid fa-arrow-right"></i></a>
</div>
</div>
<div class="r-img ml-auto">
<div class="hover-zoom">
<a href="{{ news.url }}"><img class="w-100" src="{{ news.media }}" alt="{{ news.title }}"
onerror="this.onerror=null;this.src='{{ asset('assets/images/no-img/news.jpg') }}';"/></a>
</div>
</div>
</div>
{% endfor %}
</div>
{% endif %}
</div>
</div>
</div>
</section>
{% if restsNews %}
<section class="section section-news b-4">
<div class="container">
<div class="row" id="load-more">
{% for news in restsNews %}
<div class="col-lg-4 col-md-6 mb-lg-5 mb-4">
<div class="n-item d-flex flex-column h-100" data-aos='zoom-in'>
<div class="n-img mb-4">
<a href="{{ news.url }}">
<img class="position-relative w-100" src="{{ news.media }}" alt="{{ news.title }}"
onerror="this.onerror=null;this.src='{{ asset('assets/images/no-img/news.jpg') }}';"/>
</a>
</div>
<div class="n-title mb-3">
<a href="{{ news.url }}">{{ news.title }}</a>
</div>
<div class="n-time mb-3">
<div class="n-icon"><i class="fa-solid fa-calendar-week"></i></div>
<div class="n-text">{{ news.createdDate|date('d M Y') }}</div>
</div>
<div class="n-text mb-3">
<div class="truncate-text">
{{ news.description }}
</div>
</div>
<div class="n-link mt-auto">
<a href="{{ news.url }}">{% trans %}Lire l'article{% endtrans %}<i class="fa-solid fa-arrow-right"></i></a>
</div>
</div>
</div>
{% endfor %}
</div>
{% if totalPages > 1 %}
<div class="row mt-4 mb-5" data-aos='fade-up'>
<div class="col-12 text-center listing-loading" style="display: none;">
<div class="loading">
<div class="dot"></div>
<div class="dot"></div>
<div class="dot"></div>
<div class="dot"></div>
<div class="dot"></div>
</div>
</div>
</div>
{% endif %}
</div>
</section>
{% endif %}
{% endblock %}
{% block custom_javascripts %}
{{ '<script type="application/ld+json">'|raw }}
{{ richSnippets|json_encode | raw }}
{{ '</script>'|raw }}
<script type="text/javascript">
$(document).ready(function(){
$('.load__more').hide();
const totalPages = '{{ totalPages }}';
const total = '{{ total }}';
const limit = '{{ limit }}';
let page = 1;
let process = true;
$('.view-more .link-btn').click(function(){
if(process && totalPages > 1){
$('.listing-paging').hide();
$('.listing-loading').show();
getmoredata();
}
});
$(window).scroll(function () {
let height = ($(window).scrollTop() + $(window).height()+ 400);
if(height >= $(document).height()){
if(process && totalPages > 1){
$('.listing-loading').show();
getmoredata();
}
}
})
function getmoredata() {
process = false;
$.ajax({
type: "GET",
url: "{{ path('news.loadMore') }}",
dataType: "json",
data:{'page':page,'limit':limit},
success: function (response) {
$('.listing-loading').hide();
if(response.list){
$('#load-more').append(response.list);
$('.item-more .truncate-text').each(function() {
var $div = $(this);
var divWords = $div.text().split(/\s+/);
$div.empty();
$.each(divWords, function(i,w){
$('<span/>').text(w).appendTo($div);
});
$(this).parent('.item-more').removeClass('item-more');
});
}
page = page + 1;
let processWidth = (((parseInt($('#news-seen').text()) + limit) / total) *100);
$('.progress').css({'width': processWidth+'%'});
if(page*limit < total){
process = true;
$('#news-seen').text(parseInt($('#news-seen').text()) + limit);
$('.listing-paging').show();
}
AOS.init({
easing: 'ease-out-back',
offset: 150,
disable: 'mobile'
});
}
});
}
});
</script>
{% endblock %}

templates/news/index.html.twig line 1