diff --git a/inc/Ui/Search.php b/inc/Ui/Search.php index 170b4a81d4474793949955f8fed16948e686f046..9535c3640e541e89d6e0bee6e6f746dd0b9a500b 100644 --- a/inc/Ui/Search.php +++ b/inc/Ui/Search.php @@ -116,7 +116,7 @@ class Search extends Ui $activeOption = 'mtime'; } - $searchForm->addTagOpen('div')->addClass('toggle'); + $searchForm->addTagOpen('div')->addClass('toggle')->attr('aria-haspopup', 'true'); // render current $currentWrapper = $searchForm->addTagOpen('div')->addClass('current'); if ($activeOption !== 'hits') { @@ -126,7 +126,7 @@ class Search extends Ui $searchForm->addTagClose('div'); // render options list - $searchForm->addTagOpen('ul'); + $searchForm->addTagOpen('ul')->attr('aria-expanded', 'false'); foreach ($options as $key => $option) { $listItem = $searchForm->addTagOpen('li'); @@ -194,7 +194,8 @@ class Search extends Ui $searchForm->addTagOpen('div') ->addClass('advancedOptions') - ->attr('style', 'display: none;'); + ->attr('style', 'display: none;') + ->attr('aria-hidden', 'true'); $this->addFragmentBehaviorLinks($searchForm); $this->addNamespaceSelector($searchForm); @@ -268,7 +269,7 @@ class Search extends Ui ]], $options); } - $searchForm->addTagOpen('div')->addClass('toggle'); + $searchForm->addTagOpen('div')->addClass('toggle')->attr('aria-haspopup', 'true'); // render current $currentWrapper = $searchForm->addTagOpen('div')->addClass('current'); if ($activeOption !== 'exact') { @@ -278,7 +279,7 @@ class Search extends Ui $searchForm->addTagClose('div'); // render options list - $searchForm->addTagOpen('ul'); + $searchForm->addTagOpen('ul')->attr('aria-expanded', 'false'); foreach ($options as $key => $option) { $listItem = $searchForm->addTagOpen('li'); @@ -318,7 +319,7 @@ class Search extends Ui $baseNS = empty($this->parsedQuery['ns']) ? '' : $this->parsedQuery['ns'][0]; $extraNS = $this->getAdditionalNamespacesFromResults($baseNS); - $searchForm->addTagOpen('div')->addClass('toggle'); + $searchForm->addTagOpen('div')->addClass('toggle')->attr('aria-haspopup', 'true'); // render current $currentWrapper = $searchForm->addTagOpen('div')->addClass('current'); if ($baseNS) { @@ -330,7 +331,7 @@ class Search extends Ui $searchForm->addTagClose('div'); // render options list - $searchForm->addTagOpen('ul'); + $searchForm->addTagOpen('ul')->attr('aria-expanded', 'false'); $listItem = $searchForm->addTagOpen('li'); if ($baseNS) { @@ -431,7 +432,7 @@ class Search extends Ui } } - $searchForm->addTagOpen('div')->addClass('toggle'); + $searchForm->addTagOpen('div')->addClass('toggle')->attr('aria-haspopup', 'true'); // render current $currentWrapper = $searchForm->addTagOpen('div')->addClass('current'); if ($INPUT->has('dtb') || $INPUT->has('dta')) { @@ -441,7 +442,7 @@ class Search extends Ui $searchForm->addTagClose('div'); // render options list - $searchForm->addTagOpen('ul'); + $searchForm->addTagOpen('ul')->attr('aria-expanded', 'false'); foreach ($options as $key => $option) { $listItem = $searchForm->addTagOpen('li'); diff --git a/lib/scripts/search.js b/lib/scripts/search.js index b11aff755583b95b7f3125b928a1a7a668a8161f..c6171256fd242569d8d3633f2fe2109da9eca97b 100644 --- a/lib/scripts/search.js +++ b/lib/scripts/search.js @@ -7,12 +7,21 @@ jQuery(function () { } const $toggleAssistanceButton = $searchForm.find('button.toggleAssistant'); - if (!$toggleAssistanceButton.length){ + if (!$toggleAssistanceButton.length) { return; } $toggleAssistanceButton.on('click', function () { - jQuery('.advancedOptions').toggle(); + jQuery('.advancedOptions').toggle(0, function () { + var $me = jQuery(this); + if ($me.attr('aria-hidden')) { + $me.removeAttr('aria-hidden'); + $toggleAssistanceButton.attr('aria-expanded', 'true'); + } else { + $me.attr('aria-hidden', 'true'); + $toggleAssistanceButton.attr('aria-expanded', 'false'); + } + }); DokuCookie.setValue('sa', !DokuCookie.getValue('sa')); }); @@ -20,10 +29,16 @@ jQuery(function () { $toggleAssistanceButton.click(); } - $searchForm.find('.advancedOptions .toggle div.current').on('click', function() { + $searchForm.find('.advancedOptions .toggle div.current').on('click', function () { var $me = jQuery(this); $me.parent().siblings().removeClass('open'); + $me.parent().siblings().find('ul:first').attr('aria-expanded', 'false'); $me.parent().toggleClass('open'); + if ($me.parent().hasClass('open')) { + $me.parent().find('ul:first').attr('aria-expanded', 'true'); + } else { + $me.parent().find('ul:first').attr('aria-expanded', 'false'); + } }); });