added cookie notification

This commit is contained in:
Ellpeck 2018-12-30 16:38:14 +01:00
parent b92948525b
commit 5602011629
5 changed files with 39 additions and 4 deletions

View file

@ -21,4 +21,12 @@ body {
.footer {
background-color: #404142;
}
.modal-header {
border-bottom: 1px solid #323233;
}
.modal-content {
background-color: #404142;
}

View file

@ -79,6 +79,9 @@
</div>
</div>
<!-- Cookie notification -->
<script src="scripts/cookies.js"></script>
<!-- Projects -->
<a class="anchor" id="projects"></a>
<div class="list-display rounded">

13
scripts/cookies.js Normal file
View file

@ -0,0 +1,13 @@
if (cookieNotification) {
let notif = "";
notif += '<div class="alert alert-danger alert-dismissible fade show" role="alert">';
notif += "This site uses <strong>cookies</strong> for the dark mode toggle. It only tracks if you have the dark mode enabled or not, and if you've dismissed this information before, so there's really not much else to say. Have a nice day!";
notif += '<button type="button" class="close" data-dismiss="alert" id="notif-close">';
notif += '<span>&times;</span>';
notif += '</button></div>';
document.write(notif);
$("#notif-close").on("click", function () {
setCookie("notification", "true", 365);
});
}

View file

@ -1,11 +1,13 @@
let dark = getCookie("dark") === "true";
let cookieNotification = getCookie("notification") !== "true";
if (dark) {
document.write('<link rel="stylesheet" href="dark.css">')
}
$(function () {
let openModals = function (hash) {
if (hash.length > 1) {
if (hash && hash.length > 1) {
if (hash === '#impressum') {
$('#impressum-modal').modal('show');
}
@ -27,9 +29,8 @@ $(function () {
let mode = $('#dark-mode');
mode.prop('checked', dark);
mode.on('click', function () {
var date = new Date();
date.setTime(date.getTime() + (365 * 24 * 60 * 60 * 1000));
document.cookie = "dark=" + $(this).prop('checked') + ";expires=" + date.toUTCString();
setCookie("dark", $(this).prop('checked'), 365);
window.location.hash = "";
location.reload();
});
});
@ -41,4 +42,10 @@ function getCookie(key) {
let start = c.indexOf(key + "=") + key.length + 1;
let end = c.indexOf(";", start);
return c.substring(start, end < 0 ? c.length : end);
}
function setCookie(key, value, days) {
var date = new Date();
date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
document.cookie = key + "=" + value + "; expires=" + date.toUTCString();
}

View file

@ -118,6 +118,10 @@ body {
margin-bottom: 10px;
}
.alert {
margin-top: 1rem;
}
@media (min-width: 1200px) {
.navbar {
width: 1200px;