From: Vincent Vanwaelscappel <vincent@cubedesigners.com>
Date: Fri, 27 Jul 2018 15:44:29 +0000 (+0200)
Subject: wip #809 @6
X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=913a5bfe3b84c6d6395ac440a0e3292ec718bb46;p=fluidbook-html5.git

wip #809 @6
---

diff --git a/js/libs/fluidbook/fluidbook.3dflip.js b/js/libs/fluidbook/fluidbook.3dflip.js
index d628ea4d..a25b4d87 100644
--- a/js/libs/fluidbook/fluidbook.3dflip.js
+++ b/js/libs/fluidbook/fluidbook.3dflip.js
@@ -18,7 +18,7 @@ function Fluidbook3DFlip(fluidbook) {
     this._progressAnimation = 0;
     this._pageRotation = 0;
     this.ready = false;
-    this.animationTime = parseFloat(this.fluidbook.datas.mobileTransitionDuration);
+    this.animationTime = parseFloat(this.fluidbook.datas.mobileTransitionDuration) * 15;
     this.textures = [];
 
     this.lowPerf = this.fluidbook.support.android || this.fluidbook.support.iOS || this.fluidbook.support.IE > 0;
@@ -30,6 +30,9 @@ function Fluidbook3DFlip(fluidbook) {
 
     this.turnRunning = false;
 
+    this.pi2 = Math.PI * 2;
+    this.deg2rad = this.pi2 / 360;
+
     var $this = this;
     this.init();
 }
@@ -137,8 +140,7 @@ Fluidbook3DFlip.prototype = {
 
         this.initAnimations();
 
-        this.animate();
-
+        this.animate(true);
         this.resize();
     },
 
@@ -164,8 +166,8 @@ Fluidbook3DFlip.prototype = {
             ease: Power0.easeIn
         }));
         this.tlleft.add(TweenMax.fromTo(this.bend, 5, {force: force}, {force: 0, ease: Power0.easeOut}));
-        this.tlleft.add(TweenMax.fromTo(this, 10, {_pageRotation: 0}, {
-            _pageRotation: 180,
+        this.tlleft.add(TweenMax.fromTo(this, 10, {_pageRotation: -180}, {
+            _pageRotation: -0,
             ease: Power1.easeIn
         }), 0);
         this.tlleft.pause();
@@ -177,18 +179,12 @@ Fluidbook3DFlip.prototype = {
         var $this = this;
         this.prepareTexture(turning.flip[1], function (t1) {
             $this.prepareTexture(turning.flip[0], function (t2) {
-                $this.texturesLoaded(t1, t2, turning.dir, callback);
+                $this.texturesLoaded(t1, t2, callback);
             });
         })
     },
 
-    texturesLoaded: function (t1, t2, dir, callback) {
-        this.tlname = dir === 1 ? 'right' : 'left';
-
-        this.tlleft.kill();
-        this.tlright.kill();
-        this.progressAnimation(0);
-
+    texturesLoaded: function (t1, t2, callback) {
         this.textures[0].map = t1;
         this.textures[1].map = t2;
 
@@ -221,51 +217,59 @@ Fluidbook3DFlip.prototype = {
         };
     },
 
-    playTurn: function (callback) {
-        var $this = this;
+    playTurn: function (dir, callback) {
         if (this.turnRunning) {
             return;
         }
+
+        var $this = this;
+
+        this.tlleft.kill();
+        this.tlright.kill();
+
+        this.tlname = dir === 1 ? 'right' : 'left';
         this.progressAnimation(0);
-        this.turnRunning = true;
 
-        TweenMax.fromTo(this, this.animationTime,
-            {
-                progressAnimation: 0
-            }, {
-                progressAnimation: 1,
-                ease: Power0.easeIn,
-                onComplete: function () {
-                    $this.turnRunning = false;
-                    callback();
-                }
-            }
-        );
+        this.turnRunning = true;
+        $this.animate(false);
+
+        // TweenMax.fromTo(this, this.animationTime,
+        //     {
+        //         progressAnimation: 0
+        //     }, {
+        //         progressAnimation: 1,
+        //         ease: Power0.easeIn,
+        //         onComplete: function () {
+        //             $this.turnRunning = false;
+        //             this.tlname='';
+        //             callback();
+        //         }
+        //     }
+        // );
     },
 
-    animate: function () {
+    animate: function (next) {
         var $this = this;
         if (this.stats === undefined) {
             try {
                 window.requestAnimationFrame(this.animate);
             } catch (e) {
                 setTimeout(function () {
-                    $this.animate();
+                    $this.animate(true);
                 }, 100);
             }
             return;
         }
 
-        requestAnimationFrame(function () {
-            $this.animate();
-        });
-
-        var pi2 = Math.PI * 2;
-
-        var r = this._pageRotation / 360 * pi2;
-        var diff = r - this.plane.rotation.y;
+        if (next) {
+            requestAnimationFrame(function () {
+                $this.animate(true);
+            });
+        }
 
-        this.plane.rotateY(diff);
+        var d = ((720 + this._pageRotation) % 360);
+        console.log(d);
+        this.plane.rotation.y = d * this.deg2rad;
 
         this.stats.update();
         this.renderer.render(this.scene, this.camera);
@@ -282,7 +286,7 @@ Fluidbook3DFlip.prototype = {
     },
 
     resize: function () {
-        if (!this.ready || this.turnRunning) {
+        if (!this.ready) {
             return;
         }
 
@@ -293,7 +297,6 @@ Fluidbook3DFlip.prototype = {
         this.camera.updateProjectionMatrix();
 
         $("#flip3dcontainer").css({width: this.pw, height: this.ph});
-
         this.renderer.setSize(this.pw, this.ph);
 
         this.guessCameraZoom();
diff --git a/js/libs/fluidbook/fluidbook.pagetransitions.js b/js/libs/fluidbook/fluidbook.pagetransitions.js
index 5deefc80..313c4e68 100644
--- a/js/libs/fluidbook/fluidbook.pagetransitions.js
+++ b/js/libs/fluidbook/fluidbook.pagetransitions.js
@@ -104,7 +104,7 @@ FluidbookPageTransition.prototype = {
             $this.flip3d.prepareTurn(turning, function () {
                 $this.fluidbook.loader.setContentsInDoublePage(currentDoublePage, turning.flat, true, function () {
                     $this.beforeTransition(pageNr, 3, turning);
-                    $this.flip3d.playTurn(function () {
+                    $this.flip3d.playTurn(turning.dir, function () {
                         $this.fluidbook.loader.setContentsInDoublePage(currentDoublePage, turning.end, true, function () {
                             $this.afterTransition(pageNr);
                         });