]> _ Git - fluidbook-html5.git/commitdiff
wip #1487 @7
authorVincent Vanwaelscappel <vincent@cubedesigners.com>
Mon, 24 Jul 2017 15:53:24 +0000 (17:53 +0200)
committerVincent Vanwaelscappel <vincent@cubedesigners.com>
Mon, 24 Jul 2017 15:53:24 +0000 (17:53 +0200)
js/libs/fluidbook/fluidbook.desktop.js
js/libs/fluidbook/fluidbook.slider.js
js/libs/fluidbook/fluidbook.touch.js
js/libs/fluidbook/fluidbook.zoom.js

index 7b083ee0bf6dd04f278dafd0a5c2a47f27540901..6f14ef07a38f1e48220fbc4c435bb30a5cbdb338 100644 (file)
@@ -29,19 +29,15 @@ FluidbookDesktop.prototype = {
             $this.moveZoom(e);
         });
     },
-    moveZoom: function (e) {
-        if (this.fluidbook.zoom.zoom > 1) {
-            console.log(e.pageX + ' | ' + e.pageY);
-        }
-
-        var x = 100 * e.pageX / this.fluidbook.resize.ww;
-        var y = 100 * e.pageY / this.fluidbook.resize.hh;
+    moveZoom: function (e, force) {
+        var x = e.pageX / this.fluidbook.resize.ww;
+        var y = e.pageY / this.fluidbook.resize.hh;
 
-        this.fluidbook.zoom.setOrigin(x + '%', y + '%')
+        this.fluidbook.zoom.setOrigin(x, y, force)
     },
     clickZoom: function (e, way) {
         if (way == undefined) {
-            if (this.fluidbook.zoom.zoom == 1) {
+            if (this.zoom == 1) {
                 way = 1;
             } else {
                 way = -1;
@@ -53,7 +49,8 @@ FluidbookDesktop.prototype = {
         } else if (way == -1) {
             newScale = 1;
         }
-        this.fluidbook.zoom.setZoom(newScale);
+        this.moveZoom(e, true)
+        this.setZoom(newScale);
         return false;
     },
     wheelZoom: function (delta) {
index abfde35d6f5aa974556ca163e0aa4068af957d0b..18decfc1a86c091885935f6d244ace0b9bb51716 100644 (file)
@@ -27,19 +27,16 @@ FluidbookSlider.prototype = {
             return true;
         });
 
-        interact(document.getElementById("slidercursor")).draggable({
-            inertia: false,
-            onstart: function (event) {
-                return $this.dragCursor(event, false, true);
-            },
-            onmove: function (event) {
-                return $this.dragCursor(event, false, true);
-            },
-            onend: function (event) {
-                return $this.dragCursor(event, true, true);
-            }
+        var hmf = new Hammer.Manager(document.getElementById('slidercursor'), {domEvents: false});
+        hmf.add(new Hammer.Pan({threshold: 0}));
+        hmf.on('panmove', function (event) {
+            $this.dragCursor(event, false, true);
+            event.preventDefault();
+        });
+        hmf.on('panend', function (event) {
+            $this.dragCursor(event, true, true);
+            event.preventDefault();
         });
-
 
         if (!Modernizr.ftouch) {
             $("#slider").on('mouseenter mousemove', function (e) {
@@ -68,7 +65,7 @@ FluidbookSlider.prototype = {
             $("#slider").removeClass("drag");
         }
         if (move) {
-            this.updatePageByCursorPosition(this.pageToSlider(e.pageX), end, true);
+            this.updatePageByCursorPosition(this.pageToSlider(e.center.x), end, true);
         }
     },
 
index e03da99b1458b40af5006105abbba649351ccca9..32ddd580dfaef9a9d264507c7a085bf626154afb 100644 (file)
@@ -151,22 +151,16 @@ FluidbookTouch.prototype = {
         var diffx = this.fluidbook.resize.ww * (this.fluidbook.zoom.zoom - 1);
         var diffy = this.fluidbook.resize.hh * (this.fluidbook.zoom.zoom - 1);
 
-        var currentX = (parseFloat(this.fluidbook.zoom.origin[0]) / 100) * diffx;
-        var currentY = (parseFloat(this.fluidbook.zoom.origin[1]) / 100) * diffy;
+        var currentX = this.fluidbook.zoom.origin[0] * diffx;
+        var currentY = this.fluidbook.zoom.origin[1] * diffy;
 
         var x = currentX - e.dx;
         var y = currentY - e.dy;
 
-        x *= 100 / diffx;
-        y *= 100 / diffy;
+        x /= diffx;
+        y /= diffy;
 
-        x = Math.max(0, Math.min(100, x));
-        y = Math.max(0, Math.min(100, y));
-
-        this.fluidbook.zoom.setOrigin(
-            x + '%',
-            y + '%',
-            true, inertia);
+        this.fluidbook.zoom.setOrigin(x, y, true, inertia);
 
         return false;
     },
@@ -245,8 +239,8 @@ FluidbookTouch.prototype = {
         var zrect = $("#z").get(0).getBoundingClientRect();
 
         // focus point in non zoomed coordinates
-        var ox = cx - zrect.left / z;
-        var oy = cy - zrect.top / z;
+        var ox = (cx - zrect.left) / z;
+        var oy = (cy - zrect.top) / z;
 
         ox = ox / this.fluidbook.resize.ww;
         oy = oy / this.fluidbook.resize.hh;
@@ -255,10 +249,7 @@ FluidbookTouch.prototype = {
         var tx = cx / this.fluidbook.resize.ww;
         var ty = cy / this.fluidbook.resize.hh;
 
-        this.fluidbook.zoom.setOrigin(
-            (ox * 100) + '%',
-            (oy * 100) + '%',
-            true);
+        this.fluidbook.zoom.setOrigin(ox, oy, true);
     },
 };
 
index 31e065bc2e53f1c6a0ff32e8c2a93c27b2a84e8c..e5866d33ad05e6017c0d3b4ce7e6391c297344bb 100644 (file)
@@ -98,6 +98,8 @@ FluidbookZoom.prototype = {
         if (inertia == undefined) {
             inertia = false;
         }
+        x = Math.min(1, Math.max(0, x));
+        y = Math.min(1, Math.max(0, y));
         this.origin = [x, y];
         if (!force && this.fluidbook.zoom.zoom == 1) {
             return;
@@ -108,7 +110,7 @@ FluidbookZoom.prototype = {
                 $("#z").removeClass('transition-inertia');
             }
             $("#z").transform({
-                origin: this.origin
+                origin: [this.origin[0] * 100 + '%', this.origin[1] * 100 + '%']
             }, {
                 preserve: true
             });
@@ -129,7 +131,7 @@ FluidbookZoom.prototype = {
         if (this.desktopScale == 1) {
             animation.origin = ['50%', '50%'];
         } else {
-            animation.origin = this.origin;
+            animation.origin = [this.origin[0] * 100 + '%', this.origin[1] * 100 + '%'];
         }
 
         var hiddenElements = $("header,footer,#interface");