123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118 |
- /**
- * @file
- * Block admin behaviors.
- */
- (function($, Drupal, debounce) {
- /**
- * Filters the block list by a text input search string.
- *
- * The text input will have the selector `input.block-filter-text`.
- *
- * The target element to do searching in will be in the selector
- * `input.block-filter-text[data-element]`
- *
- * The text source where the text should be found will have the selector
- * `.block-filter-text-source`
- *
- * @type {Drupal~behavior}
- *
- * @prop {Drupal~behaviorAttach} attach
- * Attaches the behavior for the block filtering.
- */
- Drupal.behaviors.blockFilterByText = {
- attach(context, settings) {
- const $input = $('input.block-filter-text').once('block-filter-text');
- const $table = $($input.attr('data-element'));
- let $filterRows;
- /**
- * Filters the block list.
- *
- * @param {jQuery.Event} e
- * The jQuery event for the keyup event that triggered the filter.
- */
- function filterBlockList(e) {
- const query = $(e.target)
- .val()
- .toLowerCase();
- /**
- * Shows or hides the block entry based on the query.
- *
- * @param {number} index
- * The index in the loop, as provided by `jQuery.each`
- * @param {HTMLElement} label
- * The label of the block.
- */
- function toggleBlockEntry(index, label) {
- const $label = $(label);
- const $row = $label.parent().parent();
- const textMatch =
- $label
- .text()
- .toLowerCase()
- .indexOf(query) !== -1;
- $row.toggle(textMatch);
- }
- // Filter if the length of the query is at least 2 characters.
- if (query.length >= 2) {
- $filterRows.each(toggleBlockEntry);
- Drupal.announce(
- Drupal.formatPlural(
- $table.find('tr:visible').length - 1,
- '1 block is available in the modified list.',
- '@count blocks are available in the modified list.',
- ),
- );
- } else {
- $filterRows.each(function(index) {
- $(this)
- .parent()
- .parent()
- .show();
- });
- }
- }
- if ($table.length) {
- $filterRows = $table.find('div.block-filter-text-source');
- $input.on('keyup', debounce(filterBlockList, 200));
- }
- },
- };
- /**
- * Highlights the block that was just placed into the block listing.
- *
- * @type {Drupal~behavior}
- *
- * @prop {Drupal~behaviorAttach} attach
- * Attaches the behavior for the block placement highlighting.
- */
- Drupal.behaviors.blockHighlightPlacement = {
- attach(context, settings) {
- // Ensure that the block we are attempting to scroll to actually exists.
- if (settings.blockPlacement && $('.js-block-placed').length) {
- $(context)
- .find('[data-drupal-selector="edit-blocks"]')
- .once('block-highlight')
- .each(function() {
- const $container = $(this);
- // Just scrolling the document.body will not work in Firefox. The html
- // element is needed as well.
- $('html, body').animate(
- {
- scrollTop:
- $('.js-block-placed').offset().top -
- $container.offset().top +
- $container.scrollTop(),
- },
- 500,
- );
- });
- }
- },
- };
- })(jQuery, Drupal, Drupal.debounce);
|