From 04d8ee49bf8213946682ad298ca09049f66b3dbd Mon Sep 17 00:00:00 2001
From: Oliver Tacke <o.tacke@posteo.de>
Date: Thu, 22 Feb 2018 10:00:06 +0100
Subject: [PATCH] Make start button accessible

---
 js/questionset.js | 24 ++++++++++++++++++------
 1 file changed, 18 insertions(+), 6 deletions(-)

diff --git a/js/questionset.js b/js/questionset.js
index 55c43c2..d772f84 100644
--- a/js/questionset.js
+++ b/js/questionset.js
@@ -75,7 +75,7 @@ H5P.QuestionSet = function (options, contentId, contentData) {
           '  <% if (introPage.introduction) { %>' +
           '    <div class="introduction"><%= introPage.introduction %></div>' +
           '  <% } %>' +
-          '  <div class="buttons"><a class="qs-startbutton h5p-joubelui-button h5p-button"><%= introPage.startButtonText %></a></div>' +
+          '  <div class="buttons"><a class="qs-startbutton h5p-joubelui-button h5p-button" type="button" tabindex=0, aria-label="' + this.startButtonText +'"><%= introPage.startButtonText %></a></div>' +
           '</div>' +
           '<% } %>' +
           '<div tabindex="-1" class="qs-progress-announcer"></div>' +
@@ -767,6 +767,7 @@ H5P.QuestionSet = function (options, contentId, contentData) {
           if ($intro.length) {
             // Show intro
             $('.intro-page', $myDom).show();
+            $('.qs-startbutton', $myDom).focus();
           }
           else {
             // Show first question
@@ -951,11 +952,22 @@ H5P.QuestionSet = function (options, contentId, contentData) {
     // Allow other libraries to add transitions after the questions have been inited
     $('.questionset', $myDom).addClass('started');
 
-    $('.qs-startbutton', $myDom).click(function () {
-      $(this).parents('.intro-page').hide();
-      $('.questionset', $myDom).show();
-      _showQuestion(params.initialQuestion);
-    });
+    $('.qs-startbutton', $myDom)
+      .click(function () {
+        $(this).parents('.intro-page').hide();
+        $('.questionset', $myDom).show();
+        _showQuestion(params.initialQuestion);
+      })
+      .keydown(function (event) {
+        switch (event.which) {
+          case 13: // Enter
+          case 32: // Space
+            $(this).parents('.intro-page').hide();
+            $('.questionset', $myDom).show();
+            _showQuestion(params.initialQuestion);
+            event.preventDefault();
+          }
+      });
 
     /**
      * Triggers changing the current question.