Unverified Commit a474384b authored by Lauri Timmanee's avatar Lauri Timmanee
Browse files

Issue #3255131 by andy-blum, finnsky, mherchel, nod_: Olivero: Refactor JS to... 

Issue #3255131 by andy-blum, finnsky, mherchel, nod_: Olivero: Refactor JS to make use of second argument within Element.classList.toggle()
parent e129a5b9

core/themes/olivero/js/navigation-utils.js

+4 −11
Original line number Diff line number Diff line
@@ -79,12 +79,7 @@ 
   */

  function toggleStickyHeaderState(pinnedState) {

    if (isDesktopNav()) {

      if (pinnedState === true) {

        siteHeaderFixable.classList.add('is-expanded');

      } else {

        siteHeaderFixable.classList.remove('is-expanded');

      }



      siteHeaderFixable.classList.toggle('is-expanded', pinnedState);

      stickyHeaderToggleButton.setAttribute('aria-checked', pinnedState);

      setStickyHeaderStorage(pinnedState);

    }
@@ -133,11 +128,9 @@ 
      entries.forEach((entry) => {

        // Firefox doesn't seem to support entry.isIntersecting properly,

        // so we check the intersectionRatio.

        if (entry.intersectionRatio < 1) {

          fixableElements.forEach((el) => el.classList.add('is-fixed'));

        } else {

          fixableElements.forEach((el) => el.classList.remove('is-fixed'));

        }

        fixableElements.forEach((el) =>

          el.classList.toggle('is-fixed', entry.intersectionRatio < 1),

        );

      });

    }

core/themes/olivero/js/navigation.js

+3 −10
Original line number Diff line number Diff line
@@ -28,16 +28,9 @@ 
  function toggleNav(props, state) {

    const value = !!state;

    props.navButton.setAttribute('aria-expanded', value);



    if (value) {

      props.body.classList.add('is-overlay-active');

      props.body.classList.add('is-fixed');

      props.navWrapper.classList.add('is-active');

    } else {

      props.body.classList.remove('is-overlay-active');

      props.body.classList.remove('is-fixed');

      props.navWrapper.classList.remove('is-active');

    }

    props.body.classList.toggle('is-overlay-active', value);

    props.body.classList.toggle('is-fixed', value);

    props.navWrapper.classList.toggle('is-active', value);

  }



  /**

core/themes/olivero/js/search.js

+1 −3
Original line number Diff line number Diff line
@@ -99,13 +99,13 @@ 
   */

  function toggleSearchVisibility(visibility) {

    searchWideButton.setAttribute('aria-expanded', visibility === true);

    searchWideWrapper.classList.toggle('is-active', visibility === true);

    searchWideWrapper.addEventListener('transitionend', handleFocus, {

      once: true,

    });



    if (visibility === true) {

      Drupal.olivero.closeAllSubNav();

      searchWideWrapper.classList.add('is-active');



      document.addEventListener('click', watchForClickOut, { capture: true });

      document.addEventListener('focusout', watchForFocusOut, {
@@ -113,8 +113,6 @@ 
      });

      document.addEventListener('keyup', watchForEscapeOut, { capture: true });

    } else {

      searchWideWrapper.classList.remove('is-active');



      document.removeEventListener('click', watchForClickOut, {

        capture: true,

      });

core/themes/olivero/js/second-level-navigation.js

+8 −14
Original line number Diff line number Diff line
@@ -42,23 +42,17 @@ 
          ).classList.remove('is-active-menu-parent');

        });

      }

      button.setAttribute('aria-expanded', 'true');

      topLevelMenuItem

        .querySelector('[data-drupal-selector="primary-nav-menu--level-2"]')

        .classList.add('is-active-menu-parent');

      topLevelMenuItem

        .querySelector('[data-drupal-selector="primary-nav-menu-🥕"]')

        .classList.add('is-active-menu-parent');

    } else {

      button.setAttribute('aria-expanded', 'false');

      topLevelMenuItem.classList.remove('is-touch-event');

    }



    button.setAttribute('aria-expanded', state);

    topLevelMenuItem

      .querySelector('[data-drupal-selector="primary-nav-menu--level-2"]')

        .classList.remove('is-active-menu-parent');

      .classList.toggle('is-active-menu-parent', state);

    topLevelMenuItem

      .querySelector('[data-drupal-selector="primary-nav-menu-🥕"]')

        .classList.remove('is-active-menu-parent');

    }

      .classList.toggle('is-active-menu-parent', state);

  }



  Drupal.olivero.toggleSubNav = toggleSubNav;

core/themes/olivero/js/tabs.js

+5 −7
Original line number Diff line number Diff line
@@ -32,13 +32,11 @@ 
     *   The event object.

     */

    function handleTriggerClick(e) {

      if (!tabs.classList.contains(expandedClass)) {

        e.currentTarget.setAttribute('aria-expanded', 'true');

        tabs.classList.add(expandedClass);

      } else {

        e.currentTarget.setAttribute('aria-expanded', 'false');

        tabs.classList.remove(expandedClass);

      }

      e.currentTarget.setAttribute(

        'aria-expanded',

        !tabs.classList.contains(expandedClass),

      );

      tabs.classList.toggle(expandedClass);

    }



    if (isTabsMobileLayout() && !activeTab.matches('.tabs__tab:first-child')) {