PDPA

// <![CDATA[ /* GLISSER VERS LE HAUT */ let slideUp = (target, duration = 500) => { target.style.transitionProperty = 'height, margin, padding' target.style.transitionDuration = duration + 'ms' target.style.boxSizing = 'border-box' target.style.height = target.offsetHeight + 'px' target.offsetHeight target.style.overflow = 'hidden' target.style.height = 0 target.style.paddingTop = 0 target.style.paddingBottom = 0 target.style.marginTop = 0 target.style.marginBottom = 0 window.setTimeout(() => { target.style.display = 'none' target.style.removeProperty('height') target.style.removeProperty('padding-top') target.style.removeProperty('padding-bottom') target.style.removeProperty('margin-top') target.style.removeProperty('margin-bottom') target.style.removeProperty('overflow') target.style.removeProperty('transition-duration') target.style.removeProperty('transition-property'), duration); /* GLISSER VERS LE BAS */ let slideDown = (target, duration = 500) => { setTimeout(function () { target.style.removeProperty('display') let display = window.getComputedStyle(target).display if (display === 'none') display = 'block'; target.style.display = display let height = target.offsetHeight target.style.overflow = 'hidden' target.style.height = 0 target.style.paddingTop = 0 target.style.paddingBottom = 0 target.style.marginTop = 0 target.style.marginBottom = 0 target.offsetHeight target.style.boxSizing = 'border-box' target.style.transitionProperty = "height, margin, padding" target.style.transitionDuration = duration + 'ms' target.style.height = height + 'px' target.style.removeProperty('padding-top') target.style.removeProperty('padding-bottom') target.style.removeProperty('margin-top') target.style.removeProperty('margin-bottom') window.setTimeout(() => { target.style.removeProperty('height') target.style.removeProperty('overflow') target.style.removeProperty('transition-duration') target.style.removeProperty('transition-property'), duration), 100) /* TOOGLE */ var slideToggle = (target, duration = 500) => { if (window.getComputedStyle(target).display === 'none') { return slideDown(target, duration); else return slideUp(target, duration); /* FONDU */ var toggleFadeiSense = (elem, show) => { if (show) { elem.style.display = "block" setTimeout(function () { elem.classList.add('show-isense') elem.classList.remove('hide-isense'), 20) else elem.classList.remove('show-isense') elem.classList.add('hide-isense') setTimeout(() => { elem.style.display = 'none';, 400) var pdpaSlideUpAll = function () { slideUp(document.querySelector('#form-pdpa-edit-account-request'), 100) document.querySelector('#btn-pdpa-edit-account-request').setAttribute("aria-expanded", "false"); slideUp(document.querySelector('#form-pdpa-requests-request'), 100) document.querySelector('#btn-pdpa-requests-request').setAttribute("aria-expanded", "false"); slideUp(document.querySelector('#form-pdpa-personal-information-request'), 100) document.querySelector('#btn-pdpa-personal-information-request').setAttribute("aria-expanded", "false"); slideUp(document.querySelector('#form-pdpa-orders-request'), 100) document.querySelector('#btn-pdpa-orders-request').setAttribute("aria-expanded", "false"); slideUp(document.querySelector('#form-pdpa-personal-data-report-request'), 100) document.querySelector('#btn-pdpa-personal-data-report-request').setAttribute("aria-expanded", "false"); slideUp(document.querySelector('#form-pdpa-delete-account-request'), 100) document.querySelector('#btn-pdpa-delete-account-request').setAttribute("aria-expanded", "false"); document.querySelector('#pdpa_page button').setAttribute("aria-expanded", "false"); var email, type, consentGiven = false var verificationModalContent = '× Je donne mon consentementà la collecte de mon adresse e-mail et de mon adresse IP aux fins du traitement de cette demande. Pour en savoir plus, consultez la politique de confidentialité et les conditions d'utilisation. var isEmailValid = function(/^(([^<>()\[\]\\.,;:\email@"]+(\.[^<>()\[\]\\.,;:\)@"]+)*)|(".+"))@((\[[ { let regex = s s 0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/ if (email == '' || email == undefined) { retourner faux else return regex.test(email); var pdpaSendRequest = function (callback) { fetch(' https://www.cloudflare.com/cdn-cgi/trace ', { method: 'GET', headers: { 'Content-Type': 'text/plain', .then(resp => resp.text()) .then(resp => { if (!resp.error) let ipInfo = resp let formData = new FormData(); formData.append('shop', Shopify.shop) formData.append('email', email) formData.append('type', type) formData.append('sourceOfRequest', 9) formData.append('ipAddress', ipInfo) formData.append('consentGiven', consentGiven) formData.append('page', 'pdpa') formData.append('lang', Shopify.locale ? Shopify.locale : ''); formData.append('gtranslateLang', isenseGDPR.Cookies.get('googtrans') ? isenseGDPR.Cookies.get('googtrans') : ''); fetch(' https://gdpr.apps.isenselabs.com/gdprRequests/submitRequest ', { method: 'POST', body: formData .then(resp => resp.json()) .then(resp => { if (!resp.error) pdpaSlideUpAll(); if (resp.message.length) alert(resp.message) else alert('Votre demande a été envoyée avec succès. Veuillez consulter votre courriel pour plus d'informations. else alert(resp.message) if (typeof callback == 'function') { callback(resp); .catch(error => { alert(error.message); else alert(resp.message); //Ajouter le modal au corps, car sinon il ne restera pas centré (même si la position est fixe) document.querySelector("body").insertAdjacentHTML('beforeend', verificationModalContent) document.addEventListener("DOMContentLoaded", function () { // Lorsque l'utilisateur clique sur (x), fermer la fenêtre modale document.querySelector('.data-verification-close').addEventListener('click', function (e) { e.preventDefault(); closeVerificationModal(); // Mettre en évidence le bouton du type de demande sélectionné let pdpaForms = document.querySelectorAll('.form-pdpa-request'); pdpaForms.forEach(function(pdpaForm) { if (pdpaForm.style.display !== "none") let pdpaFormLinks = pdpaForm.previousElementSibling.querySelectorAll('li'); if (pdpaFormLinks.length === 1) pdpaFormLinks[0].querySelector('button').focus(); document.querySelector('#data-verification-icon, #data-verification-container p').addEventListener('click', function (e) { e.preventDefault(); // Détecter le clic sur un lien, car il est écrasé. if (e.target.tagName === "A") window.open(e.target.href, '_blank'); retour document.querySelector('#data-verification-icon').classList.add("clicked") setTimeout(() => { toggleFadeiSense(document.querySelector("#data-verification-modal"), false) document.querySelector('#data-verification-background .loading').style.display = 'inline-block'; consentGiven = true pdpaSendRequest(function (resp) { consentGiven = false closeVerificationModal();, 400);});}); function openVerificationModal() if(!isEmailValid(email)) alert('Adresse e-mail invalide') retour toggleFadeiSense(document.querySelector("#data-verification-modal"), true) toggleFadeiSense(document.querySelector('#data-verification-background'), true) document.querySelector('#data-verification-container input').focus(); function closeVerificationModal() toggleFadeiSense(document.querySelector("#data-verification-background"), false) document.querySelector('#data-verification-icon').classList.remove("clicked") document.querySelector('#data-verification-background .loading').style.display = 'none'; // Mettre en évidence le bouton du type de demande sélectionné let pdpaForms = document.querySelectorAll('.form-pdpa-request') pdpaForms.forEach(function(pdpaForm) { if (pdpaForm.style.display !== "none") let pdpaFormLinks = pdpaForm.previousElementSibling.querySelectorAll('li'); if (pdpaFormLinks.length === 1) pdpaFormLinks[0].querySelector('button').focus(); else // Logique de mise au point pour les demandes de portabilité des données pdpaFormLinks = pdpaForm.parentElement if (pdpaFormLinks.nodeName === 'LI') { pdpaFormLinks.querySelector('button').focus(); document.querySelector('#btn-pdpa-edit-account-request').addEventListener('click', function (e) { e.preventDefault(); let isExpanded = this.getAttribute('aria-expanded') === 'true' ? true : false pdpaSlideUpAll(); if(!isExpanded) { slideDown(document.querySelector('#form-pdpa-edit-account-request'), 200) this.setAttribute("aria-expanded", "true"); else slideUp(document.querySelector('#form-pdpa-edit-account-request'), 200) this.setAttribute("aria-expanded", "false"); document.querySelector('#form-pdpa-edit-account-request-submit').addEventListener('click', function (e) { e.preventDefault(); email = document.querySelector('#form-pdpa-edit-account-request-email').value type = 'client/modifier' pdpaSendRequest(function (resp) { consentGiven = true; document.querySelector('#btn-pdpa-requests-request').addEventListener('click', function(e) { e.preventDefault(); let isExpanded = this.getAttribute('aria-expanded') === 'true' ? true : false pdpaSlideUpAll(); if(!isExpanded) { slideDown(document.querySelector('#form-pdpa-requests-request'), 200) this.setAttribute("aria-expanded", "true"); else slideUp(document.querySelector('#form-pdpa-requests-request'), 200) this.setAttribute("aria-expanded", "false"); document.querySelector('#form-pdpa-requests-request-submit').addEventListener('click', function(e) { e.preventDefault(); email = document.querySelector('#form-pdpa-requests-request-email').value type = 'client/demandes' pdpaSendRequest(function (resp) { consentGiven = true; document.querySelector('#btn-pdpa-personal-information-request').addEventListener('click', function(e) { e.preventDefault(); let isExpanded = this.getAttribute('aria-expanded') === 'true' ? true : false pdpaSlideUpAll(); if(!isExpanded) slideDown(document.querySelector('#form-pdpa-personal-information-request'), 200) this.setAttribute("aria-expanded", "true"); else slideUp(document.querySelector('#form-pdpa-personal-information-request'), 200) this.setAttribute("aria-expanded", "false"); document.querySelector('#form-pdpa-personal-information-request-submit').addEventListener('click', function(e) { e.preventDefault(); email = document.querySelector('#form-pdpa-personal-information-request-email').value type = 'client/infos_personnelles' pdpaSendRequest(function (resp) { consentGiven = true; document.querySelector('#btn-pdpa-orders-request').addEventListener('click', function(e) { e.preventDefault(); let isExpanded = this.getAttribute('aria-expanded') === 'true' ? true : false pdpaSlideUpAll(); if(!isExpanded) { slideDown(document.querySelector('#form-pdpa-orders-request'), 200) this.setAttribute("aria-expanded", "true"); else slideUp(document.querySelector('#form-pdpa-orders-request'), 200) this.setAttribute("aria-expanded", "false"); document.querySelector('#form-pdpa-orders-request-submit').addEventListener('click', function(e) { e.preventDefault(); email = document.querySelector('#form-pdpa-orders-request-email').value type = 'client/commandes' pdpaSendRequest(function (resp) { consentGiven = true; document.querySelector('#btn-pdpa-personal-data-report-request').addEventListener('click', function (e) { e.preventDefault(); let isExpanded = this.getAttribute('aria-expanded') === 'true' ? true : false pdpaSlideUpAll(); if(!isExpanded) { slideDown(document.querySelector('#form-pdpa-personal-data-report-request'), 200) this.setAttribute("aria-expanded", "true"); else slideUp(document.querySelector('#form-pdpa-personal-data-report-request'), 200) this.setAttribute("aria-expanded", "false"); document.querySelector('#form-pdpa-personal-data-report-request-submit').addEventListener('click', function (e) { e.preventDefault(); email = document.querySelector('#form-pdpa-personal-data-report-request-email').value type = 'client/rapport' pdpaSendRequest(function (resp) { consentGiven = true; document.querySelector('#btn-pdpa-delete-account-request').addEventListener('click', function(e) { e.preventDefault(); let isExpanded = this.getAttribute('aria-expanded') === 'true' ? true : false pdpaSlideUpAll(); if(!isExpanded) { slideDown(document.querySelector('#form-pdpa-delete-account-request'), 200) this.setAttribute("aria-expanded", "true"); else slideUp(document.querySelector('#form-pdpa-delete-account-request'), 200) this.setAttribute("aria-expanded", "false"); document.querySelector('#form-pdpa-delete-account-request-submit').addEventListener('click', function(e) { e.preventDefault(); email = document.querySelector('#form-pdpa-delete-account-request-email').value type = 'customer/delete' pdpaSendRequest(function (resp) { consentGiven = true; // Navigation au clavier dans le modal de vérification des données pour l'accessibilité document.querySelector('#data-verification-modal').addEventListener('keydown', function(e) { let isTabPressed = e.keyCode === 9 || e.key === "Tab" || e.code === "Tab" let isEscapePressed = e.keyCode === 27 || e.key === "Escape" || e.code === "Escape" let isSpacePressed = event.keyCode === 32 || e.key === " " || event.code === "Espace" let isEnterPressed = event.keyCode === 13 || e.key === "Entrée" || event.code === "Entrée" let dataVerificationCloseButton = document.querySelector('.data-verification-close') let dataVerificationCheckbox = document.querySelector('#data-verification-container input') let dataVerificationLink = document.querySelector('#data-verification-container a') // Cette fonction nous évite d'appeler e.preventDefault() après chaque mise au point let executeFocus = (focusElement) => {focusElement.focus();e.preventDefault();} if (isEscapePressed) if (dataVerificationCloseButton) dataVerificationCloseButton.click(); if (isSpacePressed || isEnterPressed) if (document.activeElement === dataVerificationCheckbox) document.querySelector('#data-verification-container #data-verification-icon').click(); if (isTabPressed) { if (e.shiftKey) { if (dataVerificationCloseButton && document.activeElement === dataVerificationCloseButton) executeFocus(dataVerificationLink); else if (dataVerificationLink && document.activeElement === dataVerificationLink) executeFocus(dataVerificationCloseButton);; // ]]>