{% extends '/site/base_site.html.twig' %}
{% block title %}Plus vert moins cher{% endblock %}
{% block bodyclass %}homeBody{% endblock %}
{% block menuclass %}menuHome{% endblock %}
{% block body %}
{% set mois = ['Janvier', 'Février', 'Mars', 'Avril', 'Mai', 'Juin', 'Juillet', 'Août', 'Septembre', 'Octobre', 'Novembre', 'Décembre' ] %}
<div class="home" id="home">
<video playsinline autoplay muted loop>
<source src="/site/img/home.mp4" type="video/mp4">
</video>
{# <img src="/site/img/tgf.jpg" class="visueltgf" /> #}
<div class="homeEntete wrapper">
<div>
<img src="/site/img/logo_blanc.png" />
</div>
<div>
<h1>Imaginons ensemble des solutions plus <strong>sobres</strong>, plus <strong>locales</strong> et plus <strong>durables</strong></h1>
</div>
{# <div>
<img src="/site/img/logo_tgf.png" />
<div>
<p>Mardi 6 juin à 18h</p>
<p>suivi d'un cocktail dînatoire</p>
<p>à partir de 20h</p>
<hr/>
<p>À la Maison de l'Océan</p>
<p><span>195 rue Saint-Jacques</span></p>
<p><span>75005 Paris</span></p>
</div>
</div>
<div>
<div><img src="/site/img/tgf_part.png" /></div>
<p>La sobriété énergétique : phénomène de mode ou tendance de fond ?</p>
</div> #}
</div>
<div class="scrollInt">
<span>
<img src="/site/img/triangle.svg" width="35" height="35" />
</span>
</div>
</div>
<div class="homeBgBlanc charteLigne charteLigneTop">
<div class="wrapper homeEvent">
<h2><i class="fas fa-angle-double-right"></i>
Revivez les derniers événements
{# {% if evenementsPrev is defined and evenementsPrev is not null %}
{% set evenements = evenementsPrev %}
Revivez les derniers événements
{% else %}
Événements
{% endif %} #}
</h2>
{# <div class="retrospective">
<p>Vidéo rétrospective</p>
<div>
<div>
<a href="https://www.youtube.com/watch?v=cr-NOiKe24I" target="_blank"></a>
</div>
<div>
<div>
<h2>Plus Vert Moins Cher,<br/>Déjà 1 an !</h2>
<p>Merci à tous les participants et intervenants d'avoir fait de ces événements un succès !<br/>
En route pour 2024.</p>
</div>
<div>
<a href="https://www.youtube.com/watch?v=cr-NOiKe24I" target="_blank">Voir la vidéo</a>
</div>
</div>
</div>
</div> #}
{# <div class="eventPrime">
<div style="background-image:url('/site/upload/event1.png');">
<a href="{{path('site_evenement', {titre:'test', idevent:0})}}"><span><i>Green Anatomy</i></span></a>
</div>
<div>
</div>
</div> #}
<ul>
{% for item in evenements %}
<li {{evenementsPrev is defined and evenementsPrev is not null ? 'class="archive"'}}>
<div style="background-image:url('/site/upload/{{item.vignette}}');">
{% if item.date is not null %}
<a href="{{path('site_evenement', {titre:item.titre|slugify, idevent:item.id})}}"><span><i>{{item.titre}}</i></span></a>
{% else %}
<span><i>{{item.titre}}</i></span>
{% endif %}
</div>
{% if item.soustitre is not null %}
<p class="soustitre">{{item.soustitre}}</p>
{% endif %}
<p><i class="fas fa-map-marker-alt"></i> {{item.ville}}</p>
{% if item.date is not null %}
<p><i class="fas fa-calendar-alt"></i> {{item.date|date('j')}} {{mois[item.date|date('n')-1]}} {{item.date|date('Y')}}</p>
{% else %}
<p><i class="fas fa-calendar-alt"></i> A définir</p>
{% endif %}
</li>
{% endfor %}
</ul>
<div>
<a href="{{path('site_evenements')}}" class="btEffects">Tous les événements</a>
</div>
</div>
</div>
{% if intervenants|length > 0 %}
<div class="homeIntervenants homeIntervenantsVert" id="intervenants4col">
<div class="wrapper">
<h2><i class="fas fa-angle-double-right"></i> Intervenants</h2>
<ul>
{% for item in intervenants %}
<li>
{% if item.image is not null %}
<div style="background-image:url('/site/upload/{{item.image}}');">
</div>
{% else %}
<div style="background-image:url('/site/img/profile.jpg');">
</div>
{% endif %}
<div>
<p class="nom">{{item.prenom}} {{item.nom}}</p>
<p class="poste">{{item.poste}}</p>
<p class="societe">{{item.societe}}</p>
{% if item.linkedin is not null %}
<a href="{{item.linkedin}}" target="_blank"><i class="fab fa-linkedin-in"></i></a>
{% endif %}
</div>
</li>
{% endfor %}
</ul>
<div>
<a href="{{ path('site_intervenants') }}" class="btEffects">Tous les Intervenants</a>
</div>
</div>
</div>
{% endif %}
{% if reponses|length > 0 %}
<div class="homeQuotes">
<div class="wrapper">
<h2><i class="fas fa-angle-double-right"></i> Nos participants en parlent</h2>
<div>
<img src="/site/img/arrow-left.svg" id="slideBtLeft" />
<img src="/site/img/arrow-right.svg" id="slideBtRight" class="right" />
<ul>
{% for key, item in reponses %}
<li id="quote_{{key}}" {{key ? 'style="display:none;"'}}>
<blockquote>{{item.commentaire is not null ? item.commentaire : item.contenu}}</blockquote>
{# <p>{{item.contact.prenom}} {{item.contact.nom}}</p> #}
</li>
{% endfor %}
</ul>
</div>
</div>
</div>
{% endif %}
{% endblock %}
{% block extrajs %}
<script>
$( document ).ready(
resizeVisual()
);
$(window).resize(
resizeVisual()
);
$(window).scroll(function() {
if($(window).scrollTop() > 5) {
$('.menu').removeClass('menuTransparent');
} else {
$('.menu').addClass('menuTransparent');
}
});
function resizeVisual() {
if(parseInt($(window).width())>550) {
$('.home').css('height', $(window).height());
$('.homeEntete').css('height', $(window).height());
}
}
let i=0;
let timeoutSlider = setTimeout(changeSliderAuto, 5000);
$('#slideBtRight').click(function(e) {
i++;
if(i>({{reponses|length}}-1)) i=0;
changeSlider(i);
clearTimeout(timeoutSlider);
timeoutSlider = setTimeout(changeSliderAuto, 5000);
});
$('#slideBtLeft').click(function(e) {
i--;
if(i<0) i=({{reponses|length}}-1);
changeSlider(i);
clearTimeout(timeoutSlider);
timeoutSlider = setTimeout(changeSliderAuto, 5000);
});
function changeSliderAuto() {
i++;
if(i>({{reponses|length}}-1)) i=0;
changeSlider(i);
clearTimeout(timeoutSlider);
timeoutSlider = setTimeout(changeSliderAuto, 5000);
}
function changeSlider(i) {
console.log(i);
for(var temp=0; temp<={{reponses|length - 1}}; temp++) {
$('#quote_'+temp).hide();
}
$('#quote_'+i).fadeIn(100);
}
</script>
{% endblock %}