https://www.faire-werbung.ch/wp-content/themes/enfold/config-templ…/avia-shortcodes/tabs/tabs.js?ver=8.1

1// -------------------------------------------------------------------------------------------
2// Tab Shortcode
3//
4// @since 6.0 added better HTML support for European Accessibility Act:
5//		https://www.w3.org/WAI/ARIA/apg/patterns/tabs/examples/tabs-manual/
6//		https://www.w3.org/WAI/ARIA/apg/patterns/tabs/#examples
7//
8//	LIMITATION: currently we leave tabindex:0 to allow to tab through tabs and open with enter
9//	            as we do not support the default key behaviour because we loose focus
10//	            (needs a different implementation)
11// -------------------------------------------------------------------------------------------
12
13(function($)
14{
15	"use strict";
16
17	$.fn.avia_sc_tabs = function(options)
18	{
19		var defaults =
20		{
21			heading: '.tab',
22			content:'.tab_content',
23			active:'active_tab',
24			sidebar: false
25		};
26
27		var win = $(window),
28			options = $.extend(defaults, options);
29
30		return this.each(function()
31		{
32			var container 	= $(this),
33				tab_titles 	= $('<div class="tab_titles" role="tablist"></div>').prependTo(container),
34				tabs 		= $(options.heading, container),
35				content 	= $(options.content, container),
36				newtabs 	= false,
37				oldtabs 	= false;
38
39			//	clone tabs and move into tab_titles container
40			newtabs = tabs.clone();
41			oldtabs = tabs.addClass('fullsize-tab').attr( { 'aria-hidden': true, 'aria-selected': false, id: '', role: '', 'aria-controls': '', tabindex: 0 } );
42			tabs = newtabs;
43
44			tabs.prependTo( tab_titles ).each( function(i)
45			{
46				var tab = $(this),
47					the_oldtab = false;
48
49				if(newtabs)
50				{
51					the_oldtab = oldtabs.eq( i );
52				}
53
54				tab.addClass( 'tab_counter_' + i ).attr( { tab_counter: i } ).on( 'click', function()
55				{
56					open_content(tab, i, the_oldtab);
57					return false;
58				});
59
60				tab.on('keydown', function(objEvent)
61				{
62					if( objEvent.keyCode === 13 )  // if user presses 'enter'
63					{
64						tab.trigger('click');
65					}
66				});
67
68				if(newtabs)
69				{
70					the_oldtab.on('click', function()
71					{
72						open_content(the_oldtab, i, tab);
73						return false;
74					});
75
76					the_oldtab.on('keydown', function(objEvent)
77					{
78						if( objEvent.keyCode === 13 )  // if user presses 'enter'
79						{
80							the_oldtab.trigger('click');
81						}
82					});
83				}
84			});
85
86			set_size();
87			trigger_default_open(false);
88			win.on("debouncedresize", set_size);
89
90	        $('a').on('click',function(){
91	            var hash = $(this).attr('href');
92	            if(typeof hash != "undefined" && hash)
93	            {
94	                hash = hash.replace(/^.*?#/,'');
95	                trigger_default_open('#'+hash);
96	            }
97	        });
98
99			function set_size()
100			{
101				if( ! options.sidebar)
102				{
103					return;
104				}
105
106				content.css({'min-height': tab_titles.outerHeight() + 1});
107			}
108
109			function open_content( tab, i, alternate_tab )
110			{
111				if( ! tab.is( '.' + options.active ) )
112				{
113					$( '.' + options.active, container ).removeClass( options.active ).attr( { 'aria-selected': false, tabindex: 0 } );
114					$( '.' + options.active + '_content', container ).removeClass( options.active + '_content' ).attr( 'aria-hidden', true );
115
116					tab.addClass( options.active ).attr( { 'aria-selected': true, tabindex: 0 } );
117
118					var new_loc = tab.data('fake-id');
119					if( typeof new_loc == 'string' )
120					{
121						window.location.replace( new_loc );
122					}
123
124					if( alternate_tab )
125					{
126						alternate_tab.addClass( options.active );
127					}
128
129					var active_c = content.eq( i ).addClass( options.active + '_content' ).attr( 'aria-hidden', false );
130
131					if(typeof click_container != 'undefined' && click_container.length)
132					{
133						sidebar_shadow.height( active_c.outerHeight() );
134					}
135
136					//check if tab title is in viewport. if not scroll up
137					var el_offset = active_c.offset().top,
138						scoll_target = el_offset - 50 - parseInt( $('html').css('margin-top'), 10 );
139
140					if( win.scrollTop() > el_offset )
141					{
142						$('html:not(:animated),body:not(:animated)').scrollTop(scoll_target);
143					}
144				}
145
146				win.trigger( 'av-content-el-height-changed', tab );
147			}
148
149			function trigger_default_open(hash)
150			{
151				if( ! hash && window.location.hash )
152				{
153					hash = window.location.hash;
154				}
155
156				if( ! hash )
157				{
158					return;
159				}
160
161				var open = tabs.filter('[data-fake-id="'+hash+'"]');
162
163				if(open.length)
164				{
165					if( ! open.is('.active_tab') )
166					{
167						open.trigger('click');
168					}
169
170					window.scrollTo(0, container.offset().top - 70);
171				}
172			}
173
174		});
175	};
176
177
178}(jQuery));