Skip to content

Commit f44bb27

Browse files
matthiasottmatthiasott
committed
Fix accordeon spelling error
1 parent 33aed38 commit f44bb27

7 files changed

+62
-62
lines changed

‎README.md

+4-4
Original file line numberDiff line numberDiff line change
@@ -47,19 +47,19 @@ The basic HTML structure for the accordion tabs component reads as follows:
4747
<li role="presentation"><a href="#section3" role="tab" id="tab3" aria-controls="section3" class="tabs-trigger js-tabs-trigger">Section 3</a></li>
4848
</ul>
4949
<section id="section1" role="tabpanel" aria-labelledby="tab1" class="tabs-panel js-tabs-panel" tabindex="0">
50-
<div class="accordeon-trigger js-accordeon-trigger" aria-controls="section1" aria-expanded="true" tabindex="0">Section 1</div>
50+
<div class="accordion-trigger js-accordion-trigger" aria-controls="section1" aria-expanded="true" tabindex="0">Section 1</div>
5151
<div class="content" aria-hidden="false">
5252
abc
5353
</div>
5454
</section>
5555
<section id="section2" role="tabpanel" aria-labelledby="tab2" class="tabs-panel js-tabs-panel">
56-
<div class="accordeon-trigger js-accordeon-trigger" aria-controls="section2" aria-expanded="false" tabindex="0">Section 2</div>
56+
<div class="accordion-trigger js-accordion-trigger" aria-controls="section2" aria-expanded="false" tabindex="0">Section 2</div>
5757
<div class="content" aria-hidden="true">
5858
def
5959
</div>
6060
</section>
6161
<section id="section3" role="tabpanel" aria-labelledby="tab3" class="tabs-panel js-tabs-panel">
62-
<div class="accordeon-trigger js-accordeon-trigger" aria-controls="section3" aria-expanded="false" tabindex="0">Section 3</div>
62+
<div class="accordion-trigger js-accordion-trigger" aria-controls="section3" aria-expanded="false" tabindex="0">Section 3</div>
6363
<div class="content" aria-hidden="true">
6464
def
6565
</div>
@@ -145,4 +145,4 @@ Matthias Ott
145145
<https://matthiasott.com>
146146
<https://twitter.com/m_ott>
147147

148-
Copyright (c) 2017 [Matthias Ott](https://matthiasott.com)
148+
Copyright (c) 2017–2020 [Matthias Ott](https://matthiasott.com)

‎a11y-accordion-tabs.js

+22-22
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
this.el = el;
1818
this.tabTriggers = this.el.getElementsByClassName('js-tabs-trigger');
1919
this.tabPanels = this.el.getElementsByClassName('js-tabs-panel');
20-
this.accordeonTriggers = this.el.getElementsByClassName('js-accordeon-trigger');
20+
this.accordionTriggers = this.el.getElementsByClassName('js-accordion-trigger');
2121

2222
this.options = this._extend({
2323
breakpoint: 640,
@@ -56,7 +56,7 @@
5656
var _this = this;
5757

5858
this.tabTriggersLength = this.tabTriggers.length;
59-
this.accordeonTriggersLength = this.accordeonTriggers.length;
59+
this.accordionTriggersLength = this.accordionTriggers.length;
6060
this.selectedTab = 0;
6161
this.prevSelectedTab = null;
6262
this.clickListener = this._clickEvent.bind(this);
@@ -69,9 +69,9 @@
6969
};
7070

7171
if(window.innerWidth >= this.options.breakpoint && this.options.tabsAllowed) {
72-
this.isAccordeon = false;
72+
this.isAccordion = false;
7373
} else {
74-
this.isAccordeon = true;
74+
this.isAccordion = true;
7575
}
7676

7777
for (var i = 0; i < this.tabTriggersLength; i++) {
@@ -86,12 +86,12 @@
8686
this._hide(i);
8787
}
8888

89-
for (var i = 0; i < this.accordeonTriggersLength; i++) {
90-
this.accordeonTriggers[i].index = i;
91-
this.accordeonTriggers[i].addEventListener('click', this.clickListener, false);
92-
this.accordeonTriggers[i].addEventListener('keydown', this.keydownListener, false);
89+
for (var i = 0; i < this.accordionTriggersLength; i++) {
90+
this.accordionTriggers[i].index = i;
91+
this.accordionTriggers[i].addEventListener('click', this.clickListener, false);
92+
this.accordionTriggers[i].addEventListener('keydown', this.keydownListener, false);
9393

94-
if (this.accordeonTriggers[i].classList.contains('is-selected')) {
94+
if (this.accordionTriggers[i].classList.contains('is-selected')) {
9595
this.selectedTab = i;
9696
}
9797
}
@@ -113,13 +113,13 @@
113113
var resizeTabs = this._debounce(function() {
114114
// This gets delayed for performance reasons
115115
if(window.innerWidth >= _this.options.breakpoint && _this.options.tabsAllowed) {
116-
_this.isAccordeon = false;
116+
_this.isAccordion = false;
117117
if (_this.options.tabsAllowed) {
118118
_this.el.classList.add('tabs-allowed');
119119
}
120120
_this.selectTab(_this.selectedTab);
121121
} else {
122-
_this.isAccordeon = true;
122+
_this.isAccordion = true;
123123
_this.el.classList.remove('tabs-allowed');
124124
if(_this.options.startCollapsed != "true" || _this.options.startCollapsed != true){
125125
_this.selectTab(_this.selectedTab);
@@ -140,16 +140,16 @@
140140
var closestTab = 0;
141141

142142
if (closestTrigger == null) {
143-
closestTrigger = this._getClosest(e.target, '.js-accordeon-trigger');
143+
closestTrigger = this._getClosest(e.target, '.js-accordion-trigger');
144144
closestTab = this._getClosest(closestTrigger, '.js-tabs-panel');
145-
this.isAccordeon = true;
145+
this.isAccordion = true;
146146
} else {
147-
this.isAccordeon = false;
147+
this.isAccordion = false;
148148
}
149149

150150
var targetIndex = e.target.index != null ? e.target.index : closestTab.index;
151151

152-
if (targetIndex === this.selectedTab && !this.isAccordeon) {
152+
if (targetIndex === this.selectedTab && !this.isAccordion) {
153153
return;
154154
}
155155

@@ -167,10 +167,10 @@
167167
return;
168168
}
169169

170-
if (e.keyCode === this.keys.prev && e.target.index > 0 && !this.isAccordeon) {
170+
if (e.keyCode === this.keys.prev && e.target.index > 0 && !this.isAccordion) {
171171
targetIndex = e.target.index - 1;
172172
}
173-
else if (e.keyCode === this.keys.next && e.target.index < this.tabTriggersLength - 1 && !this.isAccordeon) {
173+
else if (e.keyCode === this.keys.next && e.target.index < this.tabTriggersLength - 1 && !this.isAccordion) {
174174
targetIndex = e.target.index + 1;
175175
}
176176
else if (e.keyCode === this.keys.space || e.keyCode === this.keys.enter) {
@@ -191,7 +191,7 @@
191191
this.tabTriggers[index].classList.add('is-selected');
192192
this.tabTriggers[index].setAttribute('aria-selected', true);
193193

194-
this.accordeonTriggers[index].setAttribute('aria-expanded', true);
194+
this.accordionTriggers[index].setAttribute('aria-expanded', true);
195195

196196
var panelContent = this.tabPanels[index].getElementsByClassName("content")[0];
197197
panelContent.setAttribute('aria-hidden', false);
@@ -212,7 +212,7 @@
212212
this.tabTriggers[index].setAttribute('aria-selected', false);
213213
this.tabTriggers[index].setAttribute('tabindex', -1);
214214

215-
this.accordeonTriggers[index].setAttribute('aria-expanded', false);
215+
this.accordionTriggers[index].setAttribute('aria-expanded', false);
216216

217217
var panelContent = this.tabPanels[index].getElementsByClassName("content")[0];
218218
panelContent.setAttribute('aria-hidden', true);
@@ -227,7 +227,7 @@
227227
AccordionTabs.prototype.selectTab = function (index, userInvoked) {
228228

229229
if (index === null) {
230-
if(this.isAccordeon) {
230+
if(this.isAccordion) {
231231
return;
232232
} else {
233233
index = 0;
@@ -248,13 +248,13 @@
248248
return;
249249
}
250250

251-
if (this.isAccordeon) {
251+
if (this.isAccordion) {
252252

253253
this.prevSelectedTab = this.selectedTab;
254254
this.selectedTab = index;
255255

256256
} else {
257-
if (this.prevSelectedTab === null || !this.isAccordeon) {
257+
if (this.prevSelectedTab === null || !this.isAccordion) {
258258
for (var i = 0; i < this.tabTriggersLength; i++) {
259259
if (i !== index) {
260260
this._hide(i);

0 commit comments

Comments
 (0)