From: Vincent Vanwaelscappel <vincent@cubedesigners.com>
Date: Wed, 7 Oct 2020 15:22:38 +0000 (+0200)
Subject: done #3932 @4
X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=f36113676dce2afddea19bfc7bfbef2b5726b6a4;p=fluidbook-html5.git

done #3932 @4
---

diff --git a/js/libs/fluidbook/fluidbook.3dflip.js b/js/libs/fluidbook/fluidbook.3dflip.js
index 4b1a29d7..eaf67edd 100644
--- a/js/libs/fluidbook/fluidbook.3dflip.js
+++ b/js/libs/fluidbook/fluidbook.3dflip.js
@@ -17,6 +17,9 @@ function Fluidbook3DFlip(fluidbook) {
     this._progressAnimation = 0;
     this._pageRotation = 0;
     this._callbackAfterNextRender = null;
+    this._gapOffset = 0;
+    this.jcontainerLeft = 0;
+
     this.ready = false;
     this.performancesTestRunning = true;
     this.performancesFrames = 0;
@@ -418,6 +421,7 @@ Fluidbook3DFlip.prototype = {
         var force = 0.65 * this.bendForceMultiplicator * 1.15;
         var easeOut = Power0.easeOut;
         var easeIn = Power0.easeIn;
+        var noease = Linear.easeNone;
 
         this.tlright = new TimelineMax();
         this.tlright.add(TweenMax.fromTo(this.bend, .5, {force: 0}, {
@@ -429,6 +433,7 @@ Fluidbook3DFlip.prototype = {
             _pageRotation: -180,
             ease: easeIn
         }), 0);
+        this.tlright.add(TweenMax.fromTo(this, 1, {_gapOffset: -0.5}, {_gapOffset: 1.2, ease: noease}), 0);
         this.tlright.pause();
         this.tlright.progress(0);
 
@@ -442,6 +447,7 @@ Fluidbook3DFlip.prototype = {
             _pageRotation: -0,
             ease: easeIn
         }), 0);
+        this.tlleft.add(TweenMax.fromTo(this, 1, {_gapOffset: 1.2}, {_gapOffset: -0.5, ease: easeOut}), 0);
         this.tlleft.pause();
         this.tlleft.progress(0);
     },
@@ -678,6 +684,15 @@ Fluidbook3DFlip.prototype = {
             this.modifier && this.modifier.apply();
         }
 
+
+        if (visible) {
+            var offset = 0;
+            if (this.jcontainerWidth <= 1300 || this.jcontainerHeight <= 1300) {
+                var m = 1;
+                offset = this._gapOffset * m;
+            }
+            this.jcontainer.css({left: this.jcontainerLeft + offset});
+        }
         this.setJContainerVisibility(visible);
 
         if (this._callbackAfterNextRender !== null) {
@@ -716,10 +731,12 @@ Fluidbook3DFlip.prototype = {
         }
 
         var fw = $("#fluidbook").get(0).getBoundingClientRect();
-        var left = (this.pw - fw.width) / 2;
+        this.jcontainerLeft = (this.pw - fw.width) / 2;
+        this.jcontainerWidth = fw.width;
+        this.jcontainerHeight = fw.height;
 
-        this.jcontainer.css({left: left, width: fw.width, height: this.ph});
-        this.jcontainer.find('canvas').css({left: -left, width: this.pw, height: this.ph});
+        this.jcontainer.css({left: this.jcontainerLeft, width: fw.width, height: this.ph});
+        this.jcontainer.find('canvas').css({left: -this.jcontainerLeft, width: this.pw, height: this.ph});
         if (null !== THREE) {
             this.renderer.setSize(this.pw, this.ph);
             this.guessCameraZoom();
diff --git a/js/libs/fluidbook/fluidbook.loader.js b/js/libs/fluidbook/fluidbook.loader.js
index 148cdb4b..99ff5019 100644
--- a/js/libs/fluidbook/fluidbook.loader.js
+++ b/js/libs/fluidbook/fluidbook.loader.js
@@ -450,7 +450,7 @@ FluidbookLoader.prototype = {
                     $this._preloadPage(page, callback);
                     return;
                 }
-                ctx.drawImage(img, 0, 0, d, d);
+                ctx.drawImage(img, -1, 0, d+2, d);
             } catch (e) {
             }
         }