138 lines
5.1 KiB
JavaScript
138 lines
5.1 KiB
JavaScript
/**
|
|
* DO NOT EDIT THIS FILE.
|
|
* See the following change record for more information,
|
|
* https://www.drupal.org/node/2815083
|
|
* @preserve
|
|
**/
|
|
|
|
(function ($, Drupal, drupalSettings) {
|
|
var handleFragmentLinkClickOrHashChange = function handleFragmentLinkClickOrHashChange(e, $target) {
|
|
$target.parents('.vertical-tabs__pane').each(function (index, pane) {
|
|
$(pane).data('verticalTab').focus();
|
|
});
|
|
};
|
|
|
|
Drupal.behaviors.verticalTabs = {
|
|
attach: function attach(context) {
|
|
var width = drupalSettings.widthBreakpoint || 640;
|
|
var mq = "(max-width: ".concat(width, "px)");
|
|
|
|
if (window.matchMedia(mq).matches) {
|
|
return;
|
|
}
|
|
|
|
$(once('vertical-tabs-fragments', 'body')).on('formFragmentLinkClickOrHashChange.verticalTabs', handleFragmentLinkClickOrHashChange);
|
|
once('vertical-tabs', '[data-vertical-tabs-panes]', context).forEach(function (verticalTab) {
|
|
var $this = $(verticalTab).addClass('vertical-tabs__panes');
|
|
var focusID = $this.find(':hidden.vertical-tabs__active-tab')[0].value;
|
|
var tabFocus;
|
|
var $details = $this.find('> details');
|
|
|
|
if ($details.length === 0) {
|
|
return;
|
|
}
|
|
|
|
var tabList = $('<ul class="vertical-tabs__menu"></ul>');
|
|
$this.wrap('<div class="vertical-tabs clearfix"></div>').before(tabList);
|
|
$details.each(function () {
|
|
var $that = $(this);
|
|
var $summary = $that.find('> summary');
|
|
var verticalTab = new Drupal.verticalTab({
|
|
title: $summary.length ? $summary[0].textContent : '',
|
|
details: $that
|
|
});
|
|
tabList.append(verticalTab.item);
|
|
$that.removeClass('collapsed').removeAttr('open').addClass('vertical-tabs__pane').data('verticalTab', verticalTab);
|
|
|
|
if (this.id === focusID) {
|
|
tabFocus = $that;
|
|
}
|
|
});
|
|
$(tabList).find('> li').eq(0).addClass('first');
|
|
$(tabList).find('> li').eq(-1).addClass('last');
|
|
|
|
if (!tabFocus) {
|
|
var $locationHash = $this.find(window.location.hash);
|
|
|
|
if (window.location.hash && $locationHash.length) {
|
|
tabFocus = $locationHash.closest('.vertical-tabs__pane');
|
|
} else {
|
|
tabFocus = $this.find('> .vertical-tabs__pane').eq(0);
|
|
}
|
|
}
|
|
|
|
if (tabFocus.length) {
|
|
tabFocus.data('verticalTab').focus();
|
|
}
|
|
});
|
|
}
|
|
};
|
|
|
|
Drupal.verticalTab = function (settings) {
|
|
var self = this;
|
|
$.extend(this, settings, Drupal.theme('verticalTab', settings));
|
|
this.link.attr('href', "#".concat(settings.details.attr('id')));
|
|
this.link.on('click', function (e) {
|
|
e.preventDefault();
|
|
self.focus();
|
|
});
|
|
this.link.on('keydown', function (event) {
|
|
if (event.keyCode === 13) {
|
|
event.preventDefault();
|
|
self.focus();
|
|
$('.vertical-tabs__pane :input:visible:enabled').eq(0).trigger('focus');
|
|
}
|
|
});
|
|
this.details.on('summaryUpdated', function () {
|
|
self.updateSummary();
|
|
}).trigger('summaryUpdated');
|
|
};
|
|
|
|
Drupal.verticalTab.prototype = {
|
|
focus: function focus() {
|
|
this.details.siblings('.vertical-tabs__pane').each(function () {
|
|
var tab = $(this).data('verticalTab');
|
|
tab.details.hide();
|
|
tab.details.removeAttr('open');
|
|
tab.item.removeClass('is-selected');
|
|
}).end().show().siblings(':hidden.vertical-tabs__active-tab')[0].value = this.details.attr('id');
|
|
this.details.attr('open', true);
|
|
this.item.addClass('is-selected');
|
|
$('#active-vertical-tab').remove();
|
|
this.link.append("<span id=\"active-vertical-tab\" class=\"visually-hidden\">".concat(Drupal.t('(active tab)'), "</span>"));
|
|
},
|
|
updateSummary: function updateSummary() {
|
|
this.summary.html(this.details.drupalGetSummary());
|
|
},
|
|
tabShow: function tabShow() {
|
|
this.item.show();
|
|
this.item.closest('.js-form-type-vertical-tabs').show();
|
|
this.item.parent().children('.vertical-tabs__menu-item').removeClass('first').filter(':visible').eq(0).addClass('first');
|
|
this.details.removeClass('vertical-tab--hidden').show();
|
|
this.focus();
|
|
return this;
|
|
},
|
|
tabHide: function tabHide() {
|
|
this.item.hide();
|
|
this.item.parent().children('.vertical-tabs__menu-item').removeClass('first').filter(':visible').eq(0).addClass('first');
|
|
this.details.addClass('vertical-tab--hidden').hide().removeAttr('open');
|
|
var $firstTab = this.details.siblings('.vertical-tabs__pane:not(.vertical-tab--hidden)').eq(0);
|
|
|
|
if ($firstTab.length) {
|
|
$firstTab.data('verticalTab').focus();
|
|
} else {
|
|
this.item.closest('.js-form-type-vertical-tabs').hide();
|
|
}
|
|
|
|
return this;
|
|
}
|
|
};
|
|
|
|
Drupal.theme.verticalTab = function (settings) {
|
|
var tab = {};
|
|
tab.title = $('<strong class="vertical-tabs__menu-item-title"></strong>');
|
|
tab.title[0].textContent = settings.title;
|
|
tab.item = $('<li class="vertical-tabs__menu-item" tabindex="-1"></li>').append(tab.link = $('<a href="#"></a>').append(tab.title).append(tab.summary = $('<span class="vertical-tabs__menu-item-summary"></span>')));
|
|
return tab;
|
|
};
|
|
})(jQuery, Drupal, drupalSettings); |