generated from communitiesuk/funding-service-design-TEMPLATE
-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #646 from communitiesuk/FS-3873-cookies-Policy-Pag…
…eAndBanner FS-3873: Cookies page and banner on assessment
- Loading branch information
Showing
13 changed files
with
402 additions
and
90 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,54 @@ | ||
|
|
||
| const DEFAULT_CONSENT = {'ad_storage': 'denied', 'analytics_storage': 'denied', 'personalisation_storage': 'denied', | ||
| 'functionality_storage': 'denied', 'security_storage': 'denied',} | ||
| const COOKIE_FSD_CONSENT = "fsd_cookie_consent"; | ||
|
|
||
| function readConsentCookie() { | ||
| const cookie = document.cookie.split(";").find(c => c.trim().startsWith(`${COOKIE_FSD_CONSENT}=`)); | ||
| return cookie ? JSON.parse(atob(cookie.split("=")[1])) : null; | ||
| } | ||
|
|
||
| function updateCookieConsent(value) { | ||
| const consentObject = { 'analytics_storage': value }; | ||
| const currentDomain = window.location.hostname; | ||
| const slice = currentDomain.includes("access-funding") ? -4 : -3; | ||
| const targetDomain = currentDomain.split('.').slice(slice).join('.'); | ||
| document.cookie = `${COOKIE_FSD_CONSENT}=${btoa(JSON.stringify(consentObject))};path=` + "/" + `;domain=${targetDomain};secure;SameSite=None`; | ||
|
|
||
| const notificationBanner = document.getElementById("cookie-setting-saved-banner") | ||
| if (notificationBanner) { | ||
| notificationBanner.removeAttribute("hidden"); | ||
| notificationBanner.scrollIntoView(); | ||
| } | ||
|
|
||
| } | ||
| function acceptCookies() { | ||
| updateCookieConsent('granted'); | ||
| document.getElementById("cookies-choice-msg").setAttribute("hidden", "true"); | ||
| document.getElementById("cookies-accepted-msg").removeAttribute("hidden"); | ||
| } | ||
|
|
||
| function denyCookies() { | ||
| updateCookieConsent('denied'); | ||
| document.getElementById("cookies-choice-msg").setAttribute("hidden", "true"); | ||
| document.getElementById("cookies-rejected-msg").removeAttribute("hidden"); | ||
| } | ||
|
|
||
| function hideCookiesMessage() { | ||
| document.getElementById("cookie-banner").setAttribute("hidden", "true"); | ||
| } | ||
|
|
||
| function unhideCookiesMessage() { | ||
| document.getElementById("cookie-banner").removeAttribute("hidden"); | ||
| } | ||
|
|
||
|
|
||
| function saveAnalyticsPrefs(){ | ||
| if (document.getElementById("cookies-analytics").checked) { | ||
| updateCookieConsent('granted'); | ||
| hideCookiesMessage(); | ||
| } else { | ||
| updateCookieConsent('denied'); | ||
| hideCookiesMessage(); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,167 @@ | ||
| {% extends "base.html" %} | ||
|
|
||
| {%- from 'govuk_frontend_jinja/components/inset-text/macro.html' import govukInsetText -%} | ||
| {% from "macros/migration_banner.html" import migration_banner %} | ||
| {%- from "govuk_frontend_jinja/components/radios/macro.html" import govukRadios %} | ||
| {% set pageHeading %}Cookies{% endset %} | ||
| {% block content %} | ||
|
|
||
| <div class="govuk-main-wrapper-cookies-page"> | ||
| <div class="govuk-grid-column-two-thirds"> | ||
| {% if migration_banner_enabled %} | ||
| {{ migration_banner() }} | ||
| {% endif %} | ||
|
|
||
| <div id="cookie-setting-saved-banner" class="govuk-notification-banner govuk-notification-banner--success js-cookies-page-success" role="alert" aria-labelledby="govuk-notification-banner-title" data-module="govuk-notification-banner" hidden> | ||
| <div class="govuk-notification-banner__header"> | ||
| <h2 class="govuk-notification-banner__title" id="govuk-notification-banner-title"> | ||
| Success | ||
| </h2> | ||
| </div> | ||
| <div class="govuk-notification-banner__content"> | ||
| <p class="govuk-notification-banner__heading">Your cookie settings were saved</p> | ||
| </div> | ||
| </div> | ||
|
|
||
| <h1 class="govuk-heading-l">{{ pageHeading }}</h1> | ||
| <p class="govuk-body"> | ||
| Cookies are small files saved on your phone, tablet or computer when you visit a website. | ||
| </p> | ||
| <p class="govuk-body">We use cookies to make the {{ service_title }} service work.</p> | ||
|
|
||
| <h2 class="govuk-heading-m" id="essential-cookies">Essential cookies</h2> | ||
| <p class="govuk-body">Essential cookies keep your information secure while you use the {{ service_title }} service. We do not need to ask permission to use them.</p> | ||
| <table class="govuk-table"> | ||
| <caption class="govuk-visually-hidden">Essential cookies</caption> | ||
| <thead class="govuk-table__head"> | ||
| <tr> | ||
| <th class="govuk-table__header">Name</th> | ||
| <th class="govuk-table__header">Purpose</th> | ||
| <th class="govuk-table__header">Expires</th> | ||
| </tr> | ||
| </thead> | ||
| <tbody class="govuk-table__body"> | ||
| <tr class="govuk-table__row"> | ||
| <td class="govuk-table__cell"> | ||
| session_cookie | ||
| </td> | ||
| <td width="50%" class="govuk-table__cell"> | ||
| Used to keep you connected to your current session | ||
| </td> | ||
| <td class="govuk-table__cell"> | ||
| When you close your browser | ||
| </td> | ||
| </tr> | ||
| <tr class="govuk-table__row"> | ||
| <td class="govuk-table__cell"> | ||
| fsd_user_token | ||
| </td> | ||
| <td width="50%" class="govuk-table__cell"> | ||
| Used to keep you signed in | ||
| </td> | ||
| <td class="govuk-table__cell"> | ||
| 24 hours | ||
| </td> | ||
| </tr> | ||
| <tr class="govuk-table__row"> | ||
| <td class="govuk-table__cell"> | ||
| session | ||
| </td> | ||
| <td width="50%" class="govuk-table__cell"> | ||
| Set to remember information you’ve entered into a form | ||
| </td> | ||
| <td class="govuk-table__cell"> | ||
| When you close your browser | ||
| </td> | ||
| </tr> | ||
| </tbody> | ||
| </table> | ||
|
|
||
| <h2 class="govuk-heading-m" id="essential-cookies">Analytics cookies (optional)</h2> | ||
| <p class="govuk-body">With your permission, we use Google Analytics to collect data about how you use this service. This information helps us to improve our service.</p> | ||
| <p class="govuk-body">Google is not allowed to use or share our analytics data with anyone.</p> | ||
| <p class="govuk-body">Google Analytics stores anonymised information about:</p> | ||
| <ul class="govuk-list govuk-list--bullet"> | ||
| <li>how you got to {{ service_title }}</li> | ||
| <li>the pages you visit on {{ service_title }} and how long you spend on them</li> | ||
| <li>any errors you see while using {{ service_title }}</li> | ||
| </ul> | ||
| <table class="govuk-table"> | ||
| <caption class="govuk-visually-hidden">Analytics cookies (optional)</caption> | ||
| <thead class="govuk-table__head"> | ||
| <tr> | ||
| <th class="govuk-table__header">Name</th> | ||
| <th class="govuk-table__header">Purpose</th> | ||
| <th class="govuk-table__header">Expires</th> | ||
| </tr> | ||
| </thead> | ||
| <tbody class="govuk-table__body"> | ||
| <tr class="govuk-table__row"> | ||
| <td class="govuk-table__cell"> | ||
| _ga | ||
| </td> | ||
| <td class="govuk-table__cell"> | ||
| Checks if you have visited {{ service_title }} before. This helps us count how many people visit our site. | ||
| </td> | ||
| <td class="govuk-table__cell"> | ||
| 2 years | ||
| </td> | ||
| </tr> | ||
| <tr class="govuk-table__row"> | ||
| <td class="govuk-table__cell"> | ||
| _ga_GTM-M5J9Q8HV | ||
| </td> | ||
| <td class="govuk-table__cell"> | ||
| Checks if you have visited {{ service_title }} before. This helps us to count how many people visit our site and persist a session state. | ||
| </td> | ||
| <td class="govuk-table__cell"> | ||
| 2 years | ||
| </td> | ||
| </tr> | ||
| </tbody> | ||
| </table> | ||
| <div class="govuk-body" id="cookie-settings"> | ||
| {{ govukRadios({ | ||
| "id": "cookies-analytics", | ||
| "name": "cookies-analytics", | ||
| "fieldset": { | ||
| "legend": { | ||
| "text": "Do you want to accept analytics cookies?", | ||
| "isPageHeading": false, | ||
| "classes": "govuk-fieldset__legend--s" | ||
| } | ||
| }, | ||
| "items": [ | ||
| {"value":"granted", "text":"Yes"},{"value": "denied", "text":"No"} | ||
| ]}) | ||
| }} | ||
| <button class="govuk-button" data-module="govuk-button" id="cookie-settings-save"> | ||
| Save cookie settings | ||
| </button> | ||
| </div> | ||
|
|
||
| </div> | ||
| </div> | ||
| <script nonce="{{ csp_nonce() }}" type="text/javascript" src="{{ url_for('static', filename='js/fsd_cookies.js') }}"></script> | ||
| <script nonce="{{ csp_nonce() }}"> | ||
|
|
||
| window.dataLayer = window.dataLayer || []; | ||
| function gtag() { dataLayer.push(arguments) } | ||
|
|
||
| function initCookieRadios(){ | ||
| localConsentMode = readConsentCookie(); | ||
| if (localConsentMode != null){ | ||
| if (localConsentMode.analytics_storage == 'granted'){ | ||
| document.getElementById("cookies-analytics").checked = true; | ||
| } else { | ||
| document.getElementById("cookies-analytics-2").checked = true; | ||
| } | ||
| } | ||
| document.getElementById("cookie-settings-save").addEventListener("click", saveAnalyticsPrefs); | ||
|
|
||
|
|
||
| } | ||
|
|
||
| initCookieRadios(); | ||
| </script> | ||
| {% endblock content %} |
Oops, something went wrong.