123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102 |
- /**
- * DO NOT EDIT THIS FILE.
- * See the following change record for more information,
- * https://www.drupal.org/node/2815083
- * @preserve
- **/
- (function ($, Drupal) {
- Drupal.behaviors.dropButton = {
- attach: function attach(context, settings) {
- var $dropbuttons = $(context).find('.dropbutton-wrapper').once('dropbutton');
- if ($dropbuttons.length) {
- var $body = $('body').once('dropbutton-click');
- if ($body.length) {
- $body.on('click', '.dropbutton-toggle', dropbuttonClickHandler);
- }
- var il = $dropbuttons.length;
- for (var i = 0; i < il; i++) {
- DropButton.dropbuttons.push(new DropButton($dropbuttons[i], settings.dropbutton));
- }
- }
- }
- };
- function dropbuttonClickHandler(e) {
- e.preventDefault();
- $(e.target).closest('.dropbutton-wrapper').toggleClass('open');
- }
- function DropButton(dropbutton, settings) {
- var options = $.extend({ title: Drupal.t('List additional actions') }, settings);
- var $dropbutton = $(dropbutton);
- this.$dropbutton = $dropbutton;
- this.$list = $dropbutton.find('.dropbutton');
- this.$actions = this.$list.find('li').addClass('dropbutton-action');
- if (this.$actions.length > 1) {
- var $primary = this.$actions.slice(0, 1);
- var $secondary = this.$actions.slice(1);
- $secondary.addClass('secondary-action');
- $primary.after(Drupal.theme('dropbuttonToggle', options));
- this.$dropbutton.addClass('dropbutton-multiple').on({
- 'mouseleave.dropbutton': $.proxy(this.hoverOut, this),
- 'mouseenter.dropbutton': $.proxy(this.hoverIn, this),
- 'focusout.dropbutton': $.proxy(this.focusOut, this),
- 'focusin.dropbutton': $.proxy(this.focusIn, this)
- });
- } else {
- this.$dropbutton.addClass('dropbutton-single');
- }
- }
- $.extend(DropButton, {
- dropbuttons: []
- });
- $.extend(DropButton.prototype, {
- toggle: function toggle(show) {
- var isBool = typeof show === 'boolean';
- show = isBool ? show : !this.$dropbutton.hasClass('open');
- this.$dropbutton.toggleClass('open', show);
- },
- hoverIn: function hoverIn() {
- if (this.timerID) {
- window.clearTimeout(this.timerID);
- }
- },
- hoverOut: function hoverOut() {
- this.timerID = window.setTimeout($.proxy(this, 'close'), 500);
- },
- open: function open() {
- this.toggle(true);
- },
- close: function close() {
- this.toggle(false);
- },
- focusOut: function focusOut(e) {
- this.hoverOut.call(this, e);
- },
- focusIn: function focusIn(e) {
- this.hoverIn.call(this, e);
- }
- });
- $.extend(Drupal.theme, {
- dropbuttonToggle: function dropbuttonToggle(options) {
- return '<li class="dropbutton-toggle"><button type="button"><span class="dropbutton-arrow"><span class="visually-hidden">' + options.title + '</span></span></button></li>';
- }
- });
- Drupal.DropButton = DropButton;
- })(jQuery, Drupal);
|