GDPR Senden Anforderungsfunktion und Ladeanzeige 1500ms Unendliche Rotation um 360 Grad

var istEmailGültig = 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) {

return false;

} else {

return regex.test(email);

}

}

var gdprSendeAnfrage = 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('E-Mail', email);

formData.append('Typ', typ);

formData.append('QuelleDerAnfrage', 1);

formData.append('IP-Adresse', ipInfo);

formData.append('ZustimmungErteilt', zustimmungErteilt);

formData.append('Seite', 'gdpr');

formData.append('Sprache', Shopify.locale ? Shopify.locale : '');

formData.append('gtranslateSprache', 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) {

gdprSlideUpAlle();

if (resp.message.length) {

alert(resp.message);

} else {

alert('Ihre Anfrage wurde erfolgreich eingereicht. Bitte prüfen Sie Ihre E-Mail für weitere Informationen.');

}

} else {

alert(resp.message);

}

if (typeof callback == 'function') {

callback(resp);

}

})

.catch(error => {

alert(error.message);

})

}

else {

alert(resp.message);

}

})

}

//Modal an den Körper anhängen, da es sonst nicht zentriert bleibt (auch wenn position: fixed)

document.querySelector("body").insertAdjacentHTML( 'beforeend', verificationModalInhalt);

document.addEventListener("DOMContentLoaded", function() {

// Wenn der Nutzer (x), schließt das Modal

document.querySelector('.data-verification-close').addEventListener('click', function(e) {

e.preventDefault();

closeVerificationModal();

});

document.querySelector('#data-verification-icon, #data-verification-container p').addEventListener('click', function(e) {

e.preventDefault();

// Erkennen eines Klicks auf einen Link, weil dieser überschrieben ist.

if(e.target.tagName === "A") {

window.open(e.target.href, '_blank');

return;

}

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';

zustimmungErteilt = true;

gdprSendeAnfrage(function(resp) {

zustimmungErteilt = false;

closeVerificationModal();

});

}, 400);

});

});

function openVerificationModal(){

if(!istEmailGültig(email)) {

alert('Ungültige E-Mail');

return;

}

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';

// Fokus auf die Schaltfläche mit dem Anfragetype, die ausgewählt wurde

let gdprFormulare = document.querySelectorAll('.form-gdpr-anfrage');

gdprFormulare.forEach(function(gdprForm) {

if (gdprForm.style.display !== "none") {

gdprFormLinks = gdprForm.previousElementSibling.querySelectorAll('li');

if (gdprFormLinks.length === 1) {

gdprFormLinks[0].querySelector('button').focus();

} else {

// Fokus-Logik für Datenübertragbarkeits-Anfragen

gdprFormLinks = gdprForm.parentElement;

if (gdprFormLinks.nodeName === 'LI') {

gdprFormLinks.querySelector('button').focus();

}

}

}

});

}

document.querySelector('#btn-gdpr-aktualisierung-konto-anfrage').addEventListener('click', function(e) {

e.preventDefault();

let istAusgeklappt = this.getAttribute('aria-expanded') === 'true' ? true : false;

gdprSlideUpAlle();

if(!istAusgeklappt) {

slideDown(document.querySelector('#form-gdpr-aktualisierung-konto-anfrage'), 200);

this.setAttribute("aria-expanded", "true");

} else {

slideUp(document.querySelector('#form-gdpr-aktualisierung-konto-anfrage'), 200);

this.setAttribute("aria-expanded", "false");

}

});

document.querySelector('#form-gdpr-aktualisierung-konto-anfrage-submit').addEventListener('click', function(e) {

e.preventDefault();

email = document.querySelector('#form-gdpr-aktualisierung-konto-anfrage-email').value;

typ = 'kunde/bearbeiten';

gdprSendeAnfrage(function(resp) {

zustimmungErteilt = true;

});

});

document.querySelector('#btn-gdpr-anfragen-anfrage').addEventListener('click', function(e) {

e.preventDefault();

let istAusgeklappt = this.getAttribute('aria-expanded') === 'true' ? true : false;

gdprSlideUpAlle();

if(!istAusgeklappt) {

slideDown(document.querySelector('#form-gdpr-anfragen-anfrage'), 200);

this.setAttribute("aria-expanded", "true");

} else {

slideUp(document.querySelector('#form-gdpr-anfragen-anfrage'), 200);

this.setAttribute("aria-expanded", "false");

}

});

document.querySelector('#form-gdpr-anfragen-anfrage-submit').addEventListener('click', function(e) {

e.preventDefault();

email = document.querySelector('#form-gdpr-anfragen-anfrage-email').value;

typ = 'kunde/anfragen';

gdprSendeAnfrage(function(resp) {

zustimmungErteilt = true;

});

});

document.querySelector('#btn-gdpr-persönliche-informations-anfrage').addEventListener('click', function(e) {

e.preventDefault();

let istAusgeklappt = this.getAttribute('aria-expanded') === 'true' ? true : false;

gdprSlideUpAlle();

if(!istAusgeklappt) {

slideDown(document.querySelector('#form-gdpr-persönliche-informations-anfrage'), 200);

this.setAttribute("aria-expanded", "true");

} else {

slideUp(document.querySelector('#form-gdpr-persönliche-informations-anfrage'), 200);

this.setAttribute("aria-expanded", "false");

}

});

document.querySelector('#form-gdpr-persönliche-informations-anfrage-submit').addEventListener('click', function(e) {

e.preventDefault();

email = document.querySelector('#form-gdpr-persönliche-informations-anfrage-email').value;

typ = 'kunde/persönliche_info';

gdprSendeAnfrage(function(resp) {

zustimmungErteilt = true;

});

});

document.querySelector('#btn-gdpr-bestellungen-anfrage').addEventListener('click', function(e) {

e.preventDefault();

let istAusgeklappt = this.getAttribute('aria-expanded') === 'true' ? true : false;

gdprSlideUpAlle();

if(!istAusgeklappt) {

slideDown(document.querySelector('#form-gdpr-bestellungen-anfrage'), 200);

this.setAttribute("aria-expanded", "true");

} else {

slideUp(document.querySelector('#form-gdpr-bestellungen-anfrage'), 200);

this.setAttribute("aria-expanded", "false");

}

});

document.querySelector('#form-gdpr-bestellungen-anfrage-submit').addEventListener('click', function(e) {

e.preventDefault();

email = document.querySelector('#form-gdpr-bestellungen-anfrage-email').value;

typ = 'kunde/bestellungen';

gdprSendeAnfrage(function(resp) {

zustimmungErteilt = true;

});

});

document.querySelector('#btn-gdpr-personal-data-report-anfrage').addEventListener('click', function(e) {

e.preventDefault();

let istAusgeklappt = this.getAttribute('aria-expanded') === 'true' ? true : false;

gdprSlideUpAlle();

if(!istAusgeklappt) {

slideDown(document.querySelector('#form-gdpr-personal-data-report-anfrage'), 200);

this.setAttribute("aria-expanded", "true");

} else {

slideUp(document.querySelector('#form-gdpr-personal-data-report-anfrage'), 200);

this.setAttribute("aria-expanded", "false");

}

});

document.querySelector('#form-gdpr-personal-data-report-anfrage-submit').addEventListener('click', function(e) {

e.preventDefault();

email = document.querySelector('#form-gdpr-personal-data-report-anfrage-email').value;

typ = 'kunde/bericht';

gdprSendeAnfrage(function(resp) {

zustimmungErteilt = true;

});

});

document.querySelector('#btn-gdpr-konto-löschen-anfrage').addEventListener('click', function(e) {

e.preventDefault();

let istAusgeklappt = this.getAttribute('aria-expanded') === 'true' ? true : false;

gdprSlideUpAlle();

if(!istAusgeklappt) {

slideDown(document.querySelector('#form-gdpr-konto-löschen-anfrage'), 200);

this.setAttribute("aria-expanded", "true");

} else {

slideUp(document.querySelector('#form-gdpr-konto-löschen-anfrage'), 200);

this.setAttribute("aria-expanded", "false");

}

});

document.querySelector('#form-gdpr-konto-löschen-anfrage-submit').addEventListener('click', function(e) {

e.preventDefault();

email = document.querySelector('#form-gdpr-konto-löschen-anfrage-email').value;

typ = 'kunde/löschen';

gdprSendeAnfrage(function(resp) {

zustimmungErteilt = true;

});

});

// Tastaturnavigation im Datenüberprüfungs-Modal für Barrierefreiheit

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 === "Space";

let isEnterPressed = e.keyCode === 13 || e.key === "Enter" || e.code === "Enter";

let dataVerificationCloseButton = document.querySelector('.data-verification-close');

let dataVerificationCheckbox = document.querySelector('#data-verification-container input');

let dataVerificationLink = document.querySelector('#data-verification-container a');

// Diese Funktion erspart uns die Mühe, e.preventDefault() nach jedem Fokussieren aufzurufen

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);

}

}

}

});

```