|
//**## cookie js script ##**// |
|
|
|
console.debug("cookie.js loaded"); |
|
// IE8 does not support textContent, so we should fallback to innerText. |
|
let supportsTextContent = "textContent" in document.body; |
|
|
|
const myCookie = (msg, btn1, btn2, path) => { |
|
let cookieName = "cookieConsent"; |
|
let cookieConsentId = "cookieInfo"; |
|
let dismissLinkId = "cookieDismiss"; |
|
|
|
const _createHeaderElement = ( |
|
cookieText, |
|
dismissText, |
|
linkText, |
|
linkHref |
|
) => { |
|
let butterBarStyles = |
|
"z-index:1060;position:fixed;width:100%;background-color:rgba(127,127,127,1);color:#ffffff;" + |
|
"margin:0; left:0; top:0; padding:20px;text-align:center;"; |
|
|
|
let cookieConsentElement = document.createElement("div"); |
|
cookieConsentElement.id = cookieConsentId; |
|
cookieConsentElement.style.cssText = butterBarStyles; |
|
cookieConsentElement.appendChild(_createConsentText(cookieText)); |
|
|
|
if (!!linkText && !!linkHref) { |
|
let infoLink = _createInformationLink(linkText, linkHref); |
|
infoLink.classList.add("btn-info"); |
|
cookieConsentElement.appendChild(infoLink); |
|
} |
|
let dismissLink = _createDismissLink(dismissText); |
|
dismissLink.classList.add("btn-success"); |
|
cookieConsentElement.appendChild(dismissLink); |
|
|
|
return cookieConsentElement; |
|
}; |
|
|
|
const _createDialogElement = ( |
|
cookieText, |
|
dismissText, |
|
linkText, |
|
linkHref |
|
) => { |
|
let contentStyle = |
|
"z-index:1060;position:fixed;left:1%;right:1%;bottom:2%;width:98%;background-color:rgba(255,255,255,0.8);" + |
|
"padding:20px;box-shadow:4px 4px 25px #888;text-align:center;"; |
|
|
|
let cookieConsentElement = document.createElement("div"); |
|
cookieConsentElement.id = cookieConsentId; |
|
|
|
let content = document.createElement("div"); |
|
content.style.cssText = contentStyle; |
|
|
|
let dismissLink = _createDismissLink(dismissText); |
|
dismissLink.classList.add("btn", "btn-outline-success"); |
|
|
|
content.appendChild(_createConsentText(cookieText)); |
|
let buttonElement = document.createElement("div"); |
|
content.appendChild(buttonElement); |
|
buttonElement.style.textAlign = "center"; |
|
buttonElement.style.marginTop = "15px"; |
|
|
|
if (!!linkText && !!linkHref) { |
|
let infoLink = _createInformationLink(linkText, linkHref); |
|
infoLink.classList.add("btn", "btn-outline-info"); |
|
buttonElement.appendChild(infoLink); |
|
} |
|
|
|
buttonElement.appendChild(dismissLink); |
|
|
|
cookieConsentElement.appendChild(content); |
|
return cookieConsentElement; |
|
}; |
|
|
|
const _setElementText = (element, text) => { |
|
if (supportsTextContent) { |
|
element.textContent = text; |
|
} else { |
|
element.innerText = text; |
|
} |
|
}; |
|
|
|
const _createConsentText = cookieText => { |
|
let consentText = document.createElement("span"); |
|
_setElementText(consentText, cookieText); |
|
return consentText; |
|
}; |
|
|
|
const _createDismissLink = dismissText => { |
|
let dismissLink = document.createElement("a"); |
|
_setElementText(dismissLink, dismissText); |
|
dismissLink.id = dismissLinkId; |
|
dismissLink.href = "#"; |
|
dismissLink.style.marginLeft = "15px"; |
|
dismissLink.classList.add("btn"); |
|
return dismissLink; |
|
}; |
|
|
|
const _createInformationLink = (linkText, linkHref) => { |
|
let infoLink = document.createElement("a"); |
|
_setElementText(infoLink, linkText); |
|
infoLink.href = linkHref; |
|
infoLink.target = "_blank"; |
|
infoLink.style.marginLeft = "15px"; |
|
infoLink.classList.add("btn"); |
|
return infoLink; |
|
}; |
|
|
|
const _dismissLinkClick = () => { |
|
_saveUserPreference(); |
|
_removeCookieConsent(); |
|
return false; |
|
}; |
|
|
|
const _showCookieConsent = ( |
|
cookieText, |
|
dismissText, |
|
linkText, |
|
linkHref, |
|
isDialog |
|
) => { |
|
if (_shouldDisplayConsent()) { |
|
_removeCookieConsent(); |
|
let consentElement = isDialog |
|
? _createDialogElement(cookieText, dismissText, linkText, linkHref) |
|
: _createHeaderElement(cookieText, dismissText, linkText, linkHref); |
|
let fragment = document.createDocumentFragment(); |
|
fragment.appendChild(consentElement); |
|
document.body.appendChild(fragment.cloneNode(true)); |
|
document.getElementById(dismissLinkId).onclick = _dismissLinkClick; |
|
} |
|
}; |
|
|
|
const showCookieConsentBar = ( |
|
cookieText, |
|
dismissText, |
|
linkText, |
|
linkHref |
|
) => { |
|
_showCookieConsent(cookieText, dismissText, linkText, linkHref, false); |
|
}; |
|
|
|
const showCookieConsentDialog = ( |
|
cookieText, |
|
dismissText, |
|
linkText, |
|
linkHref |
|
) => { |
|
_showCookieConsent(cookieText, dismissText, linkText, linkHref, true); |
|
}; |
|
|
|
const _removeCookieConsent = () => { |
|
let cookieElement = document.getElementById(cookieConsentId); |
|
if (cookieElement != null) { |
|
cookieElement.parentNode.removeChild(cookieElement); |
|
} |
|
}; |
|
|
|
const _saveUserPreference = () => { |
|
// Set the cookie expiry to one year after today. |
|
let expiryDate = new Date(); |
|
expiryDate.setMonth(expiryDate.getMonth() + 1); |
|
document.cookie = |
|
cookieName + "=y; path=/; expires=" + expiryDate.toGMTString(); |
|
}; |
|
|
|
const _shouldDisplayConsent = () => { |
|
// Display the header only if the cookie has not been set. |
|
return !document.cookie.match(new RegExp(cookieName + "=([^;]+)")); |
|
}; |
|
|
|
return showCookieConsentDialog(msg, btn1, btn2, path); |
|
}; |
|
|
|
document.addEventListener("DOMContentLoaded", () => { |
|
let cookieData = document.querySelector("#cookieData"); |
|
let cookie = JSON.parse(cookieData.dataset.cookieData); |
|
myCookie(cookie.msg, cookie.btn1, cookie.btn2, cookie.path); |
|
}); |
|
|
|
export default {}; |