nav-tabs.js 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748
  1. /**
  2. * DO NOT EDIT THIS FILE.
  3. * See the following change record for more information,
  4. * https://www.drupal.org/node/2815083
  5. * @preserve
  6. **/
  7. (function ($, Drupal) {
  8. function init(i, tab) {
  9. var $tab = $(tab);
  10. var $target = $tab.find('[data-drupal-nav-tabs-target]');
  11. var isCollapsible = $tab.hasClass('is-collapsible');
  12. function openMenu(e) {
  13. $target.toggleClass('is-open');
  14. }
  15. function handleResize(e) {
  16. $tab.addClass('is-horizontal');
  17. var $tabs = $tab.find('.tabs');
  18. var isHorizontal = $tabs.outerHeight() <= $tabs.find('.tabs__tab').outerHeight();
  19. $tab.toggleClass('is-horizontal', isHorizontal);
  20. if (isCollapsible) {
  21. $tab.toggleClass('is-collapse-enabled', !isHorizontal);
  22. }
  23. if (isHorizontal) {
  24. $target.removeClass('is-open');
  25. }
  26. }
  27. $tab.addClass('position-container is-horizontal-enabled');
  28. $tab.on('click.tabs', '[data-drupal-nav-tabs-trigger]', openMenu);
  29. $(window).on('resize.tabs', Drupal.debounce(handleResize, 150)).trigger('resize.tabs');
  30. }
  31. Drupal.behaviors.navTabs = {
  32. attach: function attach(context, settings) {
  33. var $tabs = $(context).find('[data-drupal-nav-tabs]');
  34. if ($tabs.length) {
  35. var notSmartPhone = window.matchMedia('(min-width: 300px)');
  36. if (notSmartPhone.matches) {
  37. $tabs.once('nav-tabs').each(init);
  38. }
  39. }
  40. }
  41. };
  42. })(jQuery, Drupal);