From 1c9900bc6d4f27bb41a11b44c8fcefa4f768cab5 Mon Sep 17 00:00:00 2001
From: Vincent Vanwaelscappel <vincent@cubedesigners.com>
Date: Tue, 25 Apr 2017 18:57:50 +0200
Subject: [PATCH] wip #815

---
 js/libs/fluidbook/fluidbook.links.js  | 38 ++++++++++++++-------------
 js/libs/fluidbook/fluidbook.resize.js |  1 +
 2 files changed, 21 insertions(+), 18 deletions(-)

diff --git a/js/libs/fluidbook/fluidbook.links.js b/js/libs/fluidbook/fluidbook.links.js
index 685e6065..52ae4ec6 100644
--- a/js/libs/fluidbook/fluidbook.links.js
+++ b/js/libs/fluidbook/fluidbook.links.js
@@ -16,13 +16,13 @@ FluidbookLinks.prototype = {
         // ToDo: consider re-using existing popinOverlay div?
         $('body').append('<div id="zoomPopupOverlay"></div><div id="zoomPopupWrapper"><a href="#" class="zoomPopupClose"></a></div>');
 
-        $(document).on('click', '.zoomPopup', function(e) {
+        $(document).on('click', '.zoomPopup', function (e) {
             e.preventDefault();
             $this.zoomLink(this);
             return false;
         });
 
-        $(document).on('click touchend', '#zoomPopupOverlay, .zoomPopupClose', function(e) {
+        $(document).on('click touchend', '#zoomPopupOverlay, .zoomPopupClose', function (e) {
             console.log('closing zoomPopup...');
             $this.zoomLinkReset();
         });
@@ -85,25 +85,25 @@ FluidbookLinks.prototype = {
         }
     },
 
-    zoomLink: function(link) {
+    zoomLink: function (link) {
 
         var $this = this;
 
-        if($('body').hasClass('zoomPopup')) return false; // Ignore clicks on other zoom links if popup is already open
+        // Todo : should be impossible thanks to the overlay
+        if ($('body').hasClass('zoomPopup')) return false; // Ignore clicks on other zoom links if popup is already open
 
         // If the interface is zoomed in, we must zoom out first
-        if ($('body').hasClass('zoomed')) {
+        if (this.fluidbook.zoom.zoom > 1) {
             console.log('zooming out before opening zoom box');
             //currentScale = this.fluidbook.desktop.desktopScale; // Get current scale so the size of the popup can be calculated correctly
 
             // Wait for clickZoom out to finish before trying again to open zoom link
-            $(document).one('fluidbookZoomOutEnded', function() {
+            $(document).one('fluidbook.zoom.out.end', function () {
                 $this.zoomLink(link);
             });
 
             // Zoom out
-            this.fluidbook.resetZoom();
-
+            this.fluidbook.zoom.resetZoom();
             return false;
         }
 
@@ -115,9 +115,10 @@ FluidbookLinks.prototype = {
             availableHeight = $(window).height() - (2 * zoomMargin),
             $link = $(link),
             box = $link[0].getBoundingClientRect(),
-            parent = $link.parent('.link'),
+            parent = $link.closest('.link'),
+            linkId = $(parent).attr('id').split('_', 2)[1],
             maxZoom = parseInt($link.data('maxzoom')) || 2,
-            zoomImage = $link.data('zoomimage'),
+            zoomImage = 'data/links/zoom_' + linkId + '.png',
             x,
             y,
             zoomWidth,
@@ -131,8 +132,8 @@ FluidbookLinks.prototype = {
         zoomHeight = box.height * zoomScale;
 
         // Calculate translate co-ordinates
-        x = availableWidth/2 - parent.offset().left - zoomWidth/2 + zoomMargin;
-        y = availableHeight/2 - parent.offset().top - zoomHeight/2 + zoomMargin;
+        x = availableWidth / 2 - parent.offset().left - zoomWidth / 2 + zoomMargin;
+        y = availableHeight / 2 - parent.offset().top - zoomHeight / 2 + zoomMargin;
 
         // console.log(parent);
         // console.info(box);
@@ -143,15 +144,15 @@ FluidbookLinks.prototype = {
             width: box.width,
             height: box.height,
             left: box.left,
-            top: box.top
-            //backgroundImage: 'url('+ zoomImage +')'
+            top: box.top,
+            backgroundImage: 'url(' + zoomImage + ')'
         });
 
         z.show();
 
-        setTimeout(function(){
+        setTimeout(function () {
             z.css({
-                transform: 'translateX('+ x +'px) translateY('+ y +'px)',
+                transform: 'translateX(' + x + 'px) translateY(' + y + 'px)',
                 width: zoomWidth,
                 height: zoomHeight
             });
@@ -159,11 +160,12 @@ FluidbookLinks.prototype = {
 
         z.data('scale', zoomScale);
 
+        // Todo : still useful ?
         $('body').addClass('zoomPopup');
 
     },
 
-    zoomLinkReset: function() {
+    zoomLinkReset: function () {
 
         if (!$('body').hasClass('zoomPopup')) return false; // Already open
 
@@ -179,7 +181,7 @@ FluidbookLinks.prototype = {
         // Hide popup after transition completes
         // ToDo: use CSS transition end event to do this without needing a timeout value (or use Web Animation API)
         // ToDo: see https://davidwalsh.name/css-animation-callback
-        setTimeout(function() {
+        setTimeout(function () {
             $('#zoomPopupWrapper').hide();
             $('body').removeClass('zoomPopup');
         }, 500);
diff --git a/js/libs/fluidbook/fluidbook.resize.js b/js/libs/fluidbook/fluidbook.resize.js
index a557a1c2..b8d298fb 100644
--- a/js/libs/fluidbook/fluidbook.resize.js
+++ b/js/libs/fluidbook/fluidbook.resize.js
@@ -60,6 +60,7 @@ FluidbookResize.prototype = {
         if (this.fluidbook.support.android) {
             this.fluidbook.viewport.width = 'device-width';
             this.fluidbook.viewport.updateViewport();
+            this.updateWindow();
         }
 
         var interfaceScale;
-- 
2.39.5