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