From: Vincent Vanwaelscappel <vincent@cubedesigners.com>
Date: Tue, 7 Jul 2020 16:43:36 +0000 (+0200)
Subject: fix #3719 @4
X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=18f82db1db28b68e52269e2611e29c95146fc744;p=fluidbook-html5.git

fix #3719 @4
---

diff --git a/_index.html b/_index.html
index 84bbd940..e684d753 100644
--- a/_index.html
+++ b/_index.html
@@ -17,8 +17,9 @@
             padding: 0;
             margin: 0;
         }
+
         body, html {
-            background-color:#<!-- $bgcolor -->;
+            background-color: # <!-- $ bgcolor -->;
             width: 100%;
             height: 100%;
         }
@@ -70,7 +71,8 @@
             <div id="flip3dcontainer" aria-hidden="true">
                 <canvas width="1024" height="1024"></canvas>
             </div>
-            <div id="fluidbook">
+            <main id="fluidbook">
+                <div id="accessible-contents"></div>
                 <div id="edges" aria-hidden="true">
                     <div class="edge left">
                         <div class="top"></div>
@@ -92,7 +94,7 @@
                     <div id="searchHighlights" aria-hidden="true"></div>
                     <div id="links"></div>
                 </div>
-            </div>
+            </main>
         </div>
     </div>
     <a id="down" href="#" aria-hidden="true"></a>
@@ -108,7 +110,8 @@
 <canvas id="pscanvas" width="4096" height="4096" aria-hidden="true"></canvas>
 <div id="loader" aria-hidden="true"></div>
 <div id="hiddencontents" aria-hidden="true"><!-- $hiddenContents --></div>
-<div id="splash" style="background-color:#<!-- $bgcolor -->;<!-- $splashstyles -->" aria-hidden="true"><!-- $splash --></div>
+<div id="splash" style="background-color:#<!-- $bgcolor -->;<!-- $splashstyles -->" aria-hidden="true">
+    <!-- $splash --></div>
 <div id="popinOverlay" aria-hidden="true"></div>
 <div id="landingPage"></div>
 <div id="loadedcontents" aria-hidden="true"></div>
diff --git a/js/libs/fluidbook/fluidbook.accessibility.js b/js/libs/fluidbook/fluidbook.accessibility.js
new file mode 100644
index 00000000..8c4780e3
--- /dev/null
+++ b/js/libs/fluidbook/fluidbook.accessibility.js
@@ -0,0 +1,48 @@
+function FluidbookAccessibility(fluidbook) {
+    this.fluidbook = fluidbook;
+
+    this.init();
+}
+
+FluidbookAccessibility.prototype = {
+    init: function () {
+        var $this = this;
+        this.audiodescription = new FluidbookAudioDescription(this.fluidbook);
+        $(this.fluidbook).on('fluidbook.page.change.end', function (e, data) {
+            $this.endChangePage(data);
+        });
+    },
+
+    endChangePage: function (page) {
+        // Handle audio descriptions
+        if (Modernizr.audio) {
+            this.audiodescription.setupPages();
+        }
+
+        this.updateTexts();
+
+    },
+
+    updateTexts: function () {
+        var $this = this;
+        var texts = [];
+        $.each(this.fluidbook.getDisplayedPages(), function (k, page) {
+            var t = $this.getAccessibleTextOfPage(page);
+            if (t !== false) {
+                texts.push(t);
+            }
+        });
+        $("#accessible-contents").html(texts.join(''));
+    },
+
+    getAccessibleTextOfPage: function (page) {
+        if (this.fluidbook.settings.accessibleTexts === undefined || this.fluidbook.settings.accessibleTexts === null) {
+            return false;
+        }
+        page = parseInt(page);
+        if (this.fluidbook.settings.accessibleTexts[page] === undefined || this.fluidbook.settings.accessibleTexts[page] === null) {
+            return false;
+        }
+        return '<section data-page="' + page + '">' + this.fluidbook.settings.accessibleTexts[page] + '</section>';
+    },
+}
\ No newline at end of file
diff --git a/js/libs/fluidbook/fluidbook.js b/js/libs/fluidbook/fluidbook.js
index 7c16acf5..b4e70176 100644
--- a/js/libs/fluidbook/fluidbook.js
+++ b/js/libs/fluidbook/fluidbook.js
@@ -69,7 +69,7 @@ Fluidbook.prototype = {
         this.video = new FluidbookVideo(this);
         this.bookmarks = new FluidbookBookmarks(this);
         this.tooltip = new FluidbookTooltip(this);
-        this.audiodescription = new FluidbookAudioDescription(this);
+        this.accessibility = new FluidbookAccessibility(this);
         this.sound = new FluidbookSound(this);
         this.slideshow = new FluidbookSlideshow(this);
         this.printing = new FluidbookPrint(this);
@@ -589,6 +589,19 @@ Fluidbook.prototype = {
         }
         return $(pageSide).data('page');
     },
+    getDisplayedPages: function () {
+        var res = [];
+        var left = this.getPhysicalPageNumberOfSide('left', true);
+        var right = this.getPhysicalPageNumberOfSide('right', true);
+        if (left !== false) {
+            res.push(left);
+        }
+        if (right !== false) {
+            res.push(right);
+        }
+        return res;
+    },
+
     getPageNumberOfSide: function (side, strict) {
         if (undefined === strict) {
             strict = false;
diff --git a/js/libs/fluidbook/fluidbook.pagetransitions.js b/js/libs/fluidbook/fluidbook.pagetransitions.js
index ef06dc61..6cfe8cb6 100644
--- a/js/libs/fluidbook/fluidbook.pagetransitions.js
+++ b/js/libs/fluidbook/fluidbook.pagetransitions.js
@@ -467,10 +467,7 @@ FluidbookPageTransition.prototype = {
             $("#down").css('opacity', 0);
         }
 
-        // Handle audio descriptions
-        if (Modernizr.audio) {
-            this.fluidbook.audiodescription.setupPages();
-        }
+
 
         setTimeout(function () {
             $this.transitionning = false;