Commit 60a09b64 authored by Sven Berg Ryen's avatar Sven Berg Ryen
Browse files

Issue #3298345 by svenryen, Glugmeister: Withdraw banner links/buttons are... 

Issue #3298345 by svenryen, Glugmeister: Withdraw banner links/buttons are keyboard focusable when banner is hidden from view
parent a8b3ca26

js/eu_cookie_compliance.js

+30 −13
Changes for js/eu_cookie_compliance.js: 30 added lines, 13 removed lines.
Original line number Diff line number Diff line
@@ -241,7 +241,6 @@ 
    $html.addClass('eu-cookie-withdraw-wrapper');



    $html.trigger('eu_cookie_compliance_popup_close');

    $('body').removeClass('eu-cookie-compliance-popup-open');



    if (!drupalSettings.eu_cookie_compliance.popup_use_bare_css && !drupalSettings.eu_cookie_compliance.popup_use_olivero_css) {

      $banner.height(drupalSettings.eu_cookie_compliance.popup_height)
@@ -287,6 +286,8 @@ 
        $html.animate({ bottom: -1 * (height) }, drupalSettings.eu_cookie_compliance.popup_delay, null);

      }.bind($html), 0);

    }

    $('body').removeClass('eu-cookie-compliance-popup-open');

    $('.eu-cookie-withdraw-button').attr('tabindex', -1);

  };



  Drupal.eu_cookie_compliance.getBannerTopPosition = function (height) {
@@ -358,7 +359,6 @@ 
          $('body').animate({ 'margin-top': -height + 'px' }, drupalSettings.eu_cookie_compliance.popup_delay);

        }

        $wrapper.animate({ top: Drupal.eu_cookie_compliance.getBannerTopHiddenPosition(height) }, drupalSettings.eu_cookie_compliance.popup_delay).trigger('eu_cookie_compliance_popup_close');

        $('body').removeClass('eu-cookie-compliance-popup-open');

      }

      else {

        // If "Do not show cookie policy when the user clicks the Cookie policy button." is
@@ -368,22 +368,27 @@ 
        }

        $wrapper.find('.eu-cookie-compliance-banner').show();

        $wrapper.animate({ top: Drupal.eu_cookie_compliance.getBannerTopPosition(height) }, drupalSettings.eu_cookie_compliance.popup_delay).trigger('eu_cookie_compliance_popup_open');

        $('body').addClass('eu-cookie-compliance-popup-open');

      }

    }

    else {

      if (bannerIsShowing) {

        $wrapper.animate({ 'bottom': -1 * (height) }, drupalSettings.eu_cookie_compliance.popup_delay).trigger('eu_cookie_compliance_popup_close');

        $('body').removeClass('eu-cookie-compliance-popup-open');

      }

      else {

        // If "Do not show cookie policy when the user clicks the Cookie policy button." is

        // selected, the inner banner may be hidden.

        $wrapper.find('.eu-cookie-compliance-banner').show();

        $wrapper.animate({ 'bottom': 0 }, drupalSettings.eu_cookie_compliance.popup_delay).trigger('eu_cookie_compliance_popup_open');

        $('body').addClass('eu-cookie-compliance-popup-open');

      }

    }

    if (bannerIsShowing) {

      $('body').removeClass('eu-cookie-compliance-popup-open');

      $('.eu-cookie-compliance-agree-button, .eu-cookie-compliance-more-button, .eu-cookie-compliance-secondary-button, .eu-cookie-compliance-save-preferences-button, .eu-cookie-compliance-category-checkbox, .eu-cookie-compliance-default-button, .eu-cookie-withdraw-button, .eu-cookie-withdraw-button').attr('tabindex', -1);

    }

    else {

      $('body').addClass('eu-cookie-compliance-popup-open');

      $('.eu-cookie-compliance-agree-button, .eu-cookie-compliance-more-button, .eu-cookie-compliance-secondary-button, .eu-cookie-compliance-save-preferences-button, .eu-cookie-compliance-category-checkbox, .eu-cookie-compliance-default-button, .eu-cookie-withdraw-button, .eu-cookie-withdraw-button').attr('tabindex', 0);

    }

  };



  Drupal.eu_cookie_compliance.resizeListener = function () {
@@ -461,7 +466,6 @@ 
        .css({ top: Drupal.eu_cookie_compliance.getBannerTopHiddenPosition(height) });



      if (closed !== true) {

        $('body').addClass('eu-cookie-compliance-popup-open');

        popup.show();

        popup.animate({top: Drupal.eu_cookie_compliance.getBannerTopPosition(height)}, drupalSettings.eu_cookie_compliance.popup_delay, null, function () {

          popup.trigger('eu_cookie_compliance_popup_open');
@@ -492,12 +496,19 @@ 
        .css({bottom: -1 * height});



      if (closed !== true) {

        $('body').addClass('eu-cookie-compliance-popup-open');

        popup.animate({bottom: 0}, drupalSettings.eu_cookie_compliance.popup_delay, null, function () {

          popup.trigger('eu_cookie_compliance_popup_open');

        });

      }

    }

    if (closed !== true) {

      $('body').addClass('eu-cookie-compliance-popup-open');

      $('.eu-cookie-compliance-agree-button, .eu-cookie-compliance-more-button, .eu-cookie-compliance-secondary-button, .eu-cookie-compliance-save-preferences-button, .eu-cookie-compliance-category-checkbox, .eu-cookie-compliance-default-button, .eu-cookie-withdraw-button').attr('tabindex', 0);

    }

    else {

      $('body').removeClass('eu-cookie-compliance-popup-open');

      $('.eu-cookie-compliance-agree-button, .eu-cookie-compliance-more-button, .eu-cookie-compliance-secondary-button, .eu-cookie-compliance-save-preferences-button, .eu-cookie-compliance-category-checkbox, .eu-cookie-compliance-default-button, .eu-cookie-withdraw-button').attr('tabindex', -1);

    }

  };



  Drupal.eu_cookie_compliance.attachAgreeEvents = function () {
@@ -663,7 +674,6 @@ 
        popup.animate({top: Drupal.eu_cookie_compliance.getBannerTopHiddenPosition(height)}, drupalSettings.eu_cookie_compliance.popup_delay, null, function () {

          popup.hide();

        }).trigger('eu_cookie_compliance_popup_close');

        $('body').removeClass('eu-cookie-compliance-popup-open');

      }

    }

    else {
@@ -675,9 +685,16 @@ 
        popup.animate({ bottom: popup.outerHeight() * -1 }, drupalSettings.eu_cookie_compliance.popup_delay, null, function () {

          popup.hide();

        }).trigger('eu_cookie_compliance_popup_close');

        $('body').removeClass('eu-cookie-compliance-popup-open');

      }

    }

    if (drupalSettings.eu_cookie_compliance.settings_tab_enabled) {

      $('body').addClass('eu-cookie-compliance-popup-open');

      $('.eu-cookie-compliance-agree-button, .eu-cookie-compliance-more-button, .eu-cookie-compliance-secondary-button, .eu-cookie-compliance-save-preferences-button, .eu-cookie-compliance-category-checkbox, .eu-cookie-compliance-default-button, .eu-cookie-withdraw-button').attr('tabindex', 0);

    }

    else {

      $('body').removeClass('eu-cookie-compliance-popup-open');

      $('.eu-cookie-compliance-agree-button, .eu-cookie-compliance-more-button, .eu-cookie-compliance-secondary-button, .eu-cookie-compliance-save-preferences-button, .eu-cookie-compliance-category-checkbox, .eu-cookie-compliance-default-button, .eu-cookie-withdraw-button').attr('tabindex', -1);

    }

  };



  Drupal.eu_cookie_compliance.withdrawAction = function () {
@@ -695,12 +712,12 @@ 
      Drupal.eu_cookie_compliance.setStatus(cookieValueDisagreed);

      if (drupalSettings.eu_cookie_compliance.withdraw_enabled && drupalSettings.eu_cookie_compliance.withdraw_button_on_info_popup) {

        $('#sliding-popup .eu-cookie-compliance-banner').trigger('eu_cookie_compliance_popup_close').hide();

        $('body').removeClass('eu-cookie-compliance-popup-open');

      }

      else {

        $('#sliding-popup').trigger('eu_cookie_compliance_popup_close').remove();

        $('body').removeClass('eu-cookie-compliance-popup-open');

      }

      $('body').removeClass('eu-cookie-compliance-popup-open');

      $('.eu-cookie-compliance-agree-button, .eu-cookie-compliance-more-button, .eu-cookie-compliance-secondary-button, .eu-cookie-compliance-save-preferences-button, .eu-cookie-compliance-category-checkbox, .eu-cookie-compliance-default-button, .eu-cookie-withdraw-button').attr('tabindex', -1);

    }

    else {

      if (drupalSettings.eu_cookie_compliance.popup_link_new_window) {
@@ -822,7 +839,6 @@ 
            }

            $('.sliding-popup-top').css('top', Drupal.eu_cookie_compliance.getBannerTopHiddenPosition(height));

            $('.sliding-popup-top').not('.eu-cookie-withdraw-wrapper').trigger('eu_cookie_compliance_popup_close');

            $('body').removeClass('eu-cookie-compliance-popup-open');

            Drupal.eu_cookie_compliance.initPopup();

            Drupal.eu_cookie_compliance.resizeListener();

            $('#sliding-popup').show();
@@ -832,6 +848,7 @@ 
            $('body').css({ 'margin-top': '0px' });

          }

          $('body').removeClass('eu-cookie-compliance-popup-open');

          $('.eu-cookie-compliance-agree-button, .eu-cookie-compliance-more-button, .eu-cookie-compliance-secondary-button, .eu-cookie-compliance-save-preferences-button, .eu-cookie-compliance-category-checkbox, .eu-cookie-compliance-default-button, .eu-cookie-withdraw-button').attr('tabindex', -1);

        }

        if (drupalSettings.eu_cookie_compliance.withdraw_enabled && !drupalSettings.eu_cookie_compliance.withdraw_button_on_info_popup) {

          Drupal.eu_cookie_compliance.showWithdrawBanner(value);
@@ -856,7 +873,6 @@ 
            }

            $('.sliding-popup-bottom').css('bottom', Drupal.eu_cookie_compliance.getBannerBottomHiddenPosition());

            $('.sliding-popup-bottom').not('.eu-cookie-withdraw-wrapper').trigger('eu_cookie_compliance_popup_close');

            $('body').removeClass('eu-cookie-compliance-popup-open');

            Drupal.eu_cookie_compliance.initPopup();

            Drupal.eu_cookie_compliance.resizeListener();

            $('#sliding-popup').css('display', 'block');
@@ -865,6 +881,7 @@ 
            $('.sliding-popup-bottom').not('.eu-cookie-withdraw-wrapper').trigger('eu_cookie_compliance_popup_close').remove();

          }

          $('body').removeClass('eu-cookie-compliance-popup-open');

          $('.eu-cookie-compliance-agree-button, .eu-cookie-compliance-more-button, .eu-cookie-compliance-secondary-button, .eu-cookie-compliance-save-preferences-button, .eu-cookie-compliance-category-checkbox, .eu-cookie-compliance-default-button, .eu-cookie-withdraw-button').attr('tabindex', -1);

        }

        if (drupalSettings.eu_cookie_compliance.withdraw_enabled && !drupalSettings.eu_cookie_compliance.withdraw_button_on_info_popup) {

          Drupal.eu_cookie_compliance.showWithdrawBanner(value);

templates/eu_cookie_compliance_popup_info.html.twig

+1 −1
Changes for templates/eu_cookie_compliance_popup_info.html.twig: 1 added line, 1 removed line.
Original line number Diff line number Diff line
@@ -60,7 +60,7 @@ 
        {% for key, category in cookie_categories %}

          <div class="eu-cookie-compliance-category">

            <div>

              <input type="checkbox" name="cookie-categories" id="cookie-category-{{ key }}"

              <input type="checkbox" name="cookie-categories" class="eu-cookie-compliance-category-checkbox" id="cookie-category-{{ key }}"

                     value="{{ key }}"

                     {% if category.checkbox_default_state in ['checked', 'required'] %} checked {% endif %}

                     {% if category.checkbox_default_state == 'required' %} disabled {% endif %} >