Version 1

[yaffs-website] / web / core / misc / active-link.js

diff --git a/web/core/misc/active-link.js b/web/core/misc/active-link.js
new file mode 100644 (file)
index 0000000..9cf55b4
--- /dev/null
+++ b/web/core/misc/active-link.js
@@ -0,0 +1,68 @@
+/**
+ * @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…
+   *
+   * @type {Drupal~behavior}
+   */
+  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 <front> path as
+      // well.
+      if (path.isFront) {
+        originalSelectors.push('[data-drupal-link-system-path="<front>"]');
+      }
+
+      // 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(','));
+      var il = activeLinks.length;
+      for (var i = 0; i < il; i++) {
+        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');
+        var il = activeLinks.length;
+        for (var i = 0; i < il; i++) {
+          activeLinks[i].classList.remove('is-active');
+        }
+      }
+    }
+  };
+
+})(Drupal, drupalSettings);