Various fixed to improve tab focus on the search filter

doxygen · Jul 31, 2023 · 8e62a1e · 8e62a1e
1 parent afb7ea7
commit 8e62a1e
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 22 deletions.
diff --git a/src/htmlgen.cpp b/src/htmlgen.cpp
@@ -75,9 +75,8 @@ static void writeClientSearchBox(TextStream &t,const QCString &relPath)
 {
   t << "        <div id=\"MSearchBox\" class=\"MSearchBoxInactive\">\n";
   t << "        <span class=\"left\">\n";
-  t << "          <span id=\"MSearchSelect\" tabindex=\"0\" ";
+  t << "          <span id=\"MSearchSelect\" ";
   t << "               onmouseover=\"return searchBox.OnSearchSelectShow()\" ";
-  t << "               onclick=\"return searchBox.OnSearchSelectShow()\" ";
   t << "               onmouseout=\"return searchBox.OnSearchSelectHide()\">&#160;</span>\n";
   t << "          <input type=\"text\" id=\"MSearchField\" value=\"\" placeholder=\""
     << theTranslator->trSearch() << "\" accesskey=\"S\"\n";
@@ -1456,7 +1455,7 @@ void HtmlGenerator::writeSearchInfoStatic(TextStream &t,const QCString &)
   if (searchEngine && !serverBasedSearch)
   {
     t << "<!-- window showing the filter options -->\n";
-    t << "<div id=\"MSearchSelectWindow\" tabindex=\"0\"\n";
+    t << "<div id=\"MSearchSelectWindow\"\n";
     t << "     onmouseover=\"return searchBox.OnSearchSelectShow()\"\n";
     t << "     onmouseout=\"return searchBox.OnSearchSelectHide()\"\n";
     t << "     onkeydown=\"return searchBox.OnSearchSelectKey(event)\">\n";

diff --git a/templates/html/htmlbase.tpl b/templates/html/htmlbase.tpl
@@ -217,7 +217,7 @@ $(document).ready(function(){initNavTree('{{ page.fileName }}{% if page_postfix
 {% block searchInfo %}
 {% if config.SEARCHENGINE and not config.SERVER_BASED_SEARCH %}
 <!-- window showing the filter options -->
-<div id="MSearchSelectWindow tabindex="0""
+<div id="MSearchSelectWindow"
      onmouseover="return searchBox.OnSearchSelectShow()"
      onmouseout="return searchBox.OnSearchSelectHide()"
      onkeydown="return searchBox.OnSearchSelectKey(event)">

diff --git a/templates/html/search.js b/templates/html/search.js
@@ -99,7 +99,6 @@ function SearchBox(name, resultsPath, extension)
   this.searchIndex           = 0;
   this.searchActive          = false;
   this.extension             = extension;
-  this.ignoreNextEscKeyUp    = false;
 
   // ----------- DOM Elements
 
@@ -197,11 +196,6 @@ function SearchBox(name, resultsPath, extension)
     else if (e.keyCode==27) // Escape out of the search field
     {
       e.stopPropagation();
-      if (this.ignoreNextEscKeyUp)
-      {
-        this.ignoreNextEscKeyUp = false;
-        return;
-      }
       this.DOMSearchField().blur();
       this.DOMPopupSearchResultsWindow().style.display = 'none';
       this.DOMSearchClose().style.display = 'none';
@@ -297,10 +291,6 @@ function SearchBox(name, resultsPath, extension)
     else if (e.keyCode==13 || e.keyCode==27)
     {
       e.stopPropagation();
-      if (e.keyCode==27)
-      {
-        this.ignoreNextEscKeyUp = true;
-      }
       this.OnSelectItem(this.searchIndex);
       this.CloseSelectionWindow();
       this.DOMSearchField().focus();
@@ -314,7 +304,6 @@ function SearchBox(name, resultsPath, extension)
   this.CloseResultsWindow = function()
   {
     this.DOMPopupSearchResultsWindow().style.display = 'none';
-    this.DOMPopupSearchResultsWindow().style.tabindex = '-1';
     this.DOMSearchClose().style.display = 'none';
     this.Activate(false);
   }
@@ -821,6 +810,7 @@ function createResults(resultsPath)
 function init_search()
 {
   var results = document.getElementById("MSearchSelectWindow");
+  results.tabIndex=0;
   for (var key in indexSectionLabels)
   {
     var link = document.createElement('a');
@@ -832,19 +822,17 @@ function init_search()
   }
   searchBox.OnSelectItem(0);
 
-
   var input = document.getElementById("MSearchSelect");
   var searchSelectWindow = document.getElementById("MSearchSelectWindow");
-
-  input.addEventListener("keypress", function(event) {
-    if (event.key === "Enter") {
+  input.tabIndex=0;
+  input.addEventListener("keydown", function(event) {
+    if (event.keyCode==13 || event.keyCode==40) {
       event.preventDefault();
       if (searchSelectWindow.style.display == 'block') {
-        this.CloseSelectionWindow();
-        this.DOMSearchField().focus();
+        searchBox.CloseSelectionWindow();
       } else {
         searchBox.OnSearchSelectShow();
-        searchSelectWindow.focus();
+        searchBox.DOMSearchSelectWindow().focus();
       }
     }
   });