From: Vincent Vanwaelscappel <vincent@cubedesigners.com>
Date: Wed, 4 Sep 2019 13:32:03 +0000 (+0200)
Subject: wip #3000 @0:20
X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=01f699be423b2e91671bb230cb954963dbfe66c9;p=fluidbook-html5.git

wip #3000 @0:20
---

diff --git a/js/libs/fluidbook/fluidbook.help.js b/js/libs/fluidbook/fluidbook.help.js
index ff76a9f5..05f5f579 100644
--- a/js/libs/fluidbook/fluidbook.help.js
+++ b/js/libs/fluidbook/fluidbook.help.js
@@ -68,7 +68,7 @@ FluidbookHelp.prototype = {
 
         $(tooltips).each(function () {
             var text = $(this).data('tooltip');
-            if (text == null || text == undefined || text == '' || $(this).hasClass('hidden')) {
+            if (text === null || text === undefined || text === '' || $(this).hasClass('hidden')) {
                 return;
             }
 
@@ -100,22 +100,26 @@ FluidbookHelp.prototype = {
         help += '</div>';
 
         // Interface
-        var next = this.fluidbook.l10n.__('next double page');
-        var previous = this.fluidbook.l10n.__('previous double page');
-        if (this.fluidbook.pad.enabled) {
-            next = this.fluidbook.l10n.__('next chapter');
-            previous = this.fluidbook.l10n.__('previous chapter');
-        }
-        if (this.fluidbook.mobilefirst.enabled) {
-            var next = this.fluidbook.l10n.__('next page');
-            var previous = this.fluidbook.l10n.__('previous page');
+        if (this.fluidbook.interface.arrowsEnabled) {
+            var next = this.fluidbook.l10n.__('next double page');
+            var previous = this.fluidbook.l10n.__('previous double page');
+            if (this.fluidbook.pad.enabled) {
+                next = this.fluidbook.l10n.__('next chapter');
+                previous = this.fluidbook.l10n.__('previous chapter');
+            }
+            if (this.fluidbook.mobilefirst.enabled) {
+                var next = this.fluidbook.l10n.__('next page');
+                var previous = this.fluidbook.l10n.__('previous page');
+            }
         }
 
         help += '<div class="interface">';
-        help += '<div class="next">' + next + '</div>';
-        help += '<div class="last">' + this.fluidbook.l10n.__('last page') + '</div>';
-        help += '<div class="previous">' + previous + '</div>';
-        help += '<div class="first">' + this.fluidbook.l10n.__('frontpage') + '</div>';
+        if (this.fluidbook.interface.arrowsEnabled) {
+            help += '<div class="next">' + next + '</div>';
+            help += '<div class="last">' + this.fluidbook.l10n.__('last page') + '</div>';
+            help += '<div class="previous">' + previous + '</div>';
+            help += '<div class="first">' + this.fluidbook.l10n.__('frontpage') + '</div>';
+        }
         if ($("#slider").length > 0) {
             help += '<div class="slider"><span>' + this.fluidbook.l10n.__('drag handle to switch page') + '</span></div>';
         }
@@ -216,32 +220,36 @@ FluidbookHelp.prototype = {
 
         // ToDo: access variables from fluidbook.resize.* if they're not passed to the function. So resize function can be called directly...
 
-        var $this = this,
-            dir = this.fluidbook.l10n.dir,
-            menuHeightScaled = (this.fluidbook.datas.menuHeight) * navScale,
-            arrow = $('#interface #next').get(0).getBoundingClientRect(), // Used for calculating offsets for both #next & #previous
-            nextTop,
-            firstTop;
-
-        // The arrow element contains both arrows in a single image
-        // so we calculate the top position of the labels by percentage
-        nextTop = Math.round(arrow.top + arrow.height * 0.35);
-        firstTop = Math.round(arrow.top + arrow.height * 0.71);
-
-        // Navigation arrow labels
-        this.view.find('.previous, .next').css({
-            top: nextTop
-        });
-        this.view.find('.first, .last').css({
-            top: firstTop
-        });
-
-        // Labels are swapped for RTL documents
-        var prevPosition = (dir === 'ltr') ? {left: Math.round(arrow.width)} : {right: Math.round(arrow.width)},
-            nextPosition = (dir === 'ltr') ? {right: Math.round(arrow.width)} : {left: Math.round(arrow.width)};
-
-        this.view.find('.previous, .first').css(prevPosition);
-        this.view.find('.next, .last').css(nextPosition);
+        var $this = this;
+        var dir = this.fluidbook.l10n.dir;
+        var menuHeightScaled = (this.fluidbook.datas.menuHeight) * navScale;
+        var nextTop;
+        var firstTop;
+
+
+        if (this.fluidbook.interface.arrowsEnabled) {
+            var arrow = $('#interface #next').get(0).getBoundingClientRect(); // Used for calculating offsets for both #next & #previous
+            // The arrow element contains both arrows in a single image
+            // so we calculate the top position of the labels by percentage
+            nextTop = Math.round(arrow.top + arrow.height * 0.35);
+            firstTop = Math.round(arrow.top + arrow.height * 0.71);
+
+            // Navigation arrow labels
+
+            this.view.find('.previous, .next').css({
+                top: nextTop
+            });
+            this.view.find('.first, .last').css({
+                top: firstTop
+            });
+
+            // Labels are swapped for RTL documents
+            var prevPosition = (dir === 'ltr') ? {left: Math.round(arrow.width)} : {right: Math.round(arrow.width)},
+                nextPosition = (dir === 'ltr') ? {right: Math.round(arrow.width)} : {left: Math.round(arrow.width)};
+
+            this.view.find('.previous, .first').css(prevPosition);
+            this.view.find('.next, .last').css(nextPosition);
+        }
 
         // Slider label
         if ($("#slider").length > 0) {
diff --git a/js/libs/fluidbook/fluidbook.interface.js b/js/libs/fluidbook/fluidbook.interface.js
index 6d9701ae..736826f3 100644
--- a/js/libs/fluidbook/fluidbook.interface.js
+++ b/js/libs/fluidbook/fluidbook.interface.js
@@ -6,6 +6,8 @@ function FluidbookInterface(fluidbook) {
     this.visibleTime = 5000;
     this.interfaceVisible = false;
 
+    this.arrowsEnabled = this.fluidbook.datas.arrowsEnabled;
+
     this.maskToggleEventsTimeout = Date.now();
 
     this.init();
@@ -14,24 +16,27 @@ function FluidbookInterface(fluidbook) {
 FluidbookInterface.prototype = {
     init: function () {
         var $this = this;
-        var res = '';
-        if ($('html').hasClass('ltr')) {
-            res += this.fluidbook.nav.getLink('interface-previous', '#', 'previous', '', '', '', true);
-            res += this.fluidbook.nav.getLink('interface-next', '#', 'next', '', '', '', true);
-        } else {
-            res += this.fluidbook.nav.getLink('interface-previous', '#', 'next', '', '', '', true);
-            res += this.fluidbook.nav.getLink('interface-next', '#', 'previous', '', '', '', true);
-        }
 
-        $('#interface').append(res);
-        $(document).on('click', '#next', goNextPage);
-        $(document).on('click', '#previous', goPreviousPage);
+        if (this.arrowsEnabled) {
+            var res = '';
+            if ($('html').hasClass('ltr')) {
+                res += this.fluidbook.nav.getLink('interface-previous', '#', 'previous', '', '', '', true);
+                res += this.fluidbook.nav.getLink('interface-next', '#', 'next', '', '', '', true);
+            } else {
+                res += this.fluidbook.nav.getLink('interface-previous', '#', 'next', '', '', '', true);
+                res += this.fluidbook.nav.getLink('interface-next', '#', 'previous', '', '', '', true);
+            }
+
+            $('#interface').append(res);
+            $(document).on('click', '#next', goNextPage);
+            $(document).on('click', '#previous', goPreviousPage);
+
+            this.initArrowsVisibilityManagement();
+        }
 
         $(this.fluidbook).on('fluidbook.resize, fluidbook.resize.orientation', function () {
             $this.checkHidden();
         });
-
-        this.initArrowsVisibilityManagement();
     },
 
     checkHidden: function () {
@@ -48,7 +53,7 @@ FluidbookInterface.prototype = {
     },
 
     autoHideArrows: function () {
-        var res = this.fluidbook.resize.reduceHorizontalMargins() && this.areArrowsOverlapingPublication() && ($("#helpView:visible").length === 0);
+        var res = this.arrowsEnabled && this.fluidbook.resize.reduceHorizontalMargins() && this.areArrowsOverlapingPublication() && ($("#helpView:visible").length === 0);
         return res;
     },
 
@@ -140,7 +145,10 @@ FluidbookInterface.prototype = {
     },
 
     getInterfaceSelector: function () {
-        var selector = '#next,#previous';
+        var selector = '';
+        if (this.arrowsEnabled) {
+            selector = '#next,#previous'
+        }
         if (this.fluidbook.pad.enabled) {
             selector = 'header,#interface';
         }
diff --git a/js/libs/fluidbook/fluidbook.js b/js/libs/fluidbook/fluidbook.js
index bf13f818..696df85b 100644
--- a/js/libs/fluidbook/fluidbook.js
+++ b/js/libs/fluidbook/fluidbook.js
@@ -101,6 +101,7 @@ Fluidbook.prototype = {
 
         this.contentlock.init();
 
+        this.interface = new FluidbookInterface(this);
         this.resize = new FluidbookResize(this);
         this.pagetransitions = new FluidbookPageTransition(this);
         this.stats = new FluidbookStats(this);
@@ -266,7 +267,6 @@ Fluidbook.prototype = {
         $("#main").css('display', 'block');
 
         this.nav = new FluidbookNav(this);
-        this.interface = new FluidbookInterface(this);
         if (!this.mobilefirst.enabled) {
             this.slider = new FluidbookSlider(this);
         }
diff --git a/js/libs/fluidbook/fluidbook.resize.js b/js/libs/fluidbook/fluidbook.resize.js
index fee8ab76..3f3d883a 100644
--- a/js/libs/fluidbook/fluidbook.resize.js
+++ b/js/libs/fluidbook/fluidbook.resize.js
@@ -55,13 +55,15 @@ FluidbookResize.prototype = {
             origin: [right, '100%']
         });
 
-        $("#next").transform({
-            origin: [right, '50%']
-        });
+        if(this.fluidbook.interface.arrowsEnabled) {
+            $("#next").transform({
+                origin: [right, '50%']
+            });
 
-        $("#previous").transform({
-            origin: [left, '50%']
-        });
+            $("#previous").transform({
+                origin: [left, '50%']
+            });
+        }
 
         if (this.fluidbook.support.android || this.fluidbook.support.iOS) {
             $(document).on('blur focus', 'input', function () {
@@ -224,13 +226,14 @@ FluidbookResize.prototype = {
             }
         }
 
-        $("#next").transform({
-            scale: cssInterfaceScale,
-        });
-
-        $("#previous").transform({
-            scale: cssInterfaceScale,
-        });
+        if(this.fluidbook.interface.arrowsEnabled) {
+            $("#next").transform({
+                scale: cssInterfaceScale,
+            });
+            $("#previous").transform({
+                scale: cssInterfaceScale,
+            });
+        }
 
         // Position audio buttons relative to book size and position
         var audioButtonPosition = Math.max(this.hh / 6, 30 * interfaceScale); // Ensure at least 30px clearance at the bottom
@@ -314,22 +317,27 @@ FluidbookResize.prototype = {
             fluidbookrect: $("#fluidbook").get(0).getBoundingClientRect(),
 
         };
-        try {
-            data.arrowLeftRect = $("#previous").get(0).getBoundingClientRect();
-            data.arrowRightRect = $("#next").get(0).getBoundingClientRect();
-        } catch (e) {
 
+        if(this.fluidbook.interface.arrowsEnabled) {
+            try {
+                data.arrowLeftRect = $("#previous").get(0).getBoundingClientRect();
+                data.arrowRightRect = $("#next").get(0).getBoundingClientRect();
+            } catch (e) {
+
+            }
         }
         $(this.fluidbook).trigger('fluidbook.resize', data);
 
     },
     resizeNav: function (interfaceScale) {
         var $this = this;
-        var topNext = (this.hh - (100 * interfaceScale)) / 2;
-        $("#next,#previous").css({
-            top: topNext
-        });
-        $("#next,#previous").show();
+        if(this.fluidbook.interface.arrowsEnabled) {
+            var topNext = (this.hh - (100 * interfaceScale)) / 2;
+            $("#next,#previous").css({
+                top: topNext
+            });
+            $("#next,#previous").show();
+        }
 
         if ($("#afterSearch:visible").length == 1) {
             setTimeout(function () {