PluginProbe
BlockSpare – Gutenberg Blocks for News, Magazine, Blog & Business Websites / 1.3.2
BlockSpare – Gutenberg Blocks for News, Magazine, Blog & Business Websites v1.3.2
4.1.0 trunk 1.0.0 1.0.1 1.0.2 1.0.3 1.0.4 1.0.5 1.1.0 1.1.1 1.1.2 1.2.0 1.2.1 1.2.2 1.2.3 1.3.0 1.3.1 1.3.2 1.3.3 1.3.4 1.3.5 2.1.2 2.5.0 2.5.3 2.6.1 All 38 releases
blockspare / src / assets / js / tabs.js

tabs.js in BlockSpare – Gutenberg Blocks for News, Magazine, Blog & Business Websites 1.3.2, at src/assets/js/tabs.js

107 lines 5.5 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /**
2 * Tabs that can create an accordion for mobile.
3 */
4
5 jQuery( document ).ready( function( $ ) {
6 $( '.bs-tabs-wrap' ).each( function( a ) {
7 var ktStartTab = $( this ).find( '> .bs-tabs-title-list .bs-tab-title-active' ).attr( 'data-tab' );
8 var ktTabsList = $( this ).find( '> .bs-tabs-title-list' ).attr( {
9 role: 'tablist',
10 } );
11 $( this ).find( '> .bs-tabs-content-wrap > .bs-tab-inner-content' ).attr( {
12 role: 'tabpanel',
13 'aria-hidden': 'true',
14 } );
15 $( this ).find( '> .bs-tabs-title-list a' ).each( function( b ) {
16 var tabId = $( this ).attr( 'data-tab' );
17 var tabName = $( this ).parent().attr( 'id' );
18 $( this ).closest( '.bs-tabs-wrap' ).find( '.bs-tabs-content-wrap > .bs-inner-tab-' + tabId ).attr( 'aria-labelledby', tabName );
19 } );
20 $( this ).find( '.bs-tabs-content-wrap > .bs-inner-tab-' + ktStartTab ).attr( 'aria-hidden', 'false' );
21 $( this ).find( '> .bs-tabs-title-list li:not(.bs-tab-title-active) a' ).each( function() {
22 $( this ).attr( {
23 role: 'tab',
24 'aria-selected': 'false',
25 tabindex: '-1',
26 } ).parent().attr( 'role', 'presentation' );
27 } );
28 $( this ).find( '> .bs-tabs-title-list li.bs-tab-title-active a' ).attr( {
29 role: 'tab',
30 'aria-selected': 'true',
31 tabindex: '0',
32 } ).parent().attr( 'role', 'presentation' );
33 $( ktTabsList ).delegate( 'a', 'keydown', function( e ) {
34 switch ( e.which ) {
35 case 37: case 38:
36 if ( $( this ).parent().prev().length != 0 ) {
37 $( this ).parent().prev().find( '> a' ).click();
38 } else {
39 $( ktTabsList ).find( 'li:last > a' ).click();
40 }
41 break;
42 case 39: case 40:
43 if ( $( this ).parent().next().length != 0 ) {
44 $( this ).parent().next().find( '> a' ).click();
45 } else {
46 $( ktTabsList ).find( 'li:first > a' ).click();
47 }
48 break;
49 }
50 } );
51 } );
52 $( '.bs-tabs-title-list li a' ).click( function( e ) {
53 e.preventDefault();
54 var tabId = $( this ).attr( 'data-tab' );
55
56 $( this ).closest( '.bs-tabs-title-list' ).find( '.bs-tab-title-active' )
57 .addClass( 'bs-tab-title-inactive' )
58 .removeClass( 'bs-tab-title-active' )
59 .find( 'a.bs-tab-title' ).attr( {
60 tabindex: '-1',
61 'aria-selected': 'false',
62 } );
63 $( this ).closest( '.bs-tabs-wrap' ).removeClass( function( index, className ) {
64 return ( className.match( /\bbs-active-tab-\S+/g ) || [] ).join( ' ' );
65 } ).addClass( 'bs-active-tab-' + tabId );
66 $( this ).parent( 'li' ).addClass( 'bs-tab-title-active' ).removeClass( 'bs-tab-title-inactive' );
67 $( this ).attr( {
68 tabindex: '0',
69 'aria-selected': 'true',
70 } ).focus();
71 $( this ).closest( '.bs-tabs-wrap' ).find( '.bs-tabs-content-wrap > .bs-tab-inner-content:not(.bs-inner-tab-' + tabId + ')' ).attr( 'aria-hidden', 'true' );
72 $( this ).closest( '.bs-tabs-wrap' ).find( '.bs-tabs-content-wrap > .bs-inner-tab-' + tabId ).attr( 'aria-hidden', 'false' );
73 $( this ).closest( '.bs-tabs-wrap' ).find( '.bs-tabs-content-wrap > .bs-tabs-accordion-title:not(.bs-tabs-accordion-title-' + tabId + ')' ).addClass( 'bs-tab-title-inactive' ).removeClass( 'bs-tab-title-active' ).attr( {
74 tabindex: '-1',
75 'aria-selected': 'false',
76 } );
77 $( this ).closest( '.bs-tabs-wrap' ).find( '.bs-tabs-content-wrap > .bs-tabs-accordion-title.bs-tabs-accordion-title-' + tabId ).addClass( 'bs-tab-title-active' ).removeClass( 'bs-tab-title-inactive' ).attr( {
78 tabindex: '0',
79 'aria-selected': 'true',
80 } );
81 var resizeEvent = window.document.createEvent( 'UIEvents' );
82 resizeEvent.initUIEvent( 'resize', true, false, window, 0 );
83 window.dispatchEvent( resizeEvent );
84 var tabEvent = window.document.createEvent( 'UIEvents' );
85 tabEvent.initUIEvent( 'blockspare-tabs-open', true, false, window, 0 );
86 window.dispatchEvent( tabEvent );
87 } );
88
89 function bs_anchor_tabs() {
90 if ( window.location.hash != '' ) {
91 if ( $( window.location.hash + '.bs-title-item' ).length ) {
92 var tabid = window.location.hash.substring(1);
93 var tabnumber = $( '#' + tabid + ' a' ).attr( 'data-tab' );
94 $( '#' + tabid ).closest( '.bs-tabs-title-list' ).find( '.bs-tab-title-active' )
95 .addClass( 'bs-tab-title-inactive' )
96 .removeClass( 'bs-tab-title-active' );
97 $( '#' + tabid ).closest( '.bs-tabs-wrap' ).removeClass( function( index, className ) {
98 return ( className.match( /\bbs-active-tab-\S+/g ) || [] ).join( ' ' );
99 } ).addClass( 'bs-active-tab-' + tabnumber );
100 $( '#' + tabid ).addClass( 'bs-tab-title-active' );
101 $( '#' + tabid ).closest( '.bs-tabs-wrap' ).find( '.bs-tabs-accordion-title.bs-tabs-accordion-title-' + tabid ).addClass( 'bs-tab-title-active' ).removeClass( 'bs-tab-title-inactive' );
102 }
103 }
104 }
105 window.addEventListener( 'hashchange', bs_anchor_tabs, false );
106 bs_anchor_tabs();
107 } );