{% from "govuk_frontend_jinja/components/table/macro.html" import govukTable %}
{% from "govuk_frontend_jinja/components/radios/macro.html" import govukRadios %}
{% from "govuk_frontend_jinja/components/button/macro.html" import govukButton %}
{% from "govuk_frontend_jinja/components/notification-banner/macro.html" import govukNotificationBanner %}


{% set cookie_success_html %}
  <p class="govuk-notification-banner__heading">You’ve set your cookie preferences.</p>
{% endset %}
{% extends "access_grant_funding/base.html" %}

{% set page_title = "Cookies on Access grant funding" %}

{% block content %}
  <div id="cookie_success_banner" hidden>
    {{
      govukNotificationBanner({
        "type": "success",
        "html": cookie_success_html,
        "id":"cookie_prefs_saved_banner",
      })
    }}
  </div>
  <div class="govuk-grid-row">
    <div class="govuk-grid-column-two-thirds">
      <h1 class="govuk-heading-l">{{ page_title }}</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 Access grant funding service work.</p>
      <h2 class="govuk-heading-m">Essential cookies</h2>
      <p class="govuk-body">Essential cookies keep your information secure while you use Access grant funding. We do not need to ask permission to use them.</p>
      {{
        govukTable({
          "firstCellIsHeader": false,
          "head": [
            {
              "text": "Name"
            },
            {
              "text": "Purpose"
            },
            {
              "text": "Expires"
            }
          ],
          "rows": [
            [
              {
                "text": "session"
              },
              {
                "text": "Used to keep you signed in"
              },
              {
                "text": "Session"
              }
            ]

          ]
        })
      }}
    </div>
  </div>
  <div class="govuk-grid-row">
    <div class="govuk-grid-column-two-thirds">
      <h2 class="govuk-heading-m">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 Access grant funding</li>
        <li>the pages you visit on Access grant funding and how long you spend on them</li>
        <li>any errors you see while using Access grant funding</li>
      </ul>
      {{
        govukTable({
          "firstCellIsHeader": false,
          "head": [
            {
              "text": "Name"
            },
            {
              "text": "Purpose"
            },
            {
              "text": "Expires"
            }
          ],
          "rows": [
            [
              {
                "text": "_ga"
              },
              {
                "text": "Checks if you have visited Access grant funding before. This helps us count how many people visit our site."
              },
              {
                "text": "2 years"
              }
            ],
            [
              {
                "text": "ga_02D9CERFL4"
              },
              {
                "text": "Checks if you have visited Access grant funding before. This helps us to count how many people visit our site and persist a session state."
              },
              {
                "text": "2 years"
              }
            ]

          ]
        })
      }}
    </div>
  </div>
  <div class="govuk-grid-row" id="cookies_no_js">
    <div class="govuk-grid-column-two-thirds">
      <h2 class="govuk-heading-l">Change your cookie settings</h2>
      <p class="govuk-body">We cannot change your cookie settings at the moment because JavaScript is not running in your browser. To fix this, try:</p>
      <ul class="govuk-list govuk-list--bullet">
        <li>turning on JavaScript in your browser settings</li>
        <li>reloading this page</li>
      </ul>
    </div>
  </div>
  <div class="govuk-grid-row" id="cookies_form" hidden>
    <div class="govuk-grid-column-two-thirds">
      <h2 class="govuk-heading-l">Change your cookie settings</h2>

      {{
        govukRadios({
          "name": "cookies[analytics]",
          "idPrefix": "cookies-analytics",
          "fieldset": {
            "legend": {
              "text": "Do you want to accept analytics cookies?",
              "classes": "govuk-fieldset__legend--s"
            }
          },
          "items": [
            {
              "value": "yes",
              "text": "Yes",
              "id":"cookie_choice_yes"
            },
            {
              "value": "no",
              "text": "No",
              "id":"cookie_choice_no"
            }
          ]
        })
      }}

      {{
        govukButton({
          "text": "Save cookie settings",
          "id":"btn_submit_cookies_form"
        })
      }}
    </div>
  </div>
{% endblock %}