Skip to content

Commit

Permalink
EULAC-254 | Proper hiding CC Bar after accept it.
Browse files Browse the repository at this point in the history
  • Loading branch information
keeteean committed Feb 22, 2024
1 parent e5ded9b commit d127ce5
Show file tree
Hide file tree
Showing 4 changed files with 48 additions and 18 deletions.
36 changes: 28 additions & 8 deletions build/cookieconsent.js
Original file line number Diff line number Diff line change
Expand Up @@ -1333,7 +1333,16 @@ var Interface = /*#__PURE__*/function () {
}, {
key: "buildBar",
value: function buildBar() {
return el('div#cconsent-bar.ccb--hidden', el("div.ccb__wrapper", el('div.ccb__left', el('div.cc-text', Language.getTranslation(window.CookieConsent.config, window.CookieConsent.config.language.current, 'barMainText'))), el('div.ccb__right', el('div.ccb__button', el('button.ccb__edit', Language.getTranslation(window.CookieConsent.config, window.CookieConsent.config.language.current, 'barLinkSetting')), window.CookieConsent.config.showRejectAllButton && el('button.consent-decline', Language.getTranslation(window.CookieConsent.config, window.CookieConsent.config.language.current, 'barBtnRejectAll')), el('button.consent-give', Language.getTranslation(window.CookieConsent.config, window.CookieConsent.config.language.current, 'barBtnAcceptAll'))))), {
return el('div#cconsent-bar.ccb--hidden', el("div.ccb__wrapper", el('div.ccb__left', el('div.cc-text', Language.getTranslation(window.CookieConsent.config, window.CookieConsent.config.language.current, 'barMainText'))), el('div.ccb__right', el('div.ccb__button', el('button.ccb__edit', Language.getTranslation(window.CookieConsent.config, window.CookieConsent.config.language.current, 'barLinkSetting'), {
'aria-hidden': 'true',
tabindex: '-1'
}), window.CookieConsent.config.showRejectAllButton && el('button.consent-decline', Language.getTranslation(window.CookieConsent.config, window.CookieConsent.config.language.current, 'barBtnRejectAll'), {
'aria-hidden': 'true',
tabindex: '-1'
}), el('button.consent-give', Language.getTranslation(window.CookieConsent.config, window.CookieConsent.config.language.current, 'barBtnAcceptAll'), {
'aria-hidden': 'true',
tabindex: '-1'
})))), {
role: 'region',
'aria-label': Language.getTranslation(window.CookieConsent.config, window.CookieConsent.config.language.current, 'cookieBarLabel'),
'aria-hidden': 'true',
Expand Down Expand Up @@ -1494,9 +1503,20 @@ var Interface = /*#__PURE__*/function () {
// Show the bar after a while
if (!window.CookieConsent.config.cookieExists) {
setTimeout(function () {
var _ref, _ref2;

var buttonSettings = bar.querySelector('.ccb__edit');
var buttonConsentGive = bar.querySelector('.consent-give');
var buttonConsentDecline = bar.querySelector('.consent-decline');
bar.classList.remove('ccb--hidden');
bar.setAttribute('aria-hidden', 'false');
bar.setAttribute('tabindex', '0');
buttonSettings.setAttribute('tabindex', '0');
buttonSettings.setAttribute('aria-hidden', 'false');
buttonConsentGive.setAttribute('tabindex', '0');
buttonConsentGive.setAttribute('aria-hidden', 'false');
(_ref = buttonConsentDecline && buttonConsentDecline.length > 0) !== null && _ref !== void 0 ? _ref : buttonConsentDecline.setAttribute('tabindex', '0');
(_ref2 = buttonConsentDecline && buttonConsentDecline.length > 0) !== null && _ref2 !== void 0 ? _ref2 : buttonConsentDecline.setAttribute('aria-hidden', 'false');
}, window.CookieConsent.config.barTimeout);
}
});
Expand All @@ -1522,7 +1542,7 @@ var Interface = /*#__PURE__*/function () {
var _loop = function _loop() {
var button = _step2.value;
button.addEventListener('click', function () {
var _ref3, _ref4;
var _ref5, _ref6;

var buttonSettings = document.querySelector('.ccb__edit');
var buttonConsentDecline = document.querySelector('.consent-decline'); // We set config to full consent
Expand Down Expand Up @@ -1553,8 +1573,8 @@ var Interface = /*#__PURE__*/function () {
button.setAttribute('aria-hidden', 'true');
buttonSettings.setAttribute('tabindex', '-1');
buttonSettings.setAttribute('aria-hidden', 'true');
(_ref3 = buttonConsentDecline.length > 0) !== null && _ref3 !== void 0 ? _ref3 : buttonConsentDecline.setAttribute('tabindex', '-1');
(_ref4 = buttonConsentDecline.length > 0) !== null && _ref4 !== void 0 ? _ref4 : buttonConsentDecline.setAttribute('aria-hidden', 'true');
(_ref5 = buttonConsentDecline && buttonConsentDecline.length > 0) !== null && _ref5 !== void 0 ? _ref5 : buttonConsentDecline.setAttribute('tabindex', '-1');
(_ref6 = buttonConsentDecline && buttonConsentDecline.length > 0) !== null && _ref6 !== void 0 ? _ref6 : buttonConsentDecline.setAttribute('aria-hidden', 'true');
focusTarget.focus();
modalOpen = false;

Expand Down Expand Up @@ -1726,12 +1746,12 @@ var Interface = /*#__PURE__*/function () {
window.CookieConsent.config.categories[switchElement.dataset.category].wanted = switchElement.checked;
});
var buttonSettings = document.querySelector('.ccb__edit');
var buttonConsentDecline = document.querySelector('.consent-decline');
var buttonConsentGive = document.querySelector('.consent-give');
var buttonConsentDecline = document.querySelector('.consent-decline');

_this.buildCookie(function (cookie) {
_this.setCookie(cookie, function () {
var _ref, _ref2;
var _ref3, _ref4;

_this.elements['modal'].classList.remove('ccm--visible');

Expand All @@ -1747,10 +1767,10 @@ var Interface = /*#__PURE__*/function () {

buttonSettings.setAttribute('tabindex', '-1');
buttonSettings.setAttribute('aria-hidden', 'true');
(_ref = buttonConsentDecline.length > 0) !== null && _ref !== void 0 ? _ref : buttonConsentDecline.setAttribute('tabindex', '-1');
(_ref2 = buttonConsentDecline.length > 0) !== null && _ref2 !== void 0 ? _ref2 : buttonConsentDecline.setAttribute('aria-hidden', 'true');
buttonConsentGive.setAttribute('tabindex', '-1');
buttonConsentGive.setAttribute('aria-hidden', 'true');
(_ref3 = buttonConsentDecline && buttonConsentDecline.length > 0) !== null && _ref3 !== void 0 ? _ref3 : buttonConsentDecline.setAttribute('tabindex', '-1');
(_ref4 = buttonConsentDecline && buttonConsentDecline.length > 0) !== null && _ref4 !== void 0 ? _ref4 : buttonConsentDecline.setAttribute('aria-hidden', 'true');
focusTarget.focus();
modalOpen = false;
});
Expand Down
2 changes: 1 addition & 1 deletion build/cookieconsent.min.js

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion docs_src/src/assets/js/cookieconsent.min.js

Large diffs are not rendered by default.

26 changes: 18 additions & 8 deletions src/lib/Interface.js
Original file line number Diff line number Diff line change
Expand Up @@ -85,9 +85,9 @@ export default class Interface {
),
el('div.ccb__right',
el('div.ccb__button',
el('button.ccb__edit', Language.getTranslation(window.CookieConsent.config, window.CookieConsent.config.language.current, 'barLinkSetting')),
window.CookieConsent.config.showRejectAllButton && el('button.consent-decline', Language.getTranslation(window.CookieConsent.config, window.CookieConsent.config.language.current, 'barBtnRejectAll')),
el('button.consent-give', Language.getTranslation(window.CookieConsent.config, window.CookieConsent.config.language.current, 'barBtnAcceptAll'))
el('button.ccb__edit', Language.getTranslation(window.CookieConsent.config, window.CookieConsent.config.language.current, 'barLinkSetting'), { 'aria-hidden': 'true', tabindex: '-1' }),
window.CookieConsent.config.showRejectAllButton && el('button.consent-decline', Language.getTranslation(window.CookieConsent.config, window.CookieConsent.config.language.current, 'barBtnRejectAll'), { 'aria-hidden': 'true', tabindex: '-1' }),
el('button.consent-give', Language.getTranslation(window.CookieConsent.config, window.CookieConsent.config.language.current, 'barBtnAcceptAll'), { 'aria-hidden': 'true', tabindex: '-1' })
)
)
),
Expand Down Expand Up @@ -257,9 +257,19 @@ export default class Interface {
// Show the bar after a while
if ( ! window.CookieConsent.config.cookieExists) {
setTimeout(() => {
var buttonSettings = bar.querySelector('.ccb__edit');
var buttonConsentGive = bar.querySelector('.consent-give');
var buttonConsentDecline = bar.querySelector('.consent-decline');

bar.classList.remove('ccb--hidden');
bar.setAttribute('aria-hidden', 'false');
bar.setAttribute('tabindex', '0');
buttonSettings.setAttribute('tabindex', '0');
buttonSettings.setAttribute('aria-hidden', 'false');
buttonConsentGive.setAttribute('tabindex', '0');
buttonConsentGive.setAttribute('aria-hidden', 'false');
(buttonConsentDecline && buttonConsentDecline.length > 0) ?? buttonConsentDecline.setAttribute('tabindex', '0');
(buttonConsentDecline && buttonConsentDecline.length > 0) ?? buttonConsentDecline.setAttribute('aria-hidden', 'false');
}, window.CookieConsent.config.barTimeout);
}
});
Expand Down Expand Up @@ -306,8 +316,8 @@ export default class Interface {
button.setAttribute('aria-hidden', 'true');
buttonSettings.setAttribute('tabindex', '-1');
buttonSettings.setAttribute('aria-hidden', 'true');
buttonConsentDecline.length > 0 ?? buttonConsentDecline.setAttribute('tabindex', '-1');
buttonConsentDecline.length > 0 ?? buttonConsentDecline.setAttribute('aria-hidden', 'true');
(buttonConsentDecline && buttonConsentDecline.length > 0) ?? buttonConsentDecline.setAttribute('tabindex', '-1');
(buttonConsentDecline && buttonConsentDecline.length > 0) ?? buttonConsentDecline.setAttribute('aria-hidden', 'true');
focusTarget.focus();
modalOpen = false;

Expand Down Expand Up @@ -456,8 +466,8 @@ export default class Interface {
});

var buttonSettings = document.querySelector('.ccb__edit');
var buttonConsentDecline = document.querySelector('.consent-decline');
var buttonConsentGive = document.querySelector('.consent-give');
var buttonConsentDecline = document.querySelector('.consent-decline');

this.buildCookie((cookie) => {
this.setCookie(cookie, () => {
Expand All @@ -469,10 +479,10 @@ export default class Interface {
this.elements['modal'].setAttribute('tabindex', '-1');
buttonSettings.setAttribute('tabindex', '-1');
buttonSettings.setAttribute('aria-hidden', 'true');
buttonConsentDecline.length > 0 ?? buttonConsentDecline.setAttribute('tabindex', '-1');
buttonConsentDecline.length > 0 ?? buttonConsentDecline.setAttribute('aria-hidden', 'true');
buttonConsentGive.setAttribute('tabindex', '-1');
buttonConsentGive.setAttribute('aria-hidden', 'true');
(buttonConsentDecline && buttonConsentDecline.length > 0) ?? buttonConsentDecline.setAttribute('tabindex', '-1');
(buttonConsentDecline && buttonConsentDecline.length > 0) ?? buttonConsentDecline.setAttribute('aria-hidden', 'true');
focusTarget.focus();
modalOpen = false;
});
Expand Down

0 comments on commit d127ce5

Please sign in to comment.