Merge pull request #4 from punkave/hotfix/defaults

Hotfix/defaults

lib/modules/pk-cookie-alert-global/index.js

@@ -33,7 +33,8 @@ module.exports = {
             value: 'top',
             label: 'Top'
           }
-        ]
+        ],
+        def: 'bottom'
       }
     ];
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "pk-cookie-alert",
-  "version": "1.1.0",
+  "version": "1.1.1",
   "description": "A module that provides a persistent alert for users to acknowledge the use of cookies.",
   "main": "index.js",
   "scripts": {

src/js/site.js

@@ -3,19 +3,28 @@ import { helpers, classes } from 'pk-utilities';
 function init () {
   const alert = '[data-component="pk-alert"]';
   const confirm = '[data-role="dismiss-pk-alert"]';
-  const cookiename = document.querySelector(alert).dataset.name;
+  let cookiename = 'pk-alert';
+  if (document.querySelector(alert)) {
+    cookiename = document.querySelector(alert).dataset.name;
+  }
   const confirmed = hasCookie(document.cookie, cookiename);
   let i;
-  if (!confirmed) {
-    for (i = 0; i < document.querySelectorAll(alert).length; ++i) {
-      helpers.addClass(document.querySelectorAll(alert)[i], classes.active);
+  for (i = 0; i < document.querySelectorAll(alert).length; ++i) {
+    const scopedAlert = document.querySelectorAll(alert)[i];
+    if (!confirmed) {
+      scopedAlert.setAttribute('aria-hidden', 'false');
+      helpers.addClass(scopedAlert, classes.active);
+    } else {
+      scopedAlert.setAttribute('aria-hidden', 'true');
+      helpers.removeClass(scopedAlert, classes.active);
     }
   }
   for (i = 0; i < document.querySelectorAll(confirm).length; ++i) {
     const button = document.querySelectorAll(confirm)[i];
     const scopedAlert = helpers.closest(button, alert);
     button.addEventListener('click', function () {
       createCookie(cookiename, true);
+      scopedAlert.setAttribute('aria-hidden', 'true');
       helpers.removeClass(scopedAlert, classes.active);
     });
   }

views/alert.html

@@ -1,16 +1,14 @@
 {% if not data.global.pkAlertDisable %}
-  <div class="{{ data.options.baseClass }} {{ data.options.baseClass }}--{{ data.global.pkAlertAlignment }}" role="alert" data-component="pk-alert" aria-hidden="true" data-name="{{ data.options.cookieName }}">
-    <div class="{{ data.options.baseClass }}__inner">
-      {% if data.global.pkAlertText %}
+  {% if data.global.pkAlertText and data.global.pkAlertButton %}
+    <div class="{{ data.options.baseClass }} {{ data.options.baseClass }}--{{ data.global.pkAlertAlignment }}" role="alert" data-component="pk-alert" aria-hidden="true" data-name="{{ data.options.cookieName }}">
+      <div class="{{ data.options.baseClass }}__inner">
         <div class="{{ data.options.baseClass }}__text">
           {{ apos.areas.richText(data.global.pkAlertText) }}
         </div>
-      {% endif %}
-      {% if data.global.pkAlertButton %}
         <button type="button" class="{{ data.options.baseClass }}__button" data-role="dismiss-pk-alert">
           {{ data.global.pkAlertButton }}
         </button>
-      {% endif %}
+      </div>
     </div>
-  </div>
+  {% endif %}
 {% endif %}