Differences

This shows you the differences between two versions of the page.

--- configuration:cookie_consent [2022/09/07 07:26] – created emaijala
+++ configuration:cookie_consent [2022/09/30 09:26] (current) – [JavaScript Events] emaijala
@@ Line 4: / Line 4: @@
 The cookie consent prompt and settings allow the user to be informed about cookies used by the service and manage consent for non-essential cookies.
+===== Configuration =====
+The configuration for enabling cookie consent is in the Cookies section of config.ini. It contains the settings to turn on cookie consent and select the categories to display and allow toggling in the cookie settings dialog.
+Cookie categories and further configuration is in CookieConsent.yaml. See the comments in the file and the sample configurations below for further information.
+Note that if enabled categories or cookies in the categories are changed, the **consentRevision setting in config.ini must be incremented**. This makes VuFind re-request consent and ensures that invalid categories do not remain in the consent cookie. There is also ''popup_revision_message_html'' translation string that allows you to add a message for those that have previously consented but are now prompted again because of the new revision.
+Default translation texts include a link to the [[configuration:user_privacy#privacy_policy|Privacy Policy]] page that also displays the current cookie consent. Please ensure that the page contains correct information.
+===== Language Translations =====
+Most text strings used in the cookie consent component have translations in the CookieConsent [[development:architecture:localization#text_domains|text domain]].
+===== Information for Developers =====
+==== Checking for Consent ====
+You can check for user's consent in phtml templates:
+<code php>
+<?php if ($this->cookieConsent()->isEnabled():?>
+  <?php if ($this->cookieConsent()->isCategoryAccepted('essential')):?>
+    Essential category is accepted (as it should be)!
+  <?php endif; ?>
+  <?php if ($this->cookieConsent()->isServiceAllowed('matomo')):?>
+    Matomo service is allowed!
+  <?php endif; ?>
+<?php endif; ?>
+</code>
+You can also check consent in JavaScript:
+<code javascript>
+if (VuFind.cookie.isCategoryAccepted('essential')) { ... }
+if (VuFind.cookie.isServiceAllowed('matomo')) { ... }
+</code>
+==== JavaScript Events ====
+The following events are emitted:
+^ Event                       ^ Description                                    ^
+| vf-cookie-consent-first-done   | User has given first consent                   |
+| vf-cookie-consent-done         | User has given consent or the page has been loaded with a stored consent |
+| vf-cookie-consent-changed      | User has changed their consent                 |
+| vf-cookie-consent-initialized  | Cookie consent service has been initialized    |
 ===== Sample Configurations =====
@@ Line 17: / Line 63: @@
 :!: At least expiration times may differ depending on region.
-The following configuration including the IframeServices part allows you to display videos based on user consent. If the user has allowed the cookies for the category, videos are automatically displayed. If not, the user gets a prompt instead. For this to work, the video must be embedded on the page like this (data-id is the identifier of the video in YouTube):
+The following template and configuration allow you to display videos based on user consent. If the user has allowed the cookies for the category, videos are displayed. If not, the user gets a message and a link instead.
-<html>
+Template example:
-<div class="iframemanager" data-service="youtube" data-id="5q70TokaSrw"></div>
+<code php>
-</html>
+<?php $cookieConsent = $this->plugin('cookieConsent'); ?>
+<?php if (!$cookieConsent->isEnabled() || $cookieConsent->isCategoryAccepted('video')): ?>
+  <iframe width="560" height="315" src="https://www.youtube.com/embed/5q70TokaSrw" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
+<?php else: ?>
+  <div class="alert alert-warning">
+    <p>
+      The video cannot be displayed due to missing cookie consent.
+      Check <a href="#" type="button" data-cc="show-preferencesModal" aria-haspopup="dialog">Cookie Settings</a> to make changes.
+    </p>
+    <p>
+      You can also view the video on <a href="https://www.youtube.com/watch?v=5q70TokaSrw" target="_blank">YouTube</a> (external link).
+    </p>
+  </div>
+<?php endif; ?>
+</code>
 CookieConsent.yaml:
@@ Line 32: / Line 92: @@
       DefaultEnabled: false
       Essential: false
-      ControlIframeServices:
-        - youtube
       Cookies:
         - Name: yt-player-bandwidth
@@ Line 70: / Line 128: @@
       AutoClearCookies:
         - Name: '/^(yt-player-.*|GPS|VISITOR_INFO1_LIVE|PREF|__Secure-YEC|YSC|CONSENT|SOCS)$/'
-  IframeServices:
-    youtube:
-      EmbedUrl: 'https://www.youtube.com/embed/{data-id}'
-      #ThumbnailUrl: 'https://i3.ytimg.com/vi/{data-id}/hqdefault.jpg'
-      IframeAllow: accelerometer; encrypted-media; gyroscope; picture-in-picture; fullscreen
-      Description: This content is loaded from https://www.youtube.com. Your consent to store cookies placed by YouTube is required to view the content.
-      AllowOnceText: Show video
-      AllowAlwaysText: Show video and always allow embedded YouTube content
 </code>
 ---- struct data ----
-properties.Page Owner :
+properties.Page Owner : emaijala
 ----