{% extends '/site/base_site.html.twig' %}{% block title %}{{evenement.titre}}{% endblock %}{% block metadescription %}{{evenement.metadescription is not null ? evenement.metadescription }}{% endblock %}{% block body %} {% set jours = ['Lundi', 'Mardi', 'Mercredi', 'Jeudi', 'Vendredi', 'Samedi', 'Dimanche'] %} {% set mois = ['Janvier', 'Février', 'Mars', 'Avril', 'Mai', 'Juin', 'Juillet', 'Août', 'Septembre', 'Octobre', 'Novembre', 'Décembre' ] %} {# {% if evenement.enteteMasque == false %} <div class="eventEntete charteLigne {{evenement.enteteMasque == true ? 'eventEnteteMasque' }}" style="background-image:url('/site/upload/{{evenement.bandeau}}');"> <h1><span>{{evenement.titre}}</span></h1> <p><span><i class="fas fa-map-marker-alt"></i> {{evenement.ville}}</span></p> <p><span><i class="fas fa-calendar-alt"></i> {{evenement.date|date('j')}} {{mois[evenement.date|date('n')-1]}} {{evenement.date|date('Y')}}</span></p> </div> {% else %} <div class="eventEntete demarcheEntete bgEntete eventEntete2"> <p class="bandeauTitre">Événement</p> <img src="/site/upload/{{evenement.bandeau}}" class="visuel" /> </div> {% endif %} #} <header style="background-image:url('/site/upload/{{evenement.bandeauFond}}');"> <div class="wrapper"> <img src="/site/upload/{{evenement.bandeau}}" class="logo" /> </div> </header> <div class="homeBgBlanc"> <div class="wrapper event"> {% if inscription is not null and questionnaire is not defined %} <div style="padding:70px 0; text-align:center;"> {# {% if evenement.id == 6 %} <script> window.lintrk('track', { conversion_id: 12541986 }); </script> {% endif %} #} <h2>Merci !</h2> <p style="font-size: 1.7em;">Votre inscription a bien été enregistrée.</p> </div> {% endif %} <div class="intro"> {% if evenement.introTitre is not empty %} <h1>{{evenement.introTitre|raw}}</h1> {% endif %} {% if evenement.introTexte is not empty %} <p>{{evenement.introTexte|raw}}</p> {% endif %} </div> <div class="eventDetail"> <div class="eventTexte"> <div class="eventPratique"> <div class="eventPratiqueQuand"> <i class="fas fa-calendar-alt"></i> {% if evenement.programmeOrder|length > 1 %} {% for jour in evenement.programmeOrder %} {% for item in jour %} {% if loop.index0 == 0 %} <p>{{item.jour|date('j')}} {{mois[item.jour|date('n')-1]}} {{item.jour|date('Y')}}</p> {% endif %} {% endfor %} {% endfor %} {% else %} <p>{{evenement.date|date('j')}} {{mois[evenement.date|date('n')-1]}} {{evenement.date|date('Y')}}</p> <p>{{evenement.heure|date('H')}}h{{evenement.heure|date('i')}}</p> {% endif %} </div> <div class="eventPratiqueOu"> <i class="fas fa-map-marked-alt"></i> <p>{{evenement.ville}}</p> {% if evenement.lieu is not null %} <p>{{evenement.lieu}}</p> {% endif %} </div> {# {% if evenement.fichiers|length %} <div class="eventPratiqueDoc"> <h4><i class="fas fa-download"></i> Ressources</h4> {% for item in evenement.fichiers %} <p><a href="/uploaddoc/{{item.fichier}}" download>{{item.titre}}</a></p> {% endfor %} </div> {% endif %} #} </div> <div class="eventDescription"> <h1 style="color: #21d4ba;font-size: 1.5em;">{{evenement.titre}}</h1> {{evenement.texte|raw}} </div> {% if evenement.fichiers|length %} <div class="eventRestitution"> <span>Restitution</span> {% for item in evenement.fichiers %} <p>{{item.titre}}</p> <a href="/uploaddoc/{{item.fichier}}">Télécharger</a> {% endfor %} </div> {% endif %} {% if inscription is null and evenement.date|date('Ymd')>"now"|date('Ymd') %} <div><a href="#form" class="btShowForm btEffects"> <i class="fas fa-angle-double-right"></i> Je m'inscris <i class="fas fa-angle-double-left"></i></a></div> {% endif %} </div> <div class="eventRecap"> <div class="eventEnjeux"> <h2><i class="fas fa-angle-double-right"></i> Les enjeux</h2> <ul> {{evenement.enjeux|toList|raw}} </ul> </div> <div class="eventVideo"> {% set first = true %} {% for item in evenement.galeries %} {% if item.youtube is not null and item.youtube is not empty %} {% if first %} <span>VIDÉO</span> {% set first = false %} {% endif %} {% if item.titre is not empty %} <p style="margin-bottom:0px;">{{item.titre}}</p> {% endif %} <a href="{{item.youtube}}" style="background-image:url('/site/upload/{{item.photo|replace({'mini_':''})}}');"></a> {% endif %} {% endfor %} </div> </div> </div> <div class="wrapper inscription"> {% if inscription is null and questionnaire is not defined %} <a name="form"></a> <div id="inscriptionForm" class="formulaire" style="display:none;"> {% if contact is not null %} <h2>Pour terminer votre inscription, vérifiez les informations du formulaire puis validez.</h2> {% else %} <h2>Pour terminer votre inscription, saisissez les informations du formulaire puis validez.</h2> {% endif %} <form action="{{path('site_evenement', {'titre':titre, 'idevent':idevent, 'idmessage':idmessage, 'hashmessage': idmessage|shasalt, 'iduser':iduser, 'hashuser':iduser|shasalt })}}" method="POST"> <div class="formCol"> <div class="formgroup"> <div><label>Civilité</label></div> <div> <select name="civilite"> <option value="M." {{contact is not null and contact.civilite == "M." ? 'selected'}}>M.</option> <option value="Mme" {{contact is not null and contact.civilite == "Mme" ? 'selected'}}>Mme</option> </select> </div> </div> <div class="formgroup"> <div><label>Nom</label></div> <div> <input type="text" name="nom" value="{{contact is not null ? contact.nom}}" required /> </div> </div> <div class="formgroup"> <div><label>Prénom</label></div> <div> <input type="text" name="prenom" value="{{contact is not null ? contact.prenom}}" required /> </div> </div> <div class="formgroup"> <div><label>Email</label></div> <div> <input type="text" name="email" value="{{contact is not null ? contact.email}}" required /> </div> </div> <div class="formgroup"> <div><label>Fonction</label></div> <div> <input type="text" name="fonction" value="{{contact is not null ? contact.fonction}}" required /> </div> </div> <div class="formgroup"> <div><label>Entité / Collectivité</label></div> <div> <input type="text" name="societe" value="{{contact is not null ? contact.societe}}" required /> </div> </div> </div> <div class="formCol"> {% if evenement.id == 5 %} <div class="formgroup"> <div style="margin:30px 0;"> <label><input type="checkbox" name="integralite" /> Je souhaite participer à l'intégralité de l'événement, les 21 et 22 février</label> </div> </div> <div class="formgroup"> <div style="margin:30px 0;"> <label><input type="checkbox" name="visite" /> Je participerai uniquement à la visite de la plateforme bois, le 21 février</label> </div> </div> <div class="formgroup"> <div style="margin:30px 0;"> <label><input type="checkbox" name="navette" /> Pour la visite de la plateforme bois du mardi 21 février, je souhaite prendre la navette qui sera disponible au départ du centre-ville de Périgueux à 14h00</label> </div> </div> <div class="formgroup"> <div style="margin:30px 0;"> <label><input type="checkbox" name="deuxieme" />Je participerai uniquement au programme du 22 février</label> </div> </div> {% endif %} <div class="formgroup" {{evenement.id == 6 or evenement.id == 8 or evenement.id == 2 ? 'style="display:none;"'}}> <div style="margin:30px 0;"> <label><input type="checkbox" name="hebergement" /> Je souhaite bénéficier d'un hébergement pour la veille de l'évènement (pris en charge par ENGIE Solutions)</label> </div> </div> <div class="formgroup"> <div style="margin:30px 0;"> <label><input type="radio" name="droitImage" id="consentRadio" value="1" required /> Je consens à la captation et exploitation de mon image au cours du déroulement de l'événement organisé par ENGIE Solutions</label> </div> <div style="margin:30px 0;"> <label><input type="radio" name="droitImage" value="0" required /> Je refuse que la captation et exploitation de mon image soit opérée par ENGIE Solutions pendant le déroulement de l'événement et j'en avertirai le photographe</label> </div> </div> <br/> <div style="text-align:center;"> <input type="submit" value="Valider mon inscription" /> </div> <div> <p>ENGIE ENERGIE SERVICES - agissant sous la marque ENGIE Solutions traite les données recueillies aux fins d'inscription aux évènements qu'elle organise. Pour en savoir plus sur la gestion de vos données personnelles et pour exercer vos droits, reportez-vous à <a href="{{path('site_rgpd')}}">la notice</a>.<br/> RGPD : Les données à caractère personnel du formulaire sont collectées par ENGIE ENERGIE SERVICES - ENGIE Solutions en qualité de responsable de traitement sur la base de son intérêt légitime de gestion des relations commerciales et a pour sous finalité l'organisation d'événements lien avec son activité à destination de ses client et prospects. Pour en savoir plus sur les caractéristiques des traitement réalisés sur vos données <a href="{{path('site_rgpd')}}">cliquez ici</a></p> </div> </div> <div id="modalConsent" class="modal" style="display: none;"> <div class="modal-content"> <span class="close">×</span> <h2>Confirmation de votre consentement à la captation</h2> {# <h3><span>1</span> Prenez connaissance des modalités</h3> #} <h3>Merci de prendre connaissance des modalités puis de valider</h3> <div id="modalites"> <h1><strong>AUTORISATION POUR L’UTILISATION DE L’IMAGE ET DES DONNEES PERSONNELLES D’UNE PERSONNE - PHOTO ET VIDEO (personne externe)</strong></h1> <h2><strong>I – Droit à l’image </strong></h2> <p>Je déclare être majeur et autorise ENGIE Solutions et/ou ses filiales à exploiter et notamment à diffuser, à reproduire, à représenter et à exposer mon image fixée sur support photo et vidéo lors du reportage ayant pour thème <em><strong>{{evenement.titre}} </strong></em></p> <p><strong>Réalisé le </strong><em><strong> {{evenement.date|date('d/m/Y')}} </strong></em><strong>à </strong><em><strong> {{evenement.ville}} .</strong></em></p> <p>Je suis informé(e) que mon image pourra être utilisée à des fins de communication et de promotion d’ENGIE Solutions, de ses filiales et de ses produits et services en France et dans le monde entier. ENGIE Solutions pourra exploiter ou faire exploiter mon image sous toute forme, par tout procédé (notamment numérique) connu ou inconnu à ce jour et sur tout support connu ou non encore connu à ce jour et notamment :</p> <h3><strong>Pour la vidéo : </strong></h3> <p>-Internet avec achat d’espace (incluant internet mobile et objets connectés) : tous sites internet, incluant ceux édités par ENGIE Solutions ou ses filiales, réseaux sociaux (Facebook, Twitter, Instagram, Snapchat, LinkedIn, etc.), sites de partage de vidéos (YouTube, Dailymotion, etc.), applications mobiles, blogs, vlogs, incluant tout type d’achat d’espace tels que bannières publicitaires, posts sponsorisés, pré-roll, sous tout format tel que vidéo, jpeg, png et gif,</p> <p>- Diffusion sur un ordinateur ou un réseau informatique, et notamment internet, intranet, site web, site wap, applications internet mobiles, sites internet mobiles, en ce inclus les sites d’ENGIE Solutions et/ou de ses filiales,</p> <p>- Diffusion sur les pages des sites de réseaux sociaux, les pages des sites de partage vidéo et les chaînes de sites de partage vidéo d’ENGIE Solutions et de ses filiales,</p> <h3><strong>Pour la photo : </strong></h3> <p>- Editions sous toutes ses formes, y compris documents de communication destinés à restituer l’évènement</p> <p>- Diffusion sur un ordinateur ou un réseau informatique, et notamment internet, intranet, site web, site wap, applications internet mobiles, sites internet mobiles, en ce inclus les sites d’ENGIE Solutions et/ou de ses filiales,</p> <p>J’accepte que mon image soit adaptée (recadrage ou extrait) en fonction du support sur lequel elle sera reproduite, dès lors que celle-ci n’est préjudiciable ni à mon honneur, ni à ma réputation.</p> <p>Cette autorisation est valable 5 ans à compter de la date de sa signature et est consentie à titre gracieux et pour le monde entier.</p> <h2><strong>II – Protection de mes données personnelles </strong></h2> <p>Le traitement de données personnelles issu de la participation aux évènements organisés par ENGIE Solutions est mis en œuvre par ENGIE ENERGIE SERVICES – agissant sous la marque ENGIE Solutions dont le siège se situe au 1 Place Samuel de Champlain, Faubourg de l’Arche, 92930 Paris la Défense. Mes données seront collectées sur la base de mon consentement afin d’intégrer aux fins d’utilisation à des fins de communication et de promotion d’ENGIE Solutions.</p> <p>Mes données seront conservées pendant la durée de l’autorisation d’utilisation de mon image telle que définie ci-dessus et seront réservées prioritairement aux actions de communication interne et externe de ENGIE Solutions et dans tous les cas, à un usage strictement professionnel. Mes données ne peuvent être communiquées qu’aux destinataires suivants : (i) les équipes de la direction de la communication d’ENGIE Solutions, (ii) toute entité tierce avec laquelle ENGIE Solutions a confié la réalisation pour son compte de tout ou partie des actions de communication précitées, ainsi que (iii) tout salarié d’ENGIE Solutions ayant demandé d’avoir accès à mes données pour le seul usage précité.</p> <p>Conformément à la règlementation applicable, je peux demander l’accès, la rectification ou l’effacement de mes données personnelles. Je dispose également d’un droit d’opposition et de limitation de mes données personnelles. La collecte et le traitement de mes données personnelles étant fondés sur mon consentement, j’ai la possibilité de le retirer à tout moment, mais ce retrait ne compromet pas la licéité du traitement effectué antérieurement. Je peux exercer l’ensemble de ces droits en adressant un email et en précisant l’événement concerné par courrier postal à l’adresse suivante : ENGIE Energie Services, A l’attention du Data Privacy Manager, Tour T1 – Case courrier 13.12 – 1 place Samuel de Champlain – Faubourg de l’Arche - 92930 Paris La Défense Cedex – France ou par voie électronique, à l’adresse suivante : <a href="mailto:dpm.engie-solutions@engie.com" target="_blank">dpm.engie-solutions@engie.com</a>. Toute demande devra être accompagnée d’un justificatif d’identité. Je suis également informé(e) que je peux faire valoir mes droits auprès de la CNIL au sujet du traitement de mes données par ENGIE Solutions.<br /> J’ai lu la présente autorisation de droit à l’image et je l’accepte<br /> J’ai lu la mention d’information ci-dessus et je consens à ce que mes données personnelles soient traitées dans les conditions décrites ci-dessus.</p> </div> {# <h3><span>2</span> Signez en indiquant votre nom et prénom</h3> <input type="text" placeholder="Indiquez ici votre nom et prénom" id="nomprenomConsentement" name="nomprenomConsentement" /> #} <div class="btsConsentement"> <span class="btConsentement" id="refuserConsentement">Refuser</span> <span class="{#disabled#} btConsentement" id="validerConsentement">Accepter</span> </div> </div> </div> </form> </div> {% endif %} </div> </div> </div> {% if evenement.galeries|length and "now"|date('Ymd') < (evenement.date|date('Ymd') + 50000) %} <div class="galerieContainer"> <div class="wrapper"> <h2>Galerie photos</h2> <div> <i class="fas fa-angle-double-left" id="galerieGauche"></i> <i class="fas fa-angle-double-right" id="galerieDroite"></i> <ul class="galerie" id="galerie"> {% for item in evenement.galeries %} {% if item.youtube is empty %} <li style="order:{{item.ordre}}"> <img src="/site/upload/mini_{{item.photo}}" onclick="openGallery({{item.ordre}});" /> </li> {% endif %} {% endfor %} </ul> </div> </div> </div> {% endif %} {% if evenement.programmes|length >0 %} <div class="eventProgrammeContainer"> <div class="wrapper" style="position:relative;"> <h2>Découvrez le programme complet</h2> {# {% if evenement.date|date('Ymd')<"now"|date('Ymd') %} #} <span style="position:absolute; top:0; right:0;font-size: 2em;display: inline-block;background: transparent;padding: .2em 0.45em;border-radius: 50%;color: #23dbc0;border: 4px solid #23dbc0;" id="toggleProg"><i class="fas fa-angle-double-down" id="progBt"></i></span> {# {% endif %} #} <div id="programme" {% if evenement.date|date('Ymd')<"now"|date('Ymd') %}style="display:none;"{% endif %}> {% for jour in evenement.programmeOrder %} {% for item in jour %} <div class="itemProgramme"> {% if loop.index0 == 0 %} <p class="date">{{item.jour|date('j')}} {{mois[item.jour|date('n')-1]}} {{item.jour|date('Y')}}</p> {% endif %} <div class="eventProgramme"> <div {{item.chapo == "" and item.texte == "" ? 'class="eventProgrammeEmpty"'}}> <p class="horaire">{{item.heureDebut|date('H')}}h{{item.heureDebut|date('i')!="00" ? item.heureDebut|date('i')}} {% if item.heureFin is not null %} - {{item.heureFin|date('H')}}h{{item.heureFin|date('i')!="00" ? item.heureFin|date('i')}} {% endif %} </p> <h3>{{item.titre}}</h3> </div> <div class="itemProgrammeTexte" > {% if item.chapo != "" %} <p>{{item.chapo|raw|nl2br}}</p> {% endif %} {% if item.texte != "" %} <p>{{item.texte|raw|nl2br}}</p> {% endif %} </div> </div> </div> {% endfor %} {% endfor %} </div> </div> {% if inscription is null and evenement.date|date('Ymd')>"now"|date('Ymd') %} <div class="eventProgrammeInscription"><a href="#form" class="btShowForm btEffects"> <i class="fas fa-angle-double-right"></i> Je m'inscris <i class="fas fa-angle-double-left"></i></a></div> {% endif %} {% endif %} </div> {# <div class="eventComplements wrapper"> <div class="eventDocuments"> <h2><i class="fas fa-angle-double-right"></i> Documents</h2> <div> <p><i class="fas fa-file-download"></i> <a href="">Plan d'accès</a></p> <p><i class="fas fa-file-download"></i> <a href="">Plan d'accès</a></p> </div> </div> </div> #} {% if evenement.infoPratique is not null and (evenement.date is null or (evenement.date is not null and evenement.date|date('Ymd') >= "now"|date('Ymd') )) %} <div class="infoPratique"> <div class="wrapper"> <h2><i class="fas fa-angle-double-right"></i> Informations pratiques</h2> <div class="infoPratiqueContent"> {% if evenement.infoPratiqueMap is not null %} <div class="infoPratiqueMap"><img src="/site/upload/{{evenement.infoPratiqueMap}}" /></div> {% endif %} <div class="infoPratiqueText">{{evenement.infoPratique|raw}}</div> </div> </div> </div> {% else %} {% endif %} {% if intervenants|length > 0 %} <div class="homeIntervenants"> <div class="wrapper"> <h2><i class="fas fa-angle-double-right"></i> Intervenants</h2> <ul> {% for item in intervenants %} <li> {% if item.intervenant.image is not null %} <div style="background-image:url('/site/upload/{{item.intervenant.image}}');"> </div> {% else %} <div style="background-image:url('/site/img/profile.jpg');"> </div> {% endif %} <div> <p class="nom">{{item.intervenant.prenom}} {{item.intervenant.nom}}</p> <p class="poste">{{item.intervenant.poste}}</p> <p class="societe">{{item.intervenant.societe}}</p> {% if item.intervenant.linkedin is not null %} <a href="{{item.intervenant.linkedin}}" target="_blank"><i class="fab fa-linkedin"></i></a> {% endif %} </div> </li> {% endfor %} </ul> </div> </div> {% endif %} {% if evenement.articles is defined and evenement.articles|filter(a => a.datePublication is not null and a.datePublication|date('Ymd') <= "now"|date('Ymd'))|length > 0 %} <div style="padding: 60px 0;background-color: #dcf9f4 !important;"> <div class="wrapper articles"> <h2><i class="fas fa-angle-double-right"></i> Pour aller plus loin</h2> <ul> {% for item in evenement.articles|filter(a => a.datePublication is not null and a.datePublication|date('Ymd') <= "now"|date('Ymd') ) %} <li> <a href="{{path('site_ressources_article', {'slug': item.slug} )}}"> <span class="img" style="background-image:url('/site/upload/{{item.vignette}}');"></span> <span class="titre">{{item.titre}}</span> </a> <span class="extract"><i>{{item.date|date('d/m/y')}}</i> {{item.chapo|extract|raw}}</span> <span class="themes"> {% for theme in item.themes %} <b>{{theme.titre}}</b> {% endfor %} </span> </li> {% endfor %} </ul> </div> </div> {% endif %} <div class="homeEventPassed"> <div class="wrapper homeEvent "> <h2><i class="fas fa-angle-double-right"></i> {% if evenementsPrev is defined and evenementsPrev is not null %} {% set evenementsNext = evenementsPrev %} Revivez les derniers événements {% else %} Prochains rendez-vous {% endif %} </h2> <ul> {% for item in evenementsNext %} <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> </div> <div id="popupGalerie"> <div id="popupGalerieContainer"> <span> <img src="" id="popupGalerieImg" /> <a href="" target="_blank" id="play"><i class="fas fa-play"></i></a> {% if evenement.galeries|length >1 %} <span class="popupGalerieNav" style="margin-left:-20px; left:auto;"><i class="fas fa-angle-left" data-direction="prev"></i></span> <span class="popupGalerieNav popupGalerieNavRight" ><i class="fas fa-angle-right" data-direction="next"></i></span> {% endif %} <i class="fas fa-times" id="popupGalerieClose"></i> </span> </div> </div>{% endblock %}{% block extracss %} <style> .modal { position: fixed; z-index: 5000; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); } .modal-content { background-color: #fff; margin: 40px auto; padding: 20px; width: 90%; max-width: 840px; } .modal h2 { font-size: 1.8em; } .modal h3 span { display: inline-block; border-radius: 50%; background: #003a55; padding: ; height: 20px; width: 30px; text-align: center; padding: 5px 0; color: #fff; } #modalites { max-height: 200px; overflow-y: scroll; background: #ddd; padding: 10px 20px; font-size: 1.05em !important; line-height: 1.2em; } #modalites h1 { font-size: 1.1em; font-weight: bold; } #modalites h2 { font-size: 1.1em; } #modalites h3 { font-size: 0.8em; } #modalites p { margin-top:0; color:#000 !important; } .modal input { width: 100%; box-sizing: border-box; padding: .7em 1em; } .btsConsentement { text-align:center; margin:15px 0; } .btsConsentement span { display: inline-block; background-color: #003a55; color: #fff; text-transform: uppercase; font-weight: bold; border: 0; padding: .8em 1.6em; margin: 0 10px; cursor: pointer; } #validerConsentement.disabled { background-color: #555; } #annulerConsentement { background-color: #b96868; } #validerConsentement { background-color: #0f640f; } .close { color: #aaa; float: right; font-size: 28px; font-weight: bold; } .close:hover, .close:focus { color: black; text-decoration: none; cursor: pointer; } </style>{% endblock %}{% block extrajs %} <script> // Consentement image const modal = document.getElementById("modalConsent"); const consentRadio = document.getElementById("consentRadio"); //const nomprenomInput = document.getElementById("nomprenomConsentement"); const closeBtn = document.getElementsByClassName("close")[0]; const validerButton = document.getElementById("validerConsentement"); const refuserButton = document.getElementById("refuserConsentement"); // nomprenomInput.addEventListener("input", function() { // const texte = nomprenomInput.value.trim(); // if (texte.length > 5 && texte.split(/\s+/).length > 1) { // validerButton.classList.remove("disabled"); // validerButton.classList.add("enabled"); // } else { // validerButton.classList.remove("enabled"); // validerButton.classList.add("disabled"); // } // }); refuserButton.addEventListener("click", function() { //nomprenomInput.value = ""; document.querySelector('input[name="droitImage"][value="0"]').checked = true; modal.style.display = "none"; }); consentRadio.addEventListener("change", function() { if (consentRadio.checked) { modal.style.display = "block"; } }); validerButton.onclick = function() { //if(this.classList.contains('enabled')) { modal.style.display = "none"; //} } closeBtn.onclick = function() { modal.style.display = "none"; // const texte = nomprenomInput.value.trim(); // if (texte.length < 5 || texte.split(/\s+/).length == 0) { // document.querySelector('input[name="droitImage"][value="0"]').checked = true; // } }; window.onclick = function(event) { if (event.target === modal) { // const texte = nomprenomInput.value.trim(); // if (texte.length < 5 || texte.split(/\s+/).length == 0) { // document.querySelector('input[name="droitImage"][value="0"]').checked = true; // } modal.style.display = "none"; } }; document.addEventListener("DOMContentLoaded", function() { const galerie = document.getElementById("galerie"); const flecheGauche = document.getElementById("galerieGauche"); const flecheDroite = document.getElementById("galerieDroite"); //const largeurItem = galerie.querySelector("li").offsetWidth; const largeurItem = document.getElementById("galerie").offsetWidth; if(window.innerWidth >= 480) { flecheGauche.addEventListener("mouseenter", function() { scrollInterval = setInterval(function() { galerie.scrollBy(-2, 0); }, 10); }); flecheDroite.addEventListener("mouseenter", function() { scrollInterval = setInterval(function() { galerie.scrollBy(2, 0); }, 10); }); flecheGauche.addEventListener("mouseleave", function() { clearInterval(scrollInterval); }); flecheDroite.addEventListener("mouseleave", function() { clearInterval(scrollInterval); }); } else { flecheGauche.addEventListener("click", function() { galerie.scrollBy(-largeurItem+30, 0); }); flecheDroite.addEventListener("click", function() { galerie.scrollBy(largeurItem+30, 0); }); } }); $(function () { $('.btShowForm').click(function() { {% if evenement.id == 6 %} console.log('Tag 12541978'); window.lintrk('track', { conversion_id: 12541978 }); {% endif %} $('#inscriptionForm').fadeIn(400); $('.btInscription').hide(); }); {% if inscription is not null and questionnaire is not defined and evenement.id == 6 %} console.log('Tag 12541986'); window.lintrk('track', { conversion_id: 12541986 }); {% endif %} }); let gallery = []; let current = 0; {% for item in evenement.galeries %} gallery[{{item.ordre}}] = { 'photo' : '{{item.photo}}', 'youtube' : '{{item.youtube}}' }; {% endfor %} function openGallery(req) { current = req; $('#popupGalerieImg').css("max-height", ($(window).height()+40)+"px"); $('#popupGalerieImg').attr('src', '/site/upload/'+gallery[req]['photo']); $('#popupGalerie').fadeIn(500, function() { // console.log(gallery[req]['photo']); // console.log($('#popupGalerieImg').height()); // $('.popupGalerieNav').css('top', ($('#popupGalerieImg').height()/2)+'px'); }); //$('#popupGalerieContainer').width($('#popupGalerieImg').width); if(gallery[req]['youtube'] != "") { $('#play').show(); $('#play').attr('href', gallery[req]['youtube']); } else { $('#play').hide(); } } $('.popupGalerieNav').click(function(e) { const direction = e.target.dataset.direction; if(direction === "next") { if(current+1 >= gallery.length) { openGallery(1); } else { openGallery(current+1); } } if(direction === "prev") { if(current-1 <= 0) { openGallery(gallery.length-1); } else { openGallery(current-1); } } }); $('#popupGalerie').click(function(e) { if(e.target.id == "popupGalerie" || e.target.id == "popupGalerieClose") { $('#popupGalerie').fadeOut(300); } }); $('#toggleProg').click(function(e) { $('#programme').toggle(); if($('#progBt').hasClass('fa-angle-double-down')) { $('#progBt').removeClass('fa-angle-double-down'); $('#progBt').addClass('fa-angle-double-up'); } else { $('#progBt').removeClass('fa-angle-double-up'); $('#progBt').addClass('fa-angle-double-down'); } }); window.addEventListener('resize', resizeDiapo); resizeDiapo(); function resizeDiapo() { $('#popupGalerie>div').height(window.innerHeight); //$('#popupGalerie>div').width(window.innerWidth); } </script>{% endblock %}