From 581f405c146ade8c79aa48123d83b4565bd047fc Mon Sep 17 00:00:00 2001
From: LlGC-jop <jop@llgc.org.uk>
Date: Tue, 22 Oct 2024 12:29:47 +0100
Subject: [PATCH] Make accessible click function work with both space and
 enter, with options for anchor behaviour

---
 .../ContentLeftPanel.ts                        |  4 ++--
 .../iiif/modules/uv-shared-module/Panel.ts     | 18 +++++++++++++++---
 2 files changed, 17 insertions(+), 5 deletions(-)

diff --git a/src/content-handlers/iiif/modules/uv-contentleftpanel-module/ContentLeftPanel.ts b/src/content-handlers/iiif/modules/uv-contentleftpanel-module/ContentLeftPanel.ts
index 96d77efa0..6e7477788 100644
--- a/src/content-handlers/iiif/modules/uv-contentleftpanel-module/ContentLeftPanel.ts
+++ b/src/content-handlers/iiif/modules/uv-contentleftpanel-module/ContentLeftPanel.ts
@@ -211,11 +211,11 @@ export class ContentLeftPanel extends LeftPanel<ContentLeftPanelConfig> {
 
     this.onAccessibleClick(this.$treeButton, () => {
       this.openTreeView();
-    });
+    }, true, true);
 
     this.onAccessibleClick(this.$thumbsButton, () => {
       this.openThumbsView();
-    });
+    }, true, true);
 
     this.setTitle(this.content.title);
 
diff --git a/src/content-handlers/iiif/modules/uv-shared-module/Panel.ts b/src/content-handlers/iiif/modules/uv-shared-module/Panel.ts
index 0ba575fcf..9569673c3 100644
--- a/src/content-handlers/iiif/modules/uv-shared-module/Panel.ts
+++ b/src/content-handlers/iiif/modules/uv-shared-module/Panel.ts
@@ -36,18 +36,30 @@ export class Panel {
   onAccessibleClick(
     el: JQuery,
     callback: (e: JQueryEventObject) => void,
-    withClick = true
+    withClick = true,
+    anchorAsButton = false
   ) {
+
     if (withClick) {
       el.on("click", (e) => {
         callback(e);
       });
     }
-    el.on("keyup", (e) => {
-      if (e.keyCode === 32) {
+
+    el.on("keydown", (e) => {
+
+      // by passing anchorAsButton as true this will become false
+      // and so an anchor won't be excluded from Space presses
+      let isAnchor = e.target.nodeName === 'A' && !anchorAsButton;
+
+      // 13 = Enter, 32 = Space
+      if ((e.which === 32 && !isAnchor) || e.which === 13) {
+        // stops space scrolling the page
+        e.preventDefault();
         callback(e);
       }
     });
+
   }
 
   resize(): void {