/** * @file * Attaches behaviors for Drupal's active link marking. */ (function (Drupal, drupalSettings) { "use strict"; /** * Append is-active class. * * The link is only active if its path corresponds to the current path, the * language of the linked path is equal to the current language, and if the * query parameters of the link equal those of the current request, since the * same request with different query parameters may yield a different page * (e.g. pagers, exposed View filters). * * Does not discriminate based on element type, so allows you to set the * is-active class on any element: a, li… */ Drupal.behaviors.activeLinks = { attach: function (context) { // Start by finding all potentially active links. var path = drupalSettings.path; var queryString = JSON.stringify(path.currentQuery); var querySelector = path.currentQuery ? "[data-drupal-link-query='" + queryString + "']" : ':not([data-drupal-link-query])'; var originalSelectors = ['[data-drupal-link-system-path="' + path.currentPath + '"]']; var selectors; // If this is the front page, we have to check for the path as well. if (path.isFront) { originalSelectors.push('[data-drupal-link-system-path=""]'); } // Add language filtering. selectors = [].concat( // Links without any hreflang attributes (most of them). originalSelectors.map(function (selector) { return selector + ':not([hreflang])'; }), // Links with hreflang equals to the current language. originalSelectors.map(function (selector) { return selector + '[hreflang="' + path.currentLanguage + '"]'; }) ); // Add query string selector for pagers, exposed filters. selectors = selectors.map(function (current) { return current + querySelector; }); // Query the DOM. var activeLinks = context.querySelectorAll(selectors.join(',')); for (var i = 0, il = activeLinks.length; i < il; i += 1) { activeLinks[i].classList.add('is-active'); } }, detach: function (context, settings, trigger) { if (trigger === 'unload') { var activeLinks = context.querySelectorAll('[data-drupal-link-system-path].is-active'); for (var i = 0, il = activeLinks.length; i < il; i += 1) { activeLinks[i].classList.remove('is-active'); } } } }; })(Drupal, drupalSettings);