From 42a99cf83d0e5add52d03205e5d16948a34b4379 Mon Sep 17 00:00:00 2001
From: Martin Renvoize <martin.renvoize@ptfs-europe.com>
Date: Wed, 22 Jul 2020 13:28:44 +0100
Subject: [PATCH] Bug 26041: Enable keyboard navigation without 'ctrl'

This patch enables keyboard navigation using the arrow keys without the
need to hold the control key for the jQuery UI datepicker.

Test plan
1/ Navigate to an item in the opac and attempt to place a hold
2/ On the resultant screen, use keyboard navigation to trigger the 'Show
more options' dropdown.
3/ Focus on one of the date inputs using keyboard navigation.
4/ Use 'ctrl + arrow' keys to navigate the datepicker.
5/ Note that prior to the patch using 'bare' arrow keys does not trigger
anything
6/ Apply the patch and confirm that the datepicker can now be naviated
using the arrow keys without holding the ctrl key.
7/ Confirm that using the ctrl key combinations continue to work as
expected too.
8/ Signoff

Signed-off-by: Brandon J <brandon.jimenez@inLibro.com>

Signed-off-by: Owen Leonard <oleonard@myacpl.org>

Signed-off-by: Nick Clemens <nick@bywatersolutions.com>

Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
(cherry picked from commit be92f7e79ce093e251c2489408dce3077f782c0d)

Signed-off-by: Lucas Gass <lucas@bywatersolutions.com>
(cherry picked from commit 09b5ffe12178894946176588e81d6a1136bce710)

Signed-off-by: Aleisha Amohia <aleishaamohia@hotmail.com>
---
 .../opac-tmpl/bootstrap/en/includes/calendar.inc | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/includes/calendar.inc b/koha-tmpl/opac-tmpl/bootstrap/en/includes/calendar.inc
index 83d67c9855..f74e92ed7e 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/includes/calendar.inc
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/includes/calendar.inc
@@ -80,5 +80,21 @@
                 }
             });
         });
+
+        // jQuery Datepicker - a11y: Map arrow keys
+        var doKeyDown = $.datepicker._doKeyDown
+        $.extend($.datepicker, {
+            _doKeyDown: function(event) {
+                if (event.which === $.ui.keyCode.LEFT ||
+                    event.which === $.ui.keyCode.RIGHT ||
+                    event.which === $.ui.keyCode.UP ||
+                    event.which === $.ui.keyCode.DOWN) {
+                    event.ctrlKey = true;
+                    doKeyDown(event);
+                } else {
+                    doKeyDown(event);
+                }
+            }
+        });
     //]]>
 </script>
-- 
2.39.5