|
| 1 | +{# Cookie banner (C1-compatible behavior) #} |
| 2 | +{% set cookieWarningRaw = chamilo_settings_get('platform.cookie_warning')|default('')|trim|lower %} |
| 3 | +{% set cookieWarningEnabled = (cookieWarningRaw == 'true') %} |
| 4 | +{% set cookieAck = app.request.cookies.get('ChamiloUsesCookies') %} |
| 5 | +{% set youAcceptCookiesText = |
| 6 | + 'By continuing to use this site, you declare you accept its use of cookies.'|trans |
| 7 | +%} |
| 8 | +{% set helpCookieUsageValidationHtml = |
| 9 | + "In order for this site to work and be able to measure the use of content, this platform uses cookies.<br /><br />\nIf needed, the Help section of your browser indicates how to configure cookies.<br /><br />\nFor more information on cookies, you can visit the <a href=\"http://www.aboutcookies.org/\">About Cookies</a> website."|trans |
| 10 | +%} |
| 11 | +{% set noCookiesText = |
| 12 | + 'You do not have cookies support enabled in your browser. Chamilo relies on the feature called "cookies" to store your connection details. This means you will not be able to login if cookies are not enabled. Please change your browser configuration (generally in the Edit -> Preferences menu) and reload this page.'|trans |
| 13 | +%} |
| 14 | +{% if cookieWarningEnabled and cookieAck != 'ok' %} |
| 15 | + <div id="chamilo-cookie-banner" |
| 16 | + class="fixed inset-x-0 bottom-0 z-50 border-t border-warning/30 bg-warning/15 backdrop-blur shadow-lg"> |
| 17 | + <div class="mx-auto max-w-7xl px-4 py-3"> |
| 18 | + <div class="flex flex-col gap-3 md:flex-row md:items-center md:justify-between"> |
| 19 | + <div class="flex items-start gap-3"> |
| 20 | + <span class="mt-0.5 inline-flex h-6 w-6 items-center justify-center rounded-full bg-warning/30 text-xs font-bold text-gray-90" |
| 21 | + aria-hidden="true">!</span> |
| 22 | + |
| 23 | + <div class="text-sm text-gray-90"> |
| 24 | + <div class="leading-snug"> |
| 25 | + {{ youAcceptCookiesText }} |
| 26 | + </div> |
| 27 | + |
| 28 | + <div id="chamilo-cookie-banner-more" |
| 29 | + class="mt-2 hidden text-sm leading-relaxed text-gray-90"> |
| 30 | + {{ helpCookieUsageValidationHtml|raw }} |
| 31 | + </div> |
| 32 | + |
| 33 | + <div id="chamilo-cookie-banner-nocookies" |
| 34 | + class="mt-2 hidden text-sm font-semibold text-danger"> |
| 35 | + {{ noCookiesText }} |
| 36 | + </div> |
| 37 | + </div> |
| 38 | + </div> |
| 39 | + |
| 40 | + <div class="flex items-center gap-2 self-start md:self-auto"> |
| 41 | + <button type="button" |
| 42 | + id="chamilo-cookie-banner-toggle" |
| 43 | + class="inline-flex items-center gap-1 rounded-md border border-warning/40 bg-white px-3 py-1.5 text-xs font-semibold text-gray-90 shadow-sm hover:bg-warning/10 focus:outline-none focus:ring-2 focus:ring-warning/40"> |
| 44 | + <span aria-hidden="true">+</span> |
| 45 | + <span>{{ 'More'|trans }}</span> |
| 46 | + </button> |
| 47 | + |
| 48 | + <button type="button" |
| 49 | + id="chamilo-cookie-banner-accept" |
| 50 | + class="inline-flex items-center gap-1 rounded-md bg-warning px-3 py-1.5 text-xs font-semibold text-warning-button-text shadow-sm hover:bg-warning/90 focus:outline-none focus:ring-2 focus:ring-warning/40"> |
| 51 | + <span>{{ 'Accept'|trans }}</span> |
| 52 | + </button> |
| 53 | + </div> |
| 54 | + </div> |
| 55 | + </div> |
| 56 | + </div> |
| 57 | + |
| 58 | + <script> |
| 59 | + (function () { |
| 60 | + "use strict"; |
| 61 | +
|
| 62 | + const banner = document.getElementById("chamilo-cookie-banner"); |
| 63 | + if (!banner) { |
| 64 | + return; |
| 65 | + } |
| 66 | +
|
| 67 | + const more = document.getElementById("chamilo-cookie-banner-more"); |
| 68 | + const toggle = document.getElementById("chamilo-cookie-banner-toggle"); |
| 69 | + const accept = document.getElementById("chamilo-cookie-banner-accept"); |
| 70 | + const noCookies = document.getElementById("chamilo-cookie-banner-nocookies"); |
| 71 | +
|
| 72 | + // If cookies are disabled, show warning and disable accept action. |
| 73 | + if (typeof navigator !== "undefined" && navigator.cookieEnabled === false) { |
| 74 | + if (noCookies) noCookies.classList.remove("hidden"); |
| 75 | + if (accept) accept.setAttribute("disabled", "disabled"); |
| 76 | + if (accept) accept.classList.add("opacity-50", "cursor-not-allowed"); |
| 77 | + return; |
| 78 | + } |
| 79 | +
|
| 80 | + if (toggle && more) { |
| 81 | + toggle.addEventListener("click", function () { |
| 82 | + more.classList.toggle("hidden"); |
| 83 | + }); |
| 84 | + } |
| 85 | +
|
| 86 | + if (accept) { |
| 87 | + accept.addEventListener("click", function () { |
| 88 | + const maxAge = 60 * 60 * 24 * 365; // 1 year |
| 89 | + let cookie = "ChamiloUsesCookies=ok; Path=/; Max-Age=" + maxAge + "; SameSite=Lax"; |
| 90 | +
|
| 91 | + if (window.location && window.location.protocol === "https:") { |
| 92 | + cookie += "; Secure"; |
| 93 | + } |
| 94 | +
|
| 95 | + document.cookie = cookie; |
| 96 | + banner.remove(); |
| 97 | + }); |
| 98 | + } |
| 99 | + })(); |
| 100 | + </script> |
| 101 | +{% endif %} |
0 commit comments