GDPR Send Request-funksjon og spinner, 1500ms uendelig rotering med 360 grader
```html
#form-gdpr-edit-account-request,
#form-gdpr-requests-request,
#form-gdpr-personal-information-request,
#form-gdpr-orders-request,
#form-gdpr-personal-data-report-request,
#form-gdpr-slett-konto-forespørsel {
display: none;
}
#gdpr_side button {
background-color: transparent;
border: 0;
border-bottom: 1px solid black;
padding: 0px;
}
/* Moderatorbakgrunn */
#data-verification-background {
display: none;
position: fixed;
z-index: 1;
padding-top: calc(50vh - 83px);
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: rgb(0,0,0);
background-color: rgba(0,0,0,0.4);
opacity: unset;
z-index: 9999;
}
/* Modalinhold */
#data-verification-modal {
background-color: #fefefe;
margin: auto;
padding: 16px;
border: 1px solid #888;
width: 38%;
opacity: 1;
}
/* Modal lukkeknapp */
.data-verification-close {
color: #aaaaaa;
float: right;
font-size: 28px;
font-weight: bold;
line-height: 17px;
background-color: transparent;
border: 0px;
padding: 0px;
}
.data-verification-close:hover {
color: #000;
text-decoration: none;
cursor: pointer;
}
/* Avkrysningstekst */
#data-verification-container p {
display: inline-block;
padding: 0;
margin: 0;
line-height: 24px;
padding-left: 10px;
vertical-align: top;
width: calc(100% - 45px);
}
#data-verification-container a, #data-verification-container a:hover{
text-decoration: underline!important;
color: #4285f4;
}
#data-verification-container input {
opacity: 0;
width: 0;
height: 0;
margin: 0;
padding: 0;
}
/* Avkrysningsikon */
#data-verification-icon {
cursor: pointer;
position: relative;
margin: auto;
width: 18px;
height: 18px;
-webkit-tap-highlight-color: transparent;
transform: translate3d(0, 0, 0);
margin-top: 2px;
}
#data-verification-icon:before {
content: "";
position: absolute;
top: -7px;
left: -7px;
width: 32px;
height: 32px;
border-radius: 50%;
background: rgba(34,50,84,0.03);
opacity: 0;
transition: opacity 0.2s ease;
}
#data-verification-icon svg {
position: relative;
z-index: 1;
fill: none;
stroke-linecap: round;
stroke-linejoin: round;
stroke: #c8ccd4;
stroke-width: 1.5;
transform: translate3d(0, 0, 0);
transition: all 0.2s ease;
}
#data-verification-icon svg path {
stroke-dasharray: 60;
stroke-dashoffset: 0;
}
#data-verification-icon svg polyline {
stroke-dasharray: 22;
stroke-dashoffset: 66;
}
#data-verification-icon:hover:before {
opacity: 1;
}
#data-verification-container:hover #data-verification-icon svg {
stroke: #4285f4;
}
#data-verification-icon.clicked svg {
stroke: #4285f4;
}
#data-verification-icon.clicked svg path {
stroke-dashoffset: 60;
transition: all 0.3s linear;
}
#data-verification-icon.clicked svg polyline {
stroke-dashoffset: 42;
transition: all 0.2s linear;
transition-delay: 0.15s;
}
/* Tilgjengelighetsdesign */
#data-verification-icon:focus, .data-verification-close:focus, #data-verification-container input:focus ~ #data-verification-icon svg, #data-verification-container a:focus {
box-shadow: 0 0 0 3px rgba(21, 156, 228, 0.4);
transition: all 0.3s ease;
outline: none;
transform: scale(1.06);
}
/* Lastingselement */
.loading {
display: none;
top:50vh;
left:50vw;
position:fixed;
}
.loading:not(:required):after {
content: '';
display: block;
font-size: 10px;
width: 1em;
height: 1em;
margin-top: -0.5em;
-webkit-animation: spinner 1500ms infinite linear;
-moz-animation: spinner 1500ms infinite linear;
-ms-animation: spinner 1500ms infinite linear;
-o-animation: spinner 1500ms infinite linear;
animation: spinner 1500ms infinite linear;
border-radius: 0.5em;
-webkit-box-shadow: rgba(255,255,255, 1) 1.5em 0 0 0, rgba(255,255,255, 1) 1.1em 1.1em 0 0, rgba(255,255,255, 1) 0 1.5em 0 0, rgba(255,255,255, 1) -1.1em 1.1em 0 0, rgba(255,255,255, 1) -1.5em 0 0 0, rgba(255,255,255, 1) -1.1em -1.1em 0 0, rgba(255,255,255, 1) 0 -1.5em 0 0, rgba(255,255,255, 1) 1.1em -1.1em 0 0;
box-shadow: rgba(255,255,255, 1) 1.5em 0 0 0, rgba(255,255,255, 1) 1.1em 1.1em 0 0, rgba(255,255,255, 1) 0 1.5em 0 0, rgba(255,255,255, 1) -1.1em 1.1em 0 0, rgba(255,255,255, 1) -1.5em 0 0 0, rgba(255,255,255, 1) -1.1em -1.1em 0 0, rgba(255,255,255, 1) 0 -1.5em 0 0, rgba(255,255,255, 1) 1.1em -1.1em 0 0;
}
#gdpr_side .list-unstyled li button {
cursor: pointer;
}
.show-isense {
transition: opacity 400ms !important;
}
.hide-isense {
opacity: 0 !important;
transition: 0.4s ease-out;
}
/* Endringer av modaler på mobil oppløsning*/
@media only screen and (max-width: 600px) {
#data-verification-modal {
width: 90%;
}
}
/* Animasjon */
@-webkit-keyframes spinner {
0% {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-ms-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-moz-keyframes spinner {
0% {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-ms-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-o-keyframes spinner {
0% {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-ms-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes spinner {
0% {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-ms-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
}
Når du sender inn en Brukerdataforespørsel (DSAR) via vår Compliance-side, behandler vår samsvarsleverandør, Consentmo, din IP-adresse og e-post utelukkende for å oppfylle din forespørsel. Dette sikrer sikker og verifisert behandling av dine personlige opplysninger. For mer informasjon om hvordan dine data håndteres, kan du lese Consentmos Datahandlingspolicy ved å klikke på denne lenken: Consentmo’s Datahandlingspolicy.
Datapotting
Hvis kontodatabasen din er unøyaktig eller trenger oppdateringer, kan du effektivt rette den ved å bruke lenken nedenfor. Denne funksjonen sikrer at dine personlige opplysninger, viktige for en sømløs opplevelse med våre produkter som damesekker & lommebøker, er oppdaterte og nøyaktige.
Dataportabilitet
Vi gir deg muligheten til å laste ned all data vi lagrer, som brukes for å forbedre din handleopplevelse, særlig når du blar gjennom vårt utsøkte utvalg av damesekker & lommebøker. Dette sikrer at du har full kontroll og tilgang over dine personopplysninger.
Tilgang til personopplysninger
Du kan be om en omfattende rapport som detaljerer all personlig informasjon vi beholder om deg. Vi forplikter oss til å svare på din forespørsel innen 30 dager, og gir deg innsyn i dine data. Denne prosessen er tilrettelagt via gdprsendrequest-funksjonen resp, som sikrer trygg levering av informasjonen din.
Rett til å bli glemt
Dette alternativet lar deg permanent fjerne dine personlige og andre tilknyttede data fra vår butikk. Vær oppmerksom på at å starte denne prosessen vil føre til at kontoen din slettes, og den vil ikke være tilgjengelig for fremtidig bruk. Lastingsanimasjonen, som ligner en spinner på 1500ms uendelig, roterer ved 360 grader og indikerer at forespørselen behandles.
Rett til å begrense behandling
Under visse omstendigheter har du rett til å be om at vi begrenser eller midlertidig stanser behandlingen av dine personopplysninger. For hjelp med å utøve denne retten, kontakt oss direkte på stiledonnabags@gmail.com.
Rett til å protestere
Du har rett til å protestere mot visse typer databehandling, inkludert direkte markedsføring og behandling basert på berettiget interesse. For å sende inn din protest og få dine preferanser respektert, kontakt oss på stiledonnabags@gmail.com.
Kontaktinformasjon
For spørsmål angående dine personopplysninger eller personvernrettigheter, vennligst kontakt vår dedikerte personvernsansvarlige (DPO) på følgende opplysninger:
E-post: stiledonnabags@gmail.com
Adresse: Via Testulla 149, 95122 Catania Catania, Italia
Rett til å klage
Hvis du føler at dine bekymringer ikke er blitt adressert tilstrekkelig, har du rett til å inngi klage til din nasjonale databeskyttelsesmyndighet.
/* SLID opp */
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);
}
/* SLIDE NED */
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)
}
/* TILBAKE */
var slideToggle = (target, duration = 500) => {
if (window.getComputedStyle(target).display === 'none') {
return slideDown(target, duration);
} else {
return slideUp(target, duration);
}
}
/* FADE */
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 gdprSlideUpAll = function() {
slideUp(document.querySelector('#form-gdpr-edit-account-request'), 100);
document.querySelector('#btn-gdpr-edit-account-request').setAttribute("aria-expanded", "false");
slideUp(document.querySelector('#form-gdpr-requests-request'), 100);
document.querySelector('#btn-gdpr-requests-request').setAttribute("aria-expanded", "false");
slideUp(document.querySelector('#form-gdpr-personal-information-request'), 100);
document.querySelector('#btn-gdpr-personal-information-request').setAttribute("aria-expanded", "false");
slideUp(document.querySelector('#form-gdpr-orders-request'), 100);
document.querySelector('#btn-gdpr-orders-request').setAttribute("aria-expanded", "false");
slideUp(document.querySelector('#form-gdpr-personal-data-report-request'), 100);
document.querySelector('#btn-gdpr-personal-data-report-request').setAttribute("aria-expanded", "false");
slideUp(document.querySelector('#form-gdpr-delete-account-request'), 100);
document.querySelector('#btn-gdpr-delete-account-request').setAttribute("aria-expanded", "false");
document.querySelector('#gdpr_side button').setAttribute("aria-expanded", "false");
};
var epost, type, consentGitt = false;
var verificationModalContent = '
Jeg gir mitt samtykke til innsamling av min e-post og IP-adresse for å behandle denne forespørselen. For mer, se Personvernpolicy & Vilkår for bruk.
var erEpostGyldig = function(epost) {
let regex = /^(?:(?!.*\b(?:test|sample)\b).)*$/; // Endret til generell e-post validering
if (epost == '' || epost == undefined) {
return false;
} else {
return regex.test(epost);
}
}
var gdprSendRequest = 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', epost);
formData.append('type', type);
formData.append('sourceOfRequest', 1);
formData.append('ipAddress', ipInfo);
formData.append('consentGiven', consentGitt);
formData.append('page', 'gdpr');
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) {
gdprSlideUpAll();
if (resp.message.length) {
alert(resp.message);
} else {
alert('Forespørselen er sendt inn. Vennligst sjekk e-posten din for mer informasjon.');
}
} else {
alert(resp.message);
}
if (typeof callback == 'function') {
callback(resp);
}
})
.catch(error => {
alert(error.message);
})
}
else {
alert(resp.message);
}
})
}
//Legg til modal i body, fordi den ellers ikke forblir sentrert (selv om posisjon er fast)
document.querySelector("body").insertAdjacentHTML( 'beforeend', verificationModalContent);
document.addEventListener("DOMContentLoaded", function() {
// Når brukeren klikker på (x), lukk modalen
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();
// Oppdag et href-klikk, fordi det overskrives.
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';
consentGitt = true;
gdprSendRequest(function(resp) {
consentGitt = false;
closeVerificationModal();
});
}, 400);
});
});
funksjon openVerificationModal(){
hvis(!erEpostGyldig(epost)) {
alert('Ugyldig e-post');
return;
}
toggleFadeiSense(document.querySelector("#data-verification-modal"), true);
toggleFadeiSense(document.querySelector('#data-verification-background'), true);
document.querySelector('#data-verification-container input').focus();
}
funksjon 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';
// Fokusere på knappen for forespørselstypen som ble valgt
la GDPR-skjemaer = document.querySelectorAll('.form-gdpr-request');
gdpr-skjemaer.forEach(function(gdprSkjema) {
hvis (gdprSkjema.style.display !== "none") {
la gdprSkjemalinker = gdprSkjema.previousElementSibling.querySelectorAll('li');
hvis (gdprSkjemalinker.length === 1) {
gdprSkjemalinker[0].querySelector('button').focus();
} else {
// Fokuslogikk for Data Portabilitet forespørsler
gdprSkjemalinker = gdprSkjema.parentElement;
hvis (gdprSkjemalinker.nodeName === 'LI') {
gdprSkjemalinker.querySelector('button').focus();
}
}
}
});
}
document.querySelector('#btn-gdpr-edit-account-request').addEventListener('click', function(e) {
e.preventDefault();
la erUtvidet = this.getAttribute('aria-expanded') === 'true' ? true : false;
gdprSlideUpAll();
hvis (!erUtvidet) {
slideDown(document.querySelector('#form-gdpr-edit-account-request'), 200);
this.setAttribute("aria-expanded", "true");
} else {
slideUp(document.querySelector('#form-gdpr-edit-account-request'), 200);
this.setAttribute("aria-expanded", "false");
}
});
document.querySelector('#form-gdpr-edit-account-request-submit').addEventListener('click', function(e) {
e.preventDefault();
epost = document.querySelector('#form-gdpr-edit-account-request-email').value;
type = 'kundere/rediger';
gdprSendRequest(function(resp) {
consentGitt = true;
});
});
document.querySelector('#btn-gdpr-requests-request').addEventListener('click', function(e) {
e.preventDefault();
la erUtvidet = this.getAttribute('aria-expanded') === 'true' ? true : false;
gdprSlideUpAll();
hvis (!erUtvidet) {
slideDown(document.querySelector('#form-gdpr-requests-request'), 200);
this.setAttribute("aria-expanded", "true");
} else {
slideUp(document.querySelector('#form-gdpr-requests-request'), 200);
this.setAttribute("aria-expanded", "false");
}
});
document.querySelector('#form-gdpr-requests-request-submit').addEventListener('click', function(e) {
e.preventDefault();
epost = document.querySelector('#form-gdpr-requests-request-email').value;
type = 'kunde/forespørsler';
gdprSendRequest(function(resp) {
consentGitt = true;
});
});
document.querySelector('#btn-gdpr-personal-information-request').addEventListener('click', function(e) {
e.preventDefault();
la erUtvidet = this.getAttribute('aria-expanded') === 'true' ? true : false;
gdprSlideUpAll();
hvis (!erUtvidet) {
slideDown(document.querySelector('#form-gdpr-personal-information-request'), 200);
this.setAttribute("aria-expanded", "true");
} else {
slideUp(document.querySelector('#form-gdpr-personal-information-request'), 200);
this.setAttribute("aria-expanded", "false");
}
});
document.querySelector('#form-gdpr-personal-information-request-submit').addEventListener('click', function(e) {
e.preventDefault();
epost = document.querySelector('#form-gdpr-personal-information-request-email').value;
type = 'kunde/personlig_info';
gdprSendRequest(function(resp) {
consentGitt = true;
});
});
document.querySelector('#btn-gdpr-orders-request').addEventListener('click', function(e) {
e.preventDefault();
la erUtvidet = this.getAttribute('aria-expanded') === 'true' ? true : false;
gdprSlideUpAll();
hvis (!erUtvidet) {
slideDown(document.querySelector('#form-gdpr-orders-request'), 200);
this.setAttribute("aria-expanded", "true");
} else {
slideUp(document.querySelector('#form-gdpr-orders-request'), 200);
this.setAttribute("aria-expanded", "false");
}
});
document.querySelector('#form-gdpr-orders-request-submit').addEventListener('click', function(e) {
e.preventDefault();
epost = document.querySelector('#form-gdpr-orders-request-email').value;
type = 'kunde/bestillinger';
gdprSendRequest(function(resp) {
consentGitt = true;
});
});
document.querySelector('#btn-gdpr-personal-data-report-request').addEventListener('click', function(e) {
e.preventDefault();
la erUtvidet = this.getAttribute('aria-expanded') === 'true' ? true : false;
gdprSlideUpAll();
hvis (!erUtvidet) {
slideDown(document.querySelector('#form-gdpr-personal-data-report-request'), 200);
this.setAttribute("aria-expanded", "true");
} else {
slideUp(document.querySelector('#form-gdpr-personal-data-report-request'), 200);
this.setAttribute("aria-expanded", "false");
}
});
document.querySelector('#form-gdpr-personal-data-report-request-submit').addEventListener('click', function(e) {
e.preventDefault();
epost = document.querySelector('#form-gdpr-personal-data-report-request-email').value;
type = 'kunde/rapport';
gdprSendRequest(function(resp) {
consentGitt = true;
});
});
document.querySelector('#btn-gdpr-delete-account-request').addEventListener('click', function(e) {
e.preventDefault();
la erUtvidet = this.getAttribute('aria-expanded') === 'true' ? true : false;
gdprSlideUpAll();
hvis (!erUtvidet) {
slideDown(document.querySelector('#form-gdpr-delete-account-request'), 200);
this.setAttribute("aria-expanded", "true");
} else {
slideUp(document.querySelector('#form-gdpr-delete-account-request'), 200);
this.setAttribute("aria-expanded", "false");
}
});
document.querySelector('#form-gdpr-delete-account-request-submit').addEventListener('click', function(e) {
e.preventDefault();
epost = document.querySelector('#form-gdpr-delete-account-request-email').value;
type = 'kunde/slettet';
gdprSendRequest(function(resp) {
consentGitt = true;
});
});
// Tastaturnavigasjon i datavalideringsnmodal for tilgjengelighet
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.keyCode === "Enter";
let dataVerificationCloseButton = document.querySelector('.data-verification-close');
let dataVerificationCheckbox = document.querySelector('#data-verification-container input');
let dataVerificationLink = document.querySelector('#data-verification-container a');
// Denne funksjonen redder oss fra å måtte kalle e.preventDefault() etter hver fokusering
let executeFocus = (focusElement) => {focusElement.focus();e.preventDefault();}
hvis (isEscapePressed) {
hvis (dataVerificationCloseButton) {
dataVerificationCloseButton.click();
}
}
hvis (isSpacePressed || isEnterPressed) {
hvis (dokument.activeElement === dataVerificationCheckbox) {
dokument.querySelector('#data-verification-container #data-verification-icon').click();
}
}
hvis (isTabPressed) {
hvis (e.shiftKey) {
hvis (dataVerificationCloseButton && dokument.activeElement === dataVerificationCloseButton) {
executeFocus(dataVerificationLink);
}
} else {
hvis (dataVerificationLink && dokument.activeElement === dataVerificationLink) {
executeFocus(dataVerificationCloseButton);
}
}
}
});
```
