| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207 | /** * @file * Javascript enhancements for the Search API admin pages. */(function ($) {/** * Allows the re-ordering of enabled data alterations and processors. */// Copied from filter.admin.jsDrupal.behaviors.searchApiStatus = {  attach: function (context, settings) {    $('.search-api-status-wrapper input.form-checkbox', context).once('search-api-status', function () {      var $checkbox = $(this);      // Retrieve the tabledrag row belonging to this processor.      var $row = $('#' + $checkbox.attr('id').replace(/-status$/, '-weight'), context).closest('tr');      // Retrieve the vertical tab belonging to this processor.      var $tab = $('#' + $checkbox.attr('id').replace(/-status$/, '-settings'), context).data('verticalTab');      // Bind click handler to this checkbox to conditionally show and hide the      // filter's tableDrag row and vertical tab pane.      $checkbox.bind('click.searchApiUpdate', function () {        if ($checkbox.is(':checked')) {          $row.show();          if ($tab) {            $tab.tabShow().updateSummary();          }        }        else {          $row.hide();          if ($tab) {            $tab.tabHide().updateSummary();          }        }        // Restripe table after toggling visibility of table row.        Drupal.tableDrag['search-api-' + $checkbox.attr('id').replace(/^edit-([^-]+)-.*$/, '$1') + '-order-table'].restripeTable();      });      // Attach summary for configurable items (only for screen-readers).      if ($tab) {        $tab.fieldset.drupalSetSummary(function (tabContext) {          return $checkbox.is(':checked') ? Drupal.t('Enabled') : Drupal.t('Disabled');        });      }      // Trigger our bound click handler to update elements to initial state.      $checkbox.triggerHandler('click.searchApiUpdate');    });  }};/** * Processes elements with the .dropbutton class on page load. */Drupal.behaviors.searchApiDropButton = {  attach: function (context, settings) {    var $dropbuttons = $(context).find('.dropbutton-wrapper').once('dropbutton');    if ($dropbuttons.length) {      //$('.dropbutton-toggle', $dropbuttons).click(dropbuttonClickHandler);      // Initialize all buttons.      for (var i = 0, il = $dropbuttons.length; i < il; i++) {        DropButton.dropbuttons.push(new DropButton($dropbuttons[i], settings.dropbutton));      }      // Adds the delegated handler that will toggle dropdowns on click.      $('.dropbutton-toggle', $dropbuttons).click(dropbuttonClickHandler);    }  }};/** * Delegated callback for opening and closing dropbutton secondary actions. */function dropbuttonClickHandler(e) {  e.preventDefault();  $(e.target).closest('.dropbutton-wrapper').toggleClass('open');}/** * A DropButton presents an HTML list as a button with a primary action. * * All secondary actions beyond the first in the list are presented in a * dropdown list accessible through a toggle arrow associated with the button. * * @param {jQuery} dropbutton *   A jQuery element. * * @param {Object} settings *   A list of options including: *    - {String} title: The text inside the toggle link element. This text is *      hidden from visual UAs. */function DropButton(dropbutton, settings) {  // Merge defaults with settings.  var options = $.extend({'title': Drupal.t('List additional actions')}, settings);  var $dropbutton = $(dropbutton);  this.$dropbutton = $dropbutton;  this.$list = $dropbutton.find('.dropbutton');  // Find actions and mark them.  this.$actions = this.$list.find('li').addClass('dropbutton-action');  // Add the special dropdown only if there are hidden actions.  if (this.$actions.length > 1) {    // Identify the first element of the collection.    var $primary = this.$actions.slice(0, 1);    // Identify the secondary actions.    var $secondary = this.$actions.slice(1);    $secondary.addClass('secondary-action');    // Add toggle link.    $primary.after(Drupal.theme('dropbuttonToggle', options));    // Bind mouse events.    this.$dropbutton      .addClass('dropbutton-multiple')      /**       * Adds a timeout to close the dropdown on mouseleave.       */      .bind('mouseleave.dropbutton', $.proxy(this.hoverOut, this))      /**       * Clears timeout when mouseout of the dropdown.       */      .bind('mouseenter.dropbutton', $.proxy(this.hoverIn, this))      /**       * Similar to mouseleave/mouseenter, but for keyboard navigation.       */      .bind('focusout.dropbutton', $.proxy(this.focusOut, this))      .bind('focusin.dropbutton', $.proxy(this.focusIn, this));  }}/** * Extend the DropButton constructor. */$.extend(DropButton, {  /**   * Store all processed DropButtons.   *   * @type {Array}   */  dropbuttons: []});/** * Extend the DropButton prototype. */$.extend(DropButton.prototype, {  /**   * Toggle the dropbutton open and closed.   *   * @param {Boolean} show   *   (optional) Force the dropbutton to open by passing true or to close by   *   passing false.   */  toggle: function (show) {    var isBool = typeof show === 'boolean';    show = isBool ? show : !this.$dropbutton.hasClass('open');    this.$dropbutton.toggleClass('open', show);  },  hoverIn: function () {    // Clear any previous timer we were using.    if (this.timerID) {      window.clearTimeout(this.timerID);    }  },  hoverOut: function () {    // Wait half a second before closing.    this.timerID = window.setTimeout($.proxy(this, 'close'), 500);  },  open: function () {    this.toggle(true);  },  close: function () {    this.toggle(false);  },  focusOut: function (e) {    this.hoverOut.call(this, e);  },  focusIn: function (e) {    this.hoverIn.call(this, e);  }});$.extend(Drupal.theme, {  /**   * A toggle is an interactive element often bound to a click handler.   *   * @param {Object} options   *   - {String} title: (optional) The HTML anchor title attribute and   *     text for the inner span element.   *   * @return {String}   *   A string representing a DOM fragment.   */  dropbuttonToggle: function (options) {    return '<li class="dropbutton-toggle"><button type="button" role="button"><span class="dropbutton-arrow"><span class="visually-hidden">' + options.title + '</span></span></button></li>';  }});// Expose constructor in the public space.Drupal.DropButton = DropButton;})(jQuery);
 |