334 lines
10 KiB
JavaScript
334 lines
10 KiB
JavaScript
// Parametri di configurazione
|
||
const cookiePolicyUrl = "https://www.adriaticasistemi.it/it/cookiepolicy";
|
||
const cookieApiUrl = "https://cookie.adriaticasistemi.it/consensi";
|
||
const cookieApiH = "d4c1b34181a4b565e9878ff5d579940ad0f308adc73fbfa02addc1f36fd5412a";
|
||
const cookieExpiresDays = 120;
|
||
const cookieBsVersione = 5;
|
||
|
||
const cookieAcceptText = "Accetto tutti";
|
||
const cookieDeclineText = "Rifiuto";
|
||
const cookiePolicyMainColor = "#F4C058";
|
||
const cookiePolicyMainColorContrast = "#FFFFFF";
|
||
const cookiePolicyText = `Utilizziamo cookie, anche di terze parti, per consentire il funzionamento del nostro sito e dei servizi
|
||
offerti e per misurare in forma aggregata il traffico e le prestazioni dello stesso e dei relativi servizi
|
||
nonché, previo tuo consenso, per utilizzare dati sulla tua attività navigazione, al fine di migliorare le
|
||
prestazioni, personalizzare la navigazione sulla base delle tue preferenze, inviare pubblicità mirata.
|
||
Cliccando su “${cookieAcceptText}” acconsenti all’attivazione di tutti i cookie.
|
||
Cliccando su "${cookieDeclineText}" permarranno le
|
||
impostazioni di default e, dunque, continuerai a navigare in assenza di cookie o altri strumenti di
|
||
tracciamento diversi da quelli tecnici. Per maggiori informazioni sui cookie utilizzati, consulta la <a
|
||
class="cookie_link"
|
||
href="${cookiePolicyUrl}"
|
||
target="_blank">cookie policy</a>.`;
|
||
|
||
// Blocchi html e css Bootstrap 5
|
||
const cookieBlockStyle = `<style data-bs-v="5">
|
||
|
||
/** COOKIE POLICY STYLE **/
|
||
|
||
#cookie_banner {
|
||
background-color: ${cookiePolicyMainColor};
|
||
color: ${cookiePolicyMainColorContrast};
|
||
bottom: 0;
|
||
height: auto;
|
||
padding: 16px 16px 12px;
|
||
position: fixed;
|
||
width: 100%;
|
||
z-index: 1000;
|
||
font-size: 0.9em;
|
||
}
|
||
|
||
#cookie_banner a {
|
||
color: ${cookiePolicyMainColorContrast};
|
||
}
|
||
|
||
#cookie_banner a.cookie_link{
|
||
text-decoration: underline !important;
|
||
}
|
||
|
||
#cookie_banner a.btn {
|
||
border: 1px solid ${cookiePolicyMainColorContrast};
|
||
border-radius: 0;
|
||
text-decoration: none;
|
||
}
|
||
|
||
#cookie_banner a.btn:hover {
|
||
background-color: ${cookiePolicyMainColorContrast};
|
||
color: ${cookiePolicyMainColor};
|
||
text-decoration: none;
|
||
}
|
||
|
||
#cookie_main_btn {
|
||
display: block;
|
||
position: fixed;
|
||
bottom: 20px;
|
||
right: 10px;
|
||
padding: 10px;
|
||
background: #FFFFFF;
|
||
border-radius: 50%;
|
||
box-shadow: 0 4px 8px 0 rgb(0 0 0 / 20%);
|
||
cursor:pointer;
|
||
}
|
||
|
||
#cookie_main_btn:hover{
|
||
box-shadow: 0 4px 8px 0 rgb(0 0 0 / 50%);
|
||
}
|
||
|
||
#cookie_main_btn img{
|
||
width: 42px;
|
||
height: 42px;
|
||
}
|
||
|
||
#close_btn{
|
||
padding-right: 4px;
|
||
margin-bottom: 4px;
|
||
color: #9D9D9D;
|
||
cursor: pointer;
|
||
}
|
||
|
||
#close_btn:hover{
|
||
color: #FFFFFF;
|
||
}
|
||
|
||
.text-block{
|
||
text-align: justify;
|
||
}
|
||
|
||
</style>`;
|
||
const cookieBlockHtml = `
|
||
<div id="cookie_block" data-bs-v="5">
|
||
<div id="cookie_main_btn">
|
||
<img src="./cookie/cookies-icon.svg" alt="cookie" />
|
||
</div>
|
||
<div id="cookie_banner">
|
||
<div class="row">
|
||
<div class="col-12">
|
||
<i id="close_btn" class="fa fa-times pull-right"></i>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-12 col-md-9 text-block">
|
||
${cookiePolicyText}
|
||
</div>
|
||
<div class="col-12 col-md-3 mb-2 mt-2">
|
||
<div class="d-grid gap-2">
|
||
<a data-cookie="all" href="#" class="btn btn-outline-light btn-sm cookie_btn"><i class="fa fa-check fa-fw"></i> ${cookieAcceptText}</a>
|
||
<a data-cookie="tecnici" href="#" class="btn btn-outline-light btn-sm cookie_btn"><i class="fa fa-times fa-fw"></i> ${cookieDeclineText}</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>`;
|
||
|
||
// Blocchi Html per Bootstrap 4
|
||
const cookieBlockStyle_Bs4 = `<style data-bs-v="4">
|
||
|
||
/** COOKIE POLICY STYLE **/
|
||
|
||
#cookie_banner {
|
||
background-color: ${cookiePolicyMainColor};
|
||
color: ${cookiePolicyMainColorContrast};
|
||
bottom: 0;
|
||
height: auto;
|
||
padding: 16px 16px 12px;
|
||
position: fixed;
|
||
width: 100%;
|
||
z-index: 1000;
|
||
font-size: 12px;
|
||
}
|
||
|
||
#cookie_banner a {
|
||
color: ${cookiePolicyMainColorContrast};
|
||
}
|
||
|
||
#cookie_banner a.cookie_link{
|
||
text-decoration: underline !important;
|
||
}
|
||
|
||
#cookie_banner a.btn {
|
||
border: 1px solid ${cookiePolicyMainColorContrast};
|
||
border-radius: 0;
|
||
text-decoration: none;
|
||
}
|
||
|
||
#cookie_banner a.btn:hover {
|
||
background-color: ${cookiePolicyMainColorContrast};
|
||
color: ${cookiePolicyMainColor};
|
||
text-decoration: none;
|
||
}
|
||
|
||
#cookie_main_btn {
|
||
display: block;
|
||
position: fixed;
|
||
bottom: 20px;
|
||
right: 10px;
|
||
padding: 10px;
|
||
background: #FFFFFF;
|
||
border-radius: 50%;
|
||
box-shadow: 0 4px 8px 0 rgb(0 0 0 / 20%);
|
||
cursor:pointer;
|
||
}
|
||
|
||
#cookie_main_btn:hover{
|
||
box-shadow: 0 4px 8px 0 rgb(0 0 0 / 50%);
|
||
}
|
||
|
||
#cookie_main_btn img{
|
||
width: 42px;
|
||
height: 42px;
|
||
}
|
||
|
||
#close_btn{
|
||
padding-right: 8px;
|
||
margin-bottom: 4px;
|
||
color: #9D9D9D;
|
||
cursor: pointer;
|
||
}
|
||
|
||
#close_btn:hover{
|
||
color: #FFFFFF;
|
||
}
|
||
|
||
</style>`;
|
||
const cookieBlockHtml_Bs4 = `
|
||
<div id="cookie_block" data-bs-v="4">
|
||
<div id="cookie_main_btn">
|
||
<img src="./cookie/cookies-icon.svg" alt="cookie" />
|
||
</div>
|
||
<div id="cookie_banner">
|
||
<div class="row">
|
||
<div class="col-xs-12 col-md-9 text-justify">
|
||
${cookiePolicyText}
|
||
</div>
|
||
<div class="col-xs-12 col-md-3">
|
||
<i id="close_btn" class="fa fa-times pull-right"></i>
|
||
<div class="clearfix"></div>
|
||
<a data-cookie="all" href="#" class="btn pull-right btn-sm mt-2 cookie_btn"><i class="fa fa-check fa-fw"></i> ${cookieAcceptText}</a>
|
||
<a data-cookie="tecnici" href="#" class="btn pull-right btn-sm mt-2 cookie_btn"><i class="fa fa-times fa-fw"></i> ${cookieDeclineText}</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>`;
|
||
|
||
// Terze Parti Html Block
|
||
const cookieAnalyticsGTagBlock = ``;
|
||
|
||
// Funzioni per la gestione dei cookie
|
||
function createCookie(name, value, days) {
|
||
let expires = "";
|
||
if (days) {
|
||
const date = new Date();
|
||
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
|
||
expires = "; expires=" + date.toGMTString();
|
||
}
|
||
|
||
document.cookie = name + "=" + value + expires + "; path=/";
|
||
}
|
||
|
||
function readCookie(name) {
|
||
let nameEQ = name + "=";
|
||
let ca = document.cookie.split(';');
|
||
for (let i = 0; i < ca.length; i++) {
|
||
let c = ca[i];
|
||
while (c.charAt(0) == ' ') c = c.substring(1, c.length);
|
||
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length);
|
||
}
|
||
return null;
|
||
}
|
||
|
||
function eraseCookie(name) {
|
||
createCookie(name, "", -1);
|
||
}
|
||
|
||
function removeCookieTerzeParti() {
|
||
$('.gtag_block').remove();
|
||
}
|
||
|
||
function addCookieTerzeParti() {
|
||
if(cookieAnalyticsGTagBlock) $(document.head).append(cookieAnalyticsGTagBlock);
|
||
}
|
||
|
||
function closeBanner(slide = true) {
|
||
const cookieBanner = $('#cookie_banner');
|
||
const cookieMainBtn = $('#cookie_main_btn');
|
||
slide ? cookieBanner.slideUp() : cookieBanner.hide();
|
||
slide ? cookieMainBtn.slideDown() : cookieMainBtn.show();
|
||
}
|
||
|
||
function showBanner(slide = true) {
|
||
const cookieBanner = $('#cookie_banner');
|
||
const cookieMainBtn = $('#cookie_main_btn');
|
||
slide ? cookieBanner.slideDown() : cookieBanner.show();
|
||
slide ? cookieMainBtn.slideUp() : cookieMainBtn.hide();
|
||
}
|
||
|
||
function initCookiePlugin() {
|
||
const cookieStyle = cookieBsVersione === 4 ? cookieBlockStyle_Bs4 : cookieBlockStyle;
|
||
const cookieHtml = cookieBsVersione === 4 ? cookieBlockHtml_Bs4 : cookieBlockHtml;
|
||
$(document.head).append(cookieStyle);
|
||
$(document.body).append(cookieHtml);
|
||
}
|
||
|
||
// Controller
|
||
|
||
$(document).ready(function () {
|
||
|
||
initCookiePlugin();
|
||
|
||
const cookiePolicyInfo = JSON.parse(readCookie('cookiePolicyInfo'));
|
||
const displayCookiePolicy = readCookie('displayCookiePolicy');
|
||
|
||
displayCookiePolicy ? closeBanner(false) : showBanner(false);
|
||
|
||
// Gestione Cookie Terze Parti
|
||
(cookiePolicyInfo && cookiePolicyInfo.CheckCookieTerzeParti) ? addCookieTerzeParti() : undefined;
|
||
|
||
}).delegate('.cookie_btn', 'click', (link) => {
|
||
link.preventDefault();
|
||
|
||
const element = $(link.target);
|
||
if (element.attr('disabled')) return;
|
||
|
||
const icon = element.children('i');
|
||
|
||
const CheckCookieTerzeParti = element.data('cookie') === "all";
|
||
|
||
const callSettings = {
|
||
url: cookieApiUrl,
|
||
type: 'POST',
|
||
dataType: 'json',
|
||
contentType: "application/json",
|
||
data: JSON.stringify({
|
||
CheckCookieTecnici: true,
|
||
CheckCookieTerzeParti,
|
||
UrlSito: window.location.host
|
||
})
|
||
};
|
||
|
||
const iconName = CheckCookieTerzeParti ? 'fa-check' : 'fa-times';
|
||
icon.removeClass(iconName).addClass('fa-circle-o-notch fa-spin');
|
||
$('.cookie_btn').attr('disabled', true);
|
||
|
||
if (cookieApiH) callSettings.headers = {Authorization: cookieApiH};
|
||
|
||
$.ajax(callSettings).done((res) => {
|
||
createCookie('displayCookiePolicy', res.Identificativo, cookieExpiresDays);
|
||
createCookie('cookiePolicyInfo', JSON.stringify(res), cookieExpiresDays);
|
||
|
||
// Inserisce i blocchi autorizzati con i cookie di terze parti
|
||
res.CheckCookieTerzeParti ? addCookieTerzeParti() : removeCookieTerzeParti();
|
||
|
||
closeBanner();
|
||
}).fail(() => {
|
||
eraseCookie('displayCookiePolicy');
|
||
eraseCookie('cookiePolicyInfo');
|
||
}).always(() => {
|
||
$('.cookie_btn').removeAttr('disabled');
|
||
icon.removeClass('fa-circle-o-notch fa-spin').addClass(iconName);
|
||
});
|
||
}).delegate('#cookie_main_btn', 'click', () => {
|
||
showBanner();
|
||
}).delegate('#close_btn', 'click', () => {
|
||
closeBanner();
|
||
});
|