]> _ Git - fluidbook-html5.git/commitdiff
wip #1710 @4
authorVincent Vanwaelscappel <vincent@cubedesigners.com>
Mon, 23 Oct 2017 17:15:06 +0000 (19:15 +0200)
committerVincent Vanwaelscappel <vincent@cubedesigners.com>
Mon, 23 Oct 2017 17:15:06 +0000 (19:15 +0200)
js/libs/fluidbook/fluidbook.interface.js [new file with mode: 0644]
js/libs/fluidbook/fluidbook.js
js/libs/fluidbook/fluidbook.nav.js
js/libs/fluidbook/fluidbook.pad.js
js/libs/fluidbook/fluidbook.resize.js

diff --git a/js/libs/fluidbook/fluidbook.interface.js b/js/libs/fluidbook/fluidbook.interface.js
new file mode 100644 (file)
index 0000000..6ec053c
--- /dev/null
@@ -0,0 +1,94 @@
+function FluidbookInterface(fluidbook) {
+    this.fluidbook = fluidbook;
+
+    this.interfaceVisible = false;
+    this.visibleTimeout;
+    this.visibleTime = 5000;
+    this.interfaceVisible = false;
+
+    this.init();
+}
+
+FluidbookInterface.prototype = {
+    init: function () {
+        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();
+    },
+
+    autoHideArrows: function () {
+        if (!this.fluidbook.resize.reduceHorizontalMargins()) {
+            return false;
+        }
+        return true;
+    },
+
+    initArrowsVisibilityManagement: function () {
+        var $this = this;
+        $(document).on('click', '.nonlinkarea', function () {
+            $this.toggleInterface();
+            return false;
+        });
+
+        $(this.fluidbook).on('fluidbook.ready', function () {
+            $this.resetTimeout();
+        });
+    },
+
+    toggleInterface: function () {
+        if (this.interfaceVisible) {
+            return this.hideInterface();
+        } else {
+            return this.displayInterface();
+        }
+    },
+    displayInterface: function () {
+        this.interfaceVisible = true;
+        this.getInterfaceSelector().addClass('visible');
+        this.resetTimeout();
+    },
+    resetTimeout: function () {
+        this.clearTimeout();
+        if (!this.autoHideArrows()) {
+            return false;
+        }
+        var $this = this;
+
+        this.visibleTimeout = setTimeout(function () {
+            $this.hideInterface();
+        }, this.visibleTime);
+    },
+    hideInterface: function () {
+        this.interfaceVisible = false;
+        if ($("#helpView").is(':visible') || document.activeElement.tagName.toLowerCase() === 'input') {
+            this.resetTimeout();
+            return;
+        }
+
+        this.getInterfaceSelector().css({opacity: 0}).delay(1100).css('visibility', 'hidden');
+        this.clearTimeout();
+    },
+
+    getInterfaceSelector: function () {
+        var selector = '#next,#previous';
+        if (this.fluidbook.pad.enabled) {
+            selector = 'header,#interface';
+        }
+        return $(selector);
+    },
+
+    clearTimeout: function () {
+        clearTimeout(this.visibleTimeout);
+    },
+};
\ No newline at end of file
index 12ef158457b56fb67815f7e87e9609ece5b821b5..ea5d0ea3adc5a6d7967e80c97031698f515327dc 100644 (file)
@@ -157,6 +157,7 @@ Fluidbook.prototype = {
         this.isReady = true;
         $("#main").css('display', 'block');
         this.nav = new FluidbookNav(this);
+        this.interface = new FluidbookInterface(this);
         this.slider = new FluidbookSlider(this);
         this.help = new FluidbookHelp(this);
         this.help.displayAtStartup();
index 23967d51add832a1fe0389b17a04dee48cf58dbd..3bc679f675f87836ed5adc49f57f1498f6a87287 100644 (file)
@@ -468,9 +468,7 @@ FluidbookNav.prototype = {
             // if (!visible) {
             //     $(link).addClass('hidden');
             // }
-        }
-
-        this.setInterface();
+        };
 
         if (navType == 'menu') {
 
@@ -705,24 +703,6 @@ FluidbookNav.prototype = {
 
     setInterface: function () {
 
-        // Ensure we don't add interface elements more than once
-        if (this._inited['interface'] == true) {
-            return;
-        }
-        this._inited['interface'] = true;
-
-        var res = '';
-        if ($('html').hasClass('ltr')) {
-            res += this.getLink('interface-previous', '#', 'previous', '', '', '', true);
-            res += this.getLink('interface-next', '#', 'next', '', '', '', true);
-        } else {
-            res += this.getLink('interface-previous', '#', 'next', '', '', '', true);
-            res += this.getLink('interface-next', '#', 'previous', '', '', '', true);
-        }
-
-        $('#interface').append(res);
-        $(document).on('click', '#next', goNextPage);
-        $(document).on('click', '#previous', goPreviousPage);
     },
 
     // Build nested lists from chapters
index 0474704f44c91bb4da70b9b197972f286dc24092..b4a85609c6b5aaf3252d3702b33448591a130b0a 100644 (file)
@@ -1,10 +1,7 @@
 function FluidbookPad(fluidbook) {\r
        this.fluidbook = fluidbook;\r
        this.enabled = this.fluidbook.datas.mobileNavigationType == 'tab';\r
-       this.tapHoldTimeout;\r
-       this.visibleTimeout;\r
-       this.visibleTime = 5000;\r
-       this.interfaceVisible = false;\r
+\r
        if (this.enabled) {\r
                this.init();\r
        }\r
@@ -28,43 +25,8 @@ FluidbookPad.prototype = {
                        }\r
                        return false;\r
                });\r
-\r
-               $(document).on('click', '.nonlinkarea', function() {\r
-                       $this.toggleInterface();\r
-                       return false;\r
-               });\r
-       },\r
-       toggleInterface: function() {\r
-               if (this.interfaceVisible) {\r
-                       return this.hideInterface();\r
-               } else {\r
-                       return this.displayInterface();\r
-               }\r
-       },\r
-       displayInterface: function() {\r
-               this.interfaceVisible = true;\r
-               $("header,#interface").css({visibility: 'visible', opacity: 1});\r
-               this.resetTimeout();\r
-       },\r
-       resetTimeout: function() {\r
-               var $this = this;\r
-               this.clearTimeout();\r
-               this.visibleTimeout = setTimeout(function() {\r
-                       $this.hideInterface();\r
-               }, this.visibleTime);\r
-       },\r
-       hideInterface: function() {\r
-               this.interfaceVisible = false;\r
-               if ($("#helpView").is(':visible') || document.activeElement.tagName.toLowerCase() === 'input') {\r
-                       this.resetTimeout();\r
-                       return;\r
-               }\r
-               $("header,#interface").css({opacity: 0}).delay(1100).css('visibility', 'hidden');\r
-               this.clearTimeout();\r
-       },\r
-       clearTimeout: function() {\r
-               clearTimeout(this.visibleTimeout);\r
        },\r
+\r
        getTransitionAxis: function(currentPage, nextPage) {\r
                var linkedPages = this.fluidbook.bookmarks.getLinkedPages(currentPage);\r
                if (linkedPages.indexOf(nextPage) == -1) {\r
index b9cdba688709e2e2d03e1bb81fa61450fdf310ee..2e0bb5f20b5993b24d4c667a8479fef492786bd3 100644 (file)
@@ -19,14 +19,23 @@ function FluidbookResize(fluidbook) {
 }
 
 FluidbookResize.prototype = {
+    reduceHorizontalMargins: function () {
+        return this.orientation == 'portrait' && this.fluidbook.support.isMobile && Modernizr.touch;
+    },
+
     setMargins: function () {
-        var marginX = 20;
         var marginY = 20;
 
+        var marginX = 60;
+        if (this.reduceHorizontalMargins()) {
+            marginX = 20;
+        }
+
         this.marginleft = marginX + parseInt(this.fluidbook.datas.extraXSpace);
         this.margintop = marginY + parseInt(this.fluidbook.datas.extraYSpace);
         this.marginbottom = marginY + 20;
-        this.marginright = marginX;
+        this.marginright = marginX + parseInt(this.fluidbook.datas.extraXSpace);
+
     },
 
     init: function () {
@@ -92,6 +101,7 @@ FluidbookResize.prototype = {
         });
 
         this.resizeView();
+        this.setMargins();
 
         var marginTop, marginBottom, marginLeft, marginRight;
 
@@ -110,7 +120,7 @@ FluidbookResize.prototype = {
             marginTop = (parseInt(this.fluidbook.datas.menuHeight) + this.margintop) * interfaceScale;
             marginBottom = (10 + this.marginbottom) * interfaceScale;
             marginLeft = (this.marginleft + parseInt(extraX)) * interfaceScale;
-            marginRight = marginLeft;
+            marginRight = (this.marginright + parseInt(extraX)) * interfaceScale;
         }
 
         var aw = this.ww - marginLeft - marginRight;