/* NACH OBEN SCHIEBEN */
let slideUp = (Ziel, Dauer=500) => {
target.style.transitionProperty = 'Höhe, Rand, Polsterung';
target.style.transitionDuration = Dauer + '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 = 'keine';
target.style.removeProperty('Höhe');
target.style.removeProperty('Padding-Top');
target.style.removeProperty('Padding-Bottom');
target.style.removeProperty('Rand-Top');
target.style.removeProperty('Rand-Bottom');
target.style.removeProperty('Überlauf');
target.style.removeProperty('Übergangsdauer');
target.style.removeProperty('Übergangseigenschaft');
}, Dauer);
}
/* RUNTERSCHIEBEN */
let slideDown = (Ziel, Dauer=500) => {
setTimeout(function(){
target.style.removeProperty('display');
let display = window.getComputedStyle(Ziel).display;
if (display === 'none') display = 'block';
target.style.display = Anzeige;
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 = "Höhe, Rand, Polsterung";
target.style.transitionDuration = Dauer + 'ms';
target.style.height = Höhe + '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');
}, Dauer);
}, 100)
}
/* TOOGLE */
var slideToggle = (target, Dauer = 500) => {
if (window.getComputedStyle(Ziel).display === 'keine') {
return slideDown(Ziel, Dauer);
} sonst {
return slideUp(Ziel, Dauer);
}
}
/* FADE */
var toggleFadeiSense = (elem, show) => {
if (show) {
elem.style.display = "block";
setTimeout(function(){
elem.classList.add('show-isense');
elem.classList.remove('hide-isense');
},20)
} sonst {
elem.classList.remove('show-isense');
elem.classList.add('hide-isense');
setTimeout(() => {
elem.style.display = 'none';
}, 400)
}
}
var appiSlideUpAll = function() {
slideUp(document.querySelector('#form-appi-account-request'), 100);
document.querySelector('#btn-appi-account-request').setAttribute("aria-expanded", "false");
slideUp(document.querySelector('#form-appi-requests-request'), 100);
document.querySelector('#btn-appi-requests-request').setAttribute("aria-expanded", "false");
slideUp(document.querySelector('#form-appi-personal-information-request'), 100);
document.querySelector('#btn-appi-personal-information-request').setAttribute("aria-expanded", "false");
slideUp(document.querySelector('#form-appi-orders-request'), 100);
document.querySelector('#btn-appi-orders-request').setAttribute("aria-expanded", "false");
slideUp(document.querySelector('#form-appi-personal-data-report-request'), 100);
document.querySelector('#btn-appi-personal-data-report-request').setAttribute("aria-expanded", "false");
slideUp(document.querySelector('#form-appi-do-not-sell-request'), 100);
document.querySelector('#btn-appi-do-not-sell-request').setAttribute("aria-expanded", "false");
slideUp(document.querySelector('#form-appi-delete-account-request'), 100);
document.querySelector('#btn-appi-delete-account-request').setAttribute("aria-expanded", "false");
document.querySelector('#appi_page button').setAttribute("aria-expanded", "false");
};
var E-Mail, Typ, Zustimmung gegeben = false;
var verificationModalContent = '';
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) {
return false;
} else {
return regex.test(email);
}
}
var appiSendRequest = function(callback) {
fetch('https://www.cloudflare.com/cdn-cgi/trace', {
Methode: 'GET',
Header: {
'Content-Type': 'text/plain',
},
})
.then(resp => resp.text())
.then(resp => {
if (!resp.error) {
let ipInfo = resp;
let formData = new FormData();
if (type === 'customer/do-not-sell') {
isenseGDPR.Cookies.set('cookieconsent_preferences_disabled', 'analytics,marketing,functionality,', { expires: 365 });
isenseGDPR.Cookies.set('cookieconsent_status', 'accept_selected', { expires: 365 });
if (typeof window.Shopify.customerPrivacy !== 'undefined' && typeof window.Shopify.customerPrivacy.setTrackingConsent === 'function') {
window.Shopify.customerPrivacy.setTrackingConsent(
{
"sale_of_data": false,
},
() => { console.log('sale_of_data: false')}
);
} else {
console.log('Kundendatenschutz-API ist auf der aktuellen Seite nicht definiert');
}
if (document.querySelector('.cc-window')) {
document.querySelector('.cc-window').style.display = 'none';
}
// Popup-Text zurücksetzen
document.querySelector('#appi-modal-container-text').innerHTML = 'Ich bin damit einverstanden, dass meine E-Mail-Adresse und IP-Adresse zum Zweck der Bearbeitung dieser Anfrage erfasst werden. Weitere Informationen finden Sie unter Datenschutzrichtlinie und Nutzungsbedingungen.';
}
formData.append('shop', Shopify.shop);
formData.append('email', E-Mail);
formData.append('type', Typ);
formData.append('sourceOfRequest', 3);
formData.append('ipAddress', ipInfo);
formData.append('consentGiven', consentGiven);
formData.append('page', 'appi');
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) {
appiSlideUpAll();
if (resp.message.length) {
alert(resp.message);
} else {
alert('Ihre Anfrage wurde erfolgreich übermittelt. Weitere Informationen erhalten Sie in Ihrem E-Mail-Postfach.');
}
} else {
alert(resp.message);
}
if (typeof callback == 'function') {
callback(resp);
}
})
.catch(error => {
alert(error.message);
})
}
else {
alert(resp.message);
}
})
}
//Modal an den Hauptteil anhängen, da es sonst nicht zentriert bleibt (auch bei fester Position)
document.querySelector("body").insertAdjacentHTML( 'beforeend', verificationModalContent);
document.addEventListener("DOMContentLoaded", function() {
let searchParams = new URLSearchParams(window.location.search);
let param = searchParams.get('id');
if(param) {
document.getElementById(param).scrollIntoView();
}
// Wenn der Nutzer auf (x) klickt, wird das Modalfenster geschlossen.
document.querySelector('.data-verification-close').addEventListener('click', function(e) {
e.preventDefault();
closeVerificationModal();
// Fokussieren Sie die Schaltfläche des ausgewählten Anfragetyps.
let appiForms = document.querySelectorAll('.form-appi-request');
appiForms.forEach(function(appiForm) {
if (appiForm.style.display !== "none") {
lit appiFormLinks = appiForm.previousElementSibling.querySelectorAll('li');
if (appiFormLinks.length === 1) {
appiFormLinks[0].querySelector('button').focus();
}
}
});
});
document.querySelector('#data-verification-icon, #data-verification-container p').addEventListener('click', function(e) {
e.preventDefault();
// Klick auf eine href erkennen, da diese überschrieben wird.
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';
allowGiven = true;
appiSendRequest(function(resp) {
allowGiven = false;
closeVerificationModal();
});
}, 400);
});
});
function openVerificationModal(){
if(!isEmailValid(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';
// Fokussiere die Schaltfläche des ausgewählten Anfragetyps
let appiForms = document.querySelectorAll('.form-appi-request');
appiForms.forEach(function(appiForm) {
if (appiForm.style.display !== "none") {
let appiFormLinks = appiForm.previousElementSibling.querySelectorAll('li');
if (appiFormLinks.length === 1) {
appiFormLinks[0].querySelector('button').focus();
} else {
// Fokuslogik für Datenportabilitätsanfragen
appiFormLinks = appiForm.parentElement;
if (appiFormLinks.nodeName === 'LI') {
appiFormLinks.querySelector('button').focus();
}
}
}
});
}
document.querySelector('#btn-appi-Kontobearbeitungsanfrage').addEventListener('click', function(e) {
e.preventDefault();
let isExpanded = this.getAttribute('aria-expanded') === 'true' ? true : false;
appiSlideUpAll();
if(!isExpanded) {
slideDown(document.querySelector('#form-appi-Kontobearbeitungsanfrage'), 200);
this.setAttribute("aria-expanded", "true");
} else {
slideUp(document.querySelector('#form-appi-Kontobearbeitungsanfrage'), 200);
this.setAttribute("aria-expanded", "false");
}
});
document.querySelector('#form-appi-edit-account-request-submit').addEventListener('click', function(e) {
e.preventDefault();
email = document.querySelector('#form-appi-edit-account-request-email').value;
type = 'customer/edit';
appiSendRequest(function(resp) {
allowGiven = true;
});
});
document.querySelector('#btn-appi-requests-request').addEventListener('click', function(e) {
e.preventDefault();
let isExpanded = this.getAttribute('aria-expanded') === 'true' ? true : false;
appiSlideUpAll();
if(!isExpanded) {
slideDown(document.querySelector('#form-appi-requests-request'), 200);
this.setAttribute("aria-expanded", "true");
} else {
slideUp(document.querySelector('#form-appi-requests-request'), 200);
this.setAttribute("aria-expanded", "false");
}
});
document.querySelector('#form-appi-requests-request-submit').addEventListener('click', function(e) {
e.preventDefault();
email = document.querySelector('#form-appi-requests-request-email').value;
type = 'customer/requests';
appiSendRequest(function(resp) {
allowGiven = true;
});
});
document.querySelector('#btn-appi-personal-information-request').addEventListener('click', function(e) {
e.preventDefault();
let isExpanded = this.getAttribute('aria-expanded') === 'true' ? true : false;
appiSlideUpAll();
if(!isExpanded) {
slideDown(document.querySelector('#form-appi-personal-information-request'), 200);
this.setAttribute("aria-expanded", "true");
} else {
slideUp(document.querySelector('#form-appi-personal-information-request'), 200);
this.setAttribute("aria-expanded", "false");
}
});
document.querySelector('#form-appi-personal-information-request-submit').addEventListener('click', function(e) {
e.preventDefault();
email = document.querySelector('#form-appi-personal-information-request-email').value;
type = 'customer/personal_info';
appiSendRequest(function(resp) {
allowGiven = true;
});
});
document.querySelector('#btn-appi-orders-request').addEventListener('click', function(e) {
e.preventDefault();
let isExpanded = this.getAttribute('aria-expanded') === 'true' ? true : false;
appiSlideUpAll();
if(!isExpanded) {
slideDown(document.querySelector('#form-appi-orders-request'), 200);
this.setAttribute("aria-expanded", "true");
} else {
slideUp(document.querySelector('#form-appi-orders-request'), 200);
this.setAttribute("aria-expanded", "false");
}
});
document.querySelector('#form-appi-orders-request-submit').addEventListener('click', function(e) {
e.preventDefault();
email = document.querySelector('#form-appi-orders-request-email').value;
type = 'customer/orders';
appiSendRequest(function(resp) {
allowGiven = true;
});
});
document.querySelector('#btn-appi-persönliche-daten-berichtsanfrage').addEventListener('click', function(e) {
e.preventDefault();
let isExpanded = this.getAttribute('aria-expanded') === 'true' ? true : false;
appiSlideUpAll();
if(!isExpanded) {
slideDown(document.querySelector('#form-appi-persönliche-daten-berichtsanfrage'), 200);
this.setAttribute("aria-expanded", "true");
} else {
slideUp(document.querySelector('#form-appi-persönliche-daten-berichtsanfrage'), 200);
this.setAttribute("aria-expanded", "false");
}
});
document.querySelector('#form-appi-personal-data-report-request-submit').addEventListener('click', function(e) {
e.preventDefault();
email = document.querySelector('#form-appi-personal-data-report-request-email').value;
type = 'customer/report';
appiSendRequest(function(resp) {
allowGiven = true;
});
});
document.querySelector('#btn-appi-do-not-sell-request').addEventListener('click', function(e) {
e.preventDefault();
let isExpanded = this.getAttribute('aria-expanded') === 'true' ? true : false;
appiSlideUpAll();
if(!isExpanded) {
slideDown(document.querySelector('#form-appi-do-not-sell-request'), 200);
this.setAttribute("aria-expanded", "true");
} else {
slideUp(document.querySelector('#form-appi-do-not-sell-request'), 200);
this.setAttribute("aria-expanded", "false");
}
});
document.querySelector('#form-appi-do-not-sell-request-submit').addEventListener('click', function(e) {
e.preventDefault();
email = document.querySelector('#form-appi-do-not-sell-request-email').value;
type = 'customer/do-not-sell';
// Prüfen, ob Kunde angemeldet ist
if (__st.cid != undefined) {
document.querySelector('#appi-modal-container-text').innerHTML = 'Ich stimme der Erfassung meiner E-Mail-Adresse und IP-Adresse zum Zweck der Bearbeitung dieser Anfrage zu. Weitere Informationen finden Sie in der Datenschutzrichtlinie und Nutzungsbedingungen.';
} else {
document.querySelector('#appi-modal-container-text').innerHTML = 'Ich bin damit einverstanden, dass meine E-Mail-Adresse und IP-Adresse zum Zwecke der Bearbeitung dieser Anfrage erfasst werden. Weitere Informationen finden Sie in der Datenschutzrichtlinie und Nutzungsbedingungen. Hinweis: Wenn Sie Gastnutzer sind oder nicht in Ihrem Konto angemeldet sind, gilt Ihre Deaktivierungsentscheidung nur für diese Browsersitzung.';
}
appiSendRequest(function(resp) {
allowGiven = true;
});
});
document.querySelector('#btn-appi-delete-account-request').addEventListener('click', function(e) {
e.preventDefault();
let isExpanded = this.getAttribute('aria-expanded') === 'true' ? true : false;
appiSlideUpAll();
if(!isExpanded) {
slideDown(document.querySelector('#form-appi-delete-account-request'), 200);
this.setAttribute("aria-expanded", "true");
} else {
slideUp(document.querySelector('#form-appi-delete-account-request'), 200);
this.setAttribute("aria-expanded", "false");
}
});
document.querySelector('#form-appi-delete-account-request-submit').addEventListener('click', function(e) {
e.preventDefault();
email = document.querySelector('#form-appi-delete-account-request-email').value;
type = 'customer/delete';
appiSendRequest(function(resp) {
allowGiven = true;
});
});
// Tastaturnavigation im Datenüberprüfungsmodal 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 === "Leertaste";
let isEnterPressed = event.keyCode === 13 || e.key === "Eingabe" || event.code === "Eingabe";
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 den Aufruf von e.preventDefault() nach jeder Fokussierung.
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);
}
}
}
});
