https://admission.providence.edu/wp-content/plugins/ACF-PCCustomBl…block-javascript-pc-custom-tab.js?ver=6.8.9

1const allContainers = document.querySelectorAll(".wp-block-pc-tabs");
2var counter = 0;
3allContainers.forEach(function(con) {
4	
5	const allTabs = con.querySelectorAll(".wp-block-pc-tab");
6	const tabLabelCon = con.querySelectorAll(".automatic");
7	
8	var i = 0;
9	var tabs = '';
10	allTabs.forEach(function(el) {
11		var plus = i+1;
12		var open = false;
13		if(i == 0) {
14			open = true;
15		}
16		var tL = el.dataset.label;
17		var label = '<button id="tab-'+counter+plus+'" type="button" role="tab" aria-selected="'+open+'" aria-controls="tabpanel-'+counter+plus+'"><span class="focus">'+tL+'</span></button>';
18		el.setAttribute('id', 'tabpanel-'+counter+plus);
19		el.setAttribute('tabindex', i);
20		el.setAttribute('aria-labelledby', 'tab-'+counter+plus);
21		
22		tabs += label;
23		i++;
24	});
25	tabLabelCon[0].innerHTML = tabs;
26	counter++;
27});
28
29'use strict';
30
31class TabsAutomatic {
32  constructor(groupNode) {
33    this.tablistNode = groupNode;
34
35    this.tabs = [];
36
37    this.firstTab = null;
38    this.lastTab = null;
39
40    this.tabs = Array.from(this.tablistNode.querySelectorAll('[role=tab]'));
41    this.tabpanels = [];
42
43    for (var i = 0; i < this.tabs.length; i += 1) {
44      var tab = this.tabs[i];
45      var tabpanel = document.getElementById(tab.getAttribute('aria-controls'));
46
47      tab.tabIndex = -1;
48      tab.setAttribute('aria-selected', 'false');
49      this.tabpanels.push(tabpanel);
50
51      tab.addEventListener('keydown', this.onKeydown.bind(this));
52      tab.addEventListener('click', this.onClick.bind(this));
53
54      if (!this.firstTab) {
55        this.firstTab = tab;
56      }
57      this.lastTab = tab;
58    }
59
60    this.setSelectedTab(this.firstTab, false);
61  }
62
63  setSelectedTab(currentTab, setFocus) {
64    if (typeof setFocus !== 'boolean') {
65      setFocus = true;
66    }
67    for (var i = 0; i < this.tabs.length; i += 1) {
68      var tab = this.tabs[i];
69      if (currentTab === tab) {
70        tab.setAttribute('aria-selected', 'true');
71        tab.removeAttribute('tabindex');
72        this.tabpanels[i].style.display = 'block';
73        if (setFocus) {
74          tab.focus();
75        }
76      } else {
77        tab.setAttribute('aria-selected', 'false');
78        tab.tabIndex = -1;
79        this.tabpanels[i].style.display = 'none';
80      }
81    }
82  }
83
84  setSelectedToPreviousTab(currentTab) {
85    var index;
86
87    if (currentTab === this.firstTab) {
88      this.setSelectedTab(this.lastTab);
89    } else {
90      index = this.tabs.indexOf(currentTab);
91      this.setSelectedTab(this.tabs[index - 1]);
92    }
93  }
94
95  setSelectedToNextTab(currentTab) {
96    var index;
97
98    if (currentTab === this.lastTab) {
99      this.setSelectedTab(this.firstTab);
100    } else {
101      index = this.tabs.indexOf(currentTab);
102      this.setSelectedTab(this.tabs[index + 1]);
103    }
104  }
105
106  /* EVENT HANDLERS */
107
108  onKeydown(event) {
109    var tgt = event.currentTarget,
110      flag = false;
111
112    switch (event.key) {
113      case 'ArrowLeft':
114        this.setSelectedToPreviousTab(tgt);
115        flag = true;
116        break;
117
118      case 'ArrowRight':
119        this.setSelectedToNextTab(tgt);
120        flag = true;
121        break;
122
123      case 'Home':
124        this.setSelectedTab(this.firstTab);
125        flag = true;
126        break;
127
128      case 'End':
129        this.setSelectedTab(this.lastTab);
130        flag = true;
131        break;
132
133      default:
134        break;
135    }
136
137    if (flag) {
138      event.stopPropagation();
139      event.preventDefault();
140    }
141  }
142
143  onClick(event) {
144    this.setSelectedTab(event.currentTarget);
145  }
146}
147
148// Initialize tablist
149
150window.addEventListener('load', function () {
151  var tablists = document.querySelectorAll('[role=tablist].automatic');
152  for (var i = 0; i < tablists.length; i++) {
153    new TabsAutomatic(tablists[i]);
154  }
155  var containers = document.querySelectorAll(".wp-block-pc-tabs");
156  for (var ii = 0; ii < containers.length; ii++) {
157		containers[ii].style.display = 'block';
158  }
159});