refs #24792 [fid_adlr] remove inline script

* move chevron-down into svg
* move inline script into js head script section
** on delegate keydown to click
** move focus
** remove legacy lang switcher
* close menu toggler on escape
* remove debugger

themes/fid_adlr/images/chevron-down.svg

+<svg xmlns="http://www.w3.org/2000/svg" version="1.1" x="12px" y="0px" width="24px" height="3px" viewBox="0 0 6 3" enable-background="new 0 0 6 3" xml:space="preserve"><polygon points="5.992,0 2.992,3 -0.008,0 "/></svg>
\ No newline at end of file

themes/fid_adlr/scss/components/_forms.scss

@@ -38,8 +38,7 @@ form {
 
   select,
   #advSearchForm select {
-    // FIXME: change background-image to chevron-down as svg
-    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeD0iMTJweCIgeT0iMHB4IiB3aWR0aD0iMjRweCIgaGVpZ2h0PSIzcHgiIHZpZXdCb3g9IjAgMCA2IDMiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDYgMyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHBvbHlnb24gcG9pbnRzPSI1Ljk5MiwwIDIuOTkyLDMgLTAuMDA4LDAgIi8+PC9zdmc+);
+    background-image: url('../images/chevron-down.svg');
   }
 
   // Change Autocomplete styles in Chrome

themes/fid_adlr/templates/header.phtml

@@ -142,8 +142,7 @@
                data-toggle="dropdown"
                tabindex="3"
                aria-controls="langmenu"
-               aria-expanded="false"
-               onkeydown="forceFocus('#langmenu li a')">
+               aria-expanded="false">
               <span class="sr-only">Toggle language</span>
               <span class="decorate"><?= $this->layout()->userLang ?></span>
               <i class="icon icon-chevron-down" aria-hidden="true"></i>
@@ -154,8 +153,7 @@
               <?php foreach ($this->layout()->allLangs as $langCode => $langName): ?>
                 <li<?= $this->layout()->userLang == $langCode ? ' class="active"' : '' ?>>
                   <?php $fullLangName = $this->displayLanguageOption($langName); ?>
-                  <a class="btn" href="#"
-                    <?= $this->layout()->userLang != $langCode ? 'onClick="document.langForm.mylang.value=\'' . $langCode . '\';document.langForm.submit()"' : '' ?>>
+                  <a class="btn" href="<?=$this->escapeHtmlAttr($this->url()->addQueryParameters(['lng' => $langCode])) ?>" rel="nofollow">
                     <?= $fullLangName ? ($this->layout()->userLang != $langCode ? $this->transEsc($fullLangName) : $fullLangName) : $langCode ?>
                   </a>
                 </li>
@@ -173,7 +171,6 @@
       <div>
         <a class="navbar-header-link collapsed"
            id="submenuToggler"
-           onkeydown='clickElementOnKeyDown(event, "#submenuToggler"); forceFocus(".submenu-collapse li a")'
            tabindex="4"
            data-toggle="collapse"
            data-target="header, #submenu, #language-dropdown, #register-menu">
@@ -229,8 +226,7 @@
               <li class="visible-xs visible-sm visible-md submenu-additionals-lang" >
                <?php foreach ($this->layout()->allLangs as $langCode => $langName): ?>
                 <?php $fullLangName = $this->displayLanguageOption($langName); ?>
-                <a href="#"
-                  <?= $this->layout()->userLang != $langCode ? 'onClick="document.langForm.mylang.value=\'' . $langCode . '\';document.langForm.submit()"' : '' ?>>
+                <a href="<?=$this->escapeHtmlAttr($this->url()->addQueryParameters(['lng' => $langCode])) ?>" rel="nofollow">
                   <span <?= $this->layout()->userLang == $langCode ? ' class="active"' : '' ?>><?= $fullLangName ? ($this->layout()->userLang != $langCode ? $this->transEsc($fullLangName) : $fullLangName) : $langCode ?></span>
                 </a>
                 <?php endforeach; ?>
@@ -298,6 +294,25 @@
 				$('#language-dropdown').collapse('hide');
 			}
 		});
+    
+    // #17913, catch keydown and move focus
+    $('#quickfilter-language').on('keydown', function(){
+        forceFocus('#langmenu li a')
+    });
+  
+    // #17913, catch keydown: delegate click and move focus
+    $("#submenuToggler").on('keydown', function(){
+      clickElementOnKeyDown(event, "#submenuToggler");
+      forceFocus(".submenu-collapse li a");
+    });
+
+    // #24792 handle esc for closing toggler
+    $("#submenu .submenu-collapse").on('keydown', function() {
+        if (event.key === 'Escape') {
+          document.getElementById("submenuToggler").click();
+          forceFocus("#submenuToggler");
+        }
+    });
 	});
 
 	function clickElementOnKeyDown(event, elementId) {

themes/fid_adlr/templates/search/searchTabs.phtml

@@ -45,7 +45,7 @@
             <?php endif; ?>
           />
           <?php $id = "filter-" . str_replace(' ', '', $tab['label']); ?>
-          <label tabindex="0" onkeydown="clickElementOnKeyDown(event, '#<?=$id?>');" for="<?=$id?>"><?= $this->transEsc($tab['label']) ?></label>
+          <label tabindex="0" for="<?=$id?>"><?= $this->transEsc($tab['label']) ?></label>
         <?php elseif ($block = $this->permission()->getAlternateContent($tab['permission'])): ?>
           <input type="radio" id="filter-<?= str_replace(' ', '', $tab['label']) . '_permission_denied' ?>" disabled />
           <label tabindex="0" for="filter-<?= str_replace(' ', '', $tab['label']) . '_permission_denied' ?>"><?=$block?></label>
@@ -88,6 +88,11 @@
 
             return true;
         });
+        
+        // #17913; delegate keydown on filter-option-lable as click event to real input
+        $(".filter-option label").on('keydown', function() {
+            clickElementOnKeyDown(event, '#' + $(this).attr('for'));
+        });
     });
 JS;
 ?>