From 028af35668244a22a4c50afb7c3c7586ca58d74b Mon Sep 17 00:00:00 2001
From: Vincent Vanwaelscappel <vincent@cubedesigners.com>
Date: Fri, 3 Jul 2020 20:18:50 +0200
Subject: [PATCH] fix #3756 @2

---
 .../fluidbook/fluidbook.audiodescription.js   |  5 +++++
 js/libs/fluidbook/fluidbook.bookmarks.js      |  4 ++--
 js/libs/fluidbook/fluidbook.l10n.js           | 21 +++++++++++++++++++
 js/libs/fluidbook/fluidbook.links.js          |  1 +
 js/libs/fluidbook/fluidbook.loader.js         |  1 +
 js/libs/fluidbook/fluidbook.menu.js           |  2 +-
 js/libs/fluidbook/fluidbook.nav.js            |  1 +
 js/libs/fluidbook/fluidbook.search.js         |  6 +++---
 js/libs/fluidbook/fluidbook.tooltip.js        |  2 +-
 .../fluidbook/links/fluidbook.links.zoom.js   |  2 +-
 10 files changed, 37 insertions(+), 8 deletions(-)

diff --git a/js/libs/fluidbook/fluidbook.audiodescription.js b/js/libs/fluidbook/fluidbook.audiodescription.js
index aeba6579..0f0e9bfa 100644
--- a/js/libs/fluidbook/fluidbook.audiodescription.js
+++ b/js/libs/fluidbook/fluidbook.audiodescription.js
@@ -24,9 +24,13 @@ function FluidbookAudioDescription(fluidbook) {
     this.buttonLeft = document.createElement('a');
     this.buttonLeft.setAttribute('class', this.buttonClass + ' left');
     this.buttonLeft.setAttribute('href', '#');
+    this.buttonLeft.setAttribute('role', 'button');
+    this.buttonLeft.setAttribute('aria-keyshortcuts', 'Ctrl+Shift+LeftArrow');
     this.buttonRight = document.createElement('a');
     this.buttonRight.setAttribute('class', this.buttonClass + ' right');
     this.buttonRight.setAttribute('href', '#');
+    this.buttonRight.setAttribute('role', 'button');
+    this.buttonRight.setAttribute('aria-keyshortcuts', 'Ctrl+Shift+RightArrow');
 
     if (this.audioSupport) {
         this.init();
@@ -46,6 +50,7 @@ FluidbookAudioDescription.prototype = {
 
         // Add tooltips
         buttons.attr('data-tooltip', this.fluidbook.l10n.__('listen to the page'));
+        buttons.attr('aria-label', this.fluidbook.l10n.__('listen to the page'));
 
         // Hide buttons by default - they will be shown if there is audio when setupPages() is run
         buttons.hide();
diff --git a/js/libs/fluidbook/fluidbook.bookmarks.js b/js/libs/fluidbook/fluidbook.bookmarks.js
index 3f199051..5be748e7 100644
--- a/js/libs/fluidbook/fluidbook.bookmarks.js
+++ b/js/libs/fluidbook/fluidbook.bookmarks.js
@@ -403,14 +403,14 @@ FluidbookBookmarks.prototype = {
         }
 
         bookmarks += "<a href=\"#\" class=\"bookmark " + side + "\" data-page=\"" + pageNr + "\"";
-        bookmarks += ' data-keyshortcuts="' + shortcut + '"'
+        bookmarks += ' aria-keyshortcuts="' + shortcut + '" role="button"'
         if (this.isBookmarked(pageNr)) {
             bookmarks += " data-enabled=\"enabled\"";
             bookmarks += " data-tooltip=\"" + this._txtRemove + "\"";
             bookmarks += " aria-label=\"" + this._txtRemove + "\"";
         } else {
             bookmarks += " data-tooltip=\"" + this._txtAdd + "\"";
-            bookmarks += " aria-label\"" + this._txtAdd + "\"";
+            bookmarks += " aria-label=\"" + this._txtAdd + "\"";
         }
 
         bookmarks += '>' + getSpriteIcon('bookmark-corner') + '</a>';
diff --git a/js/libs/fluidbook/fluidbook.l10n.js b/js/libs/fluidbook/fluidbook.l10n.js
index e29a49e9..63218e3f 100644
--- a/js/libs/fluidbook/fluidbook.l10n.js
+++ b/js/libs/fluidbook/fluidbook.l10n.js
@@ -22,6 +22,27 @@ FluidbookL10N.prototype = {
         }
     },
 
+    translateAttributes: function () {
+        var $this=this;
+        var attrs = ['data-tooltip', 'aria-label'];
+        var selectors = [];
+        $.each(attrs, function (k, attr) {
+            selectors.push('[' + attr + ']');
+        });
+
+        $(selectors.join(',')).each(function () {
+            var e = this;
+            $.each(attrs, function (k, attr) {
+                if ($(e).is('[' + attr + ']')) {
+                    var attrValue=$(e).attr(attr);
+                    if(attrValue.substr(0, 1) === '~'){
+                        $(e).attr(attr, $this.fluidbook.l10n.__(attrValue.substring(1)));
+                    }
+                }
+            })
+        });
+    },
+
     load: function () {
         this.dir = this.getLanguageDirection(this.getActiveLang());
         this.ltr = (this.dir == 'ltr');
diff --git a/js/libs/fluidbook/fluidbook.links.js b/js/libs/fluidbook/fluidbook.links.js
index bab33305..d3a6ab45 100644
--- a/js/libs/fluidbook/fluidbook.links.js
+++ b/js/libs/fluidbook/fluidbook.links.js
@@ -277,6 +277,7 @@ FluidbookLinks.prototype = {
             $this.fluidbook.initVideos();
             $this.initInlineSlideshows();
             $this.initAnimatedContentsLinks();
+            $this.fluidbook.l10n.translateAttributes();
         }, 200);
 
 
diff --git a/js/libs/fluidbook/fluidbook.loader.js b/js/libs/fluidbook/fluidbook.loader.js
index 8f4c3ecf..406d5658 100644
--- a/js/libs/fluidbook/fluidbook.loader.js
+++ b/js/libs/fluidbook/fluidbook.loader.js
@@ -664,6 +664,7 @@ FluidbookLoader.prototype = {
             callback();
         }
         var res = $(img);
+        $(res).attr('aria-hidden', true);
         if (page !== null) {
             $(res).attr('data-page', page);
             $("#loadedcontents").append(res);
diff --git a/js/libs/fluidbook/fluidbook.menu.js b/js/libs/fluidbook/fluidbook.menu.js
index e2f8257d..b4e0fc3d 100644
--- a/js/libs/fluidbook/fluidbook.menu.js
+++ b/js/libs/fluidbook/fluidbook.menu.js
@@ -273,7 +273,7 @@ FluidbookMenu.prototype = {
         } else {
             c = ' ' + c;
         }
-        return '<a href="#/closeview" aria-label="' + this.fluidbook.l10n.__('close') + '" aria-keyshortcuts="Escape" class="button back' + c + '">' + getSpriteIcon('interface-close') + '</a>';
+        return '<a href="#/closeview" role="button" aria-label="' + this.fluidbook.l10n.__('close') + '" aria-keyshortcuts="Escape" class="button back' + c + '">' + getSpriteIcon('interface-close') + '</a>';
     }
     ,
     openAudio: function (audio, callback) {
diff --git a/js/libs/fluidbook/fluidbook.nav.js b/js/libs/fluidbook/fluidbook.nav.js
index 3e4465cd..668b8e6f 100644
--- a/js/libs/fluidbook/fluidbook.nav.js
+++ b/js/libs/fluidbook/fluidbook.nav.js
@@ -188,6 +188,7 @@ FluidbookNav.prototype = {
             res += ' class="' + className + '"';
         }
 
+        res+=' role="button"';
         // Only the horizontal icon menu should have the tooltips
         if (help !== undefined && help !== '') {
             if (navType === 'horizontalNav') {
diff --git a/js/libs/fluidbook/fluidbook.search.js b/js/libs/fluidbook/fluidbook.search.js
index a6a4e70b..4315a728 100644
--- a/js/libs/fluidbook/fluidbook.search.js
+++ b/js/libs/fluidbook/fluidbook.search.js
@@ -66,11 +66,11 @@ FluidbookSearch.prototype = {
         html += '<div class="searchResultsNavQuery"></div>';
         html += '</div>'; // .searchResultsNavField
         html += '<div class="searchResultsNavArrows">';
-        html += '<div class="button searchResultsPrev" aria-label="' + this.fluidbook.l10n.__('previous result') + '" aria-keyshortcuts="Shift+F3"></div>';
+        html += '<div class="button searchResultsPrev" role="button" aria-label="' + this.fluidbook.l10n.__('previous result') + '" aria-keyshortcuts="Shift+F3"></div>';
         html += '<div class="searchResultsNavCounter"></div>';
-        html += '<div class="button searchResultsNext" aria-label="' + this.fluidbook.l10n.__('next result') + '" aria-keyshortcuts="F3"></div>';
+        html += '<div class="button searchResultsNext" role="button" aria-label="' + this.fluidbook.l10n.__('next result') + '" aria-keyshortcuts="F3"></div>';
         html += '</div>'; // .searchResultsNavArrows
-        html += '<div class="button searchResultsNavClose" aria-label="' + this.fluidbook.l10n.__('close') + '" aria-keyshortcuts="Escape">';
+        html += '<div class="button searchResultsNavClose" role="button" aria-label="' + this.fluidbook.l10n.__('close') + '" aria-keyshortcuts="Escape">';
         html += getSpriteIcon('interface-close');
         html += '</div>'; // .searchResultsNavClose
         html += '</div>'; // #searchResultsNav
diff --git a/js/libs/fluidbook/fluidbook.tooltip.js b/js/libs/fluidbook/fluidbook.tooltip.js
index 068450d8..356eb694 100644
--- a/js/libs/fluidbook/fluidbook.tooltip.js
+++ b/js/libs/fluidbook/fluidbook.tooltip.js
@@ -24,7 +24,7 @@ FluidbookTooltip.prototype = {
             $this.eventTriggered(this);
         });
 
-        $("body").append('<div id="tooltip"></div>');
+        $("body").append('<div id="tooltip" aria-hidden="true"></div>');
     },
 
     updateMousePosition: function (e) {
diff --git a/js/libs/fluidbook/links/fluidbook.links.zoom.js b/js/libs/fluidbook/links/fluidbook.links.zoom.js
index 68a485dd..ed88532e 100644
--- a/js/libs/fluidbook/links/fluidbook.links.zoom.js
+++ b/js/libs/fluidbook/links/fluidbook.links.zoom.js
@@ -214,7 +214,7 @@ FluidbookLinksZoom.prototype = {
                 }
                 menu += '</div></div>';
                 $groupWrapper.append('<div id="zoomPopupBackground"><div class="bg"></div></div>' + menu);
-                $groupWrapper.append('<a href="#" class="zoomPopupClose" aria-label="'+$this.fluidbook.l10n.__('close')+'" aria-keyshortcuts="Escape">' + getSpriteIcon('interface-close') + '</a>');
+                $groupWrapper.append('<a href="#" role="button" class="zoomPopupClose" aria-label="'+$this.fluidbook.l10n.__('close')+'" aria-keyshortcuts="Escape">' + getSpriteIcon('interface-close') + '</a>');
             }
 
             var z = $('#zoomPopup_' + zoomID),
-- 
2.39.5