Skip to content

Instantly share code, notes, and snippets.

@joachimesque
Last active May 19, 2018 12:31
Show Gist options
  • Save joachimesque/cdb7393c7fe1024d9fa3a2c5e5bf8815 to your computer and use it in GitHub Desktop.
Save joachimesque/cdb7393c7fe1024d9fa3a2c5e5bf8815 to your computer and use it in GitHub Desktop.
Script de demande d'autorisation de ciblage (pour conformité RGPD, respecte DNT)
dialog#tracking_authorization_dialog[open] {
position: fixed;
bottom: 0;
left: 0;
right: 0;
width: 100%;
padding: 2em calc((90vw - 990px) / 2);
font-size: .8em;
border: none;
border-top: 1px solid #989898;
box-shadow: -1em 2em 1em 2em rgba(0,0,0,.3);
z-index: 999;
display: flex;
justify-content: space-between;
align-items: center;
}
dialog#tracking_authorization_dialog p {
flex: 1 0;
margin: 0;
padding: 0 1em;
}
dialog#tracking_authorization_dialog menu {
flex: 0 0;
display: flex;
flex-direction: column;
margin: 0;
padding: 0 1em;
}
dialog#tracking_authorization_dialog button {
padding: .3em 1em;
margin: .3em 0;
font-size: .85em;
border: 1px solid currentColor;
cursor: pointer;
}
@media only screen and (max-width: 990px) {
dialog#tracking_authorization_dialog[open] {
top: 50vh;
bottom: 0;
height: 50vh;
flex-direction: column;
box-shadow: none;
}
dialog#tracking_authorization_dialog p {
overflow: scroll;
box-shadow: inset 0 -3em 1em -3em rgba(0,0,0,.5);
padding-bottom: 2em;
}
dialog#tracking_authorization_dialog menu {
margin-top: 1em;
flex-direction: row;
justify-content: space-around;
width: 100%;
}
}
// Defaults
// Number of days for the cookie
days = 365;
dialog_message = "L’administrateur désire collecter certaines informations relatives à votre visite à des fins de statistiques. Aucune donnée ne sera communiquée à des tiers. Pour en savoir plus, vous pouvez consulter notre page dédiée à <a href='/vie-privee'>la vie privée</a>.<br>Si vous ne désirez pas partager ces informations avec nous, veuillez cliquer sur Refuser, un <em>cookie</em> sera ajouté pour ne plus afficher ce message.<br>Si vous enclenchez l’option “Do Not Track” (“Ne pas me cibler”) sur votre navigateur vous n’aurez plus ce message, et nous ne vous ciblerons jamais.";
dialog_button_allow = "Accepter";
dialog_button_disallow = "Refuser";
// Functions
function execute_order_66 () {
// All your tracking things are belong to here
}
// Display dialog
function display_dialog() {
var dialogElement = document.createElement('dialog');
dialogElement.setAttribute('id', 'tracking_authorization_dialog');
dialogElement.innerHTML = '<p>' + dialog_message + '</p>';
var dialog_menu = '<menu><button id="disallow_tracking">';
dialog_menu += dialog_button_disallow;
dialog_menu += '</button><button id="allow_tracking">';
dialog_menu += dialog_button_allow;
dialog_menu += '</button></menu>';
dialogElement.innerHTML += dialog_menu;
document.body.appendChild(dialogElement);
dialogElement.setAttribute('open', 'open');
var allowButton = document.getElementById('allow_tracking');
var disallowButton = document.getElementById('disallow_tracking');
var d = new Date;
d.setTime(d.getTime() + 24*60*60*1000*days);
disallowButton.addEventListener('click', function() {
setCookie('tracking_agreement', 0, d);
dialogElement.removeAttribute('open');
});
allowButton.addEventListener('click', function() {
setCookie('tracking_agreement', 1, d);
execute_order_66();
dialogElement.removeAttribute('open');
});
}
// Helper functions : GetCookie
function getCookie(name) {
var v = document.cookie.match('(^|;)\\s*' + name + '\\s*=\\s*([^;]+)');
return v ? v[2] : null;
}
// Helper functions : SetCookie
function setCookie(name, value, days) {
var d = new Date;
d.setTime(d.getTime() + 24*60*60*1000*days);
document.cookie = name + "=" + value + ";path=/;expires=" + d.toGMTString();
}
function run() {
// Only execute if there’s no Do Not Track enabled.
if(navigator.doNotTrack != 1) {
// If DNT is not enabled
console.log("You did not choose to not be tracked, don’t hesitate to check the “Do Not Track” option in your browser preferences.");
// Check if there’s a cookie
if(!getCookie('tracking_agreement')) {
display_dialog();
} else if (getCookie('tracking_agreement') == 1) {
execute_order_66();
} else {
// Well, they ain’t allowed us to track them, have they?
// Yep.
// So we do nothin’ more.
// Got it!
}
} else {
// If DNT is enabled
console.log("You chose not to be tracked, good for you!");
}
};
// in case the document is already rendered
if (document.readyState!='loading') run();
// modern browsers
else if (document.addEventListener) document.addEventListener('DOMContentLoaded', run);
// IE <= 8
else document.attachEvent('onreadystatechange', function(){
if (document.readyState=='complete') run();
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment