From: Vincent Vanwaelscappel <vincent@cubedesigners.com>
Date: Mon, 13 May 2019 10:50:36 +0000 (+0200)
Subject: wip #2708 @2
X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=ed4e150279be992652e520e7d5d22a99895fb0f4;p=fluidbook-html5.git

wip #2708 @2
---

diff --git a/js/libs/fluidbook/fluidbook.bookmarks.js b/js/libs/fluidbook/fluidbook.bookmarks.js
index e5837aea..25759c32 100644
--- a/js/libs/fluidbook/fluidbook.bookmarks.js
+++ b/js/libs/fluidbook/fluidbook.bookmarks.js
@@ -436,7 +436,7 @@ FluidbookBookmarks.prototype = {
             downloadLabel = this.fluidbook.l10n.__('download');
         }
 
-        var index = '<div class="content"><div id="indexView" class="bookmarkView">';
+        var index = '<div class="content"><div id="indexView" class="bookmarkView"><div id="indexViewHolder">';
 
         if (onlyGroup === undefined || !onlyGroup) {
             for (var g = 0; g < groups.length; g++) {
@@ -446,8 +446,10 @@ FluidbookBookmarks.prototype = {
                     pages.push(group.page + i);
                 }
 
-                index += '<div class="doubleThumb simple left" page="' + group.page + '" data-pages="' + pages.join(',') + '">';
-                index += '<div class="thumb left"><a href="#/page/' + group.page + '">' + this.fluidbook.loader.getThumbImage(group.page) + '</a><span class="number">' + group.name + '</span>';
+                var dim = this.fluidbook.menu.index.getThumbDimensions(group.page);
+
+                index += '<div class="doubleThumb simple left"' + dim.doublethumb + ' page="' + group.page + '" data-pages="' + pages.join(',') + '">';
+                index += '<div class="thumb left"' + dim.thumb + '><a href="#/page/' + group.page + '">' + this.fluidbook.loader.getThumbImage(group.page) + '</a><span class="number"' + dim.pagenumber + '>' + group.name + '</span>';
                 if (this.fluidbook.bookmarks.enabled) {
                     index += this.fluidbook.bookmarks.getBookmarkForPage(group.page, true, true);
                 }
@@ -464,8 +466,11 @@ FluidbookBookmarks.prototype = {
 
             for (i in pages) {
                 var p = pages[i];
-                index += '<div class="doubleThumb simple left" page="' + p + '" data-pages="' + p + '">';
-                index += '<div class="thumb left"><a href="#/page/' + p + '">' + this.fluidbook.loader.getThumbImage(p) + '</a><span class="number">' + this.fluidbook.physicalToVirtual(p) + '</span>';
+
+                var dim = this.fluidbook.menu.index.getThumbDimensions(p);
+
+                index += '<div class="doubleThumb simple left"' + dim.doublethumb + ' page="' + p + '" data-pages="' + p + '">';
+                index += '<div class="thumb left"' + dim.thumb + '><a href="#/page/' + p + '">' + this.fluidbook.loader.getThumbImage(p) + '</a><span class="number"' + dim.pagenumber + '>' + this.fluidbook.physicalToVirtual(p) + '</span>';
                 if (this.fluidbook.bookmarks.enabled) {
                     index += this.fluidbook.bookmarks.getBookmarkForPage(p, true, true);
                 }
@@ -473,7 +478,7 @@ FluidbookBookmarks.prototype = {
                 index += '</div>';
             }
         }
-        index += '</div>';
+        index += '</div></div>';
         index += '<div class="fonctions">';
         if (this.fluidbook.datas.friend && this.fluidbook.datas.bookmarkSendEnable) {
             index += '<a class="send" href="#">' + this.fluidbook.l10n.__('send') + '</a>';
diff --git a/js/libs/fluidbook/fluidbook.menu.js b/js/libs/fluidbook/fluidbook.menu.js
index 08e597fb..bed2e2c1 100644
--- a/js/libs/fluidbook/fluidbook.menu.js
+++ b/js/libs/fluidbook/fluidbook.menu.js
@@ -601,13 +601,12 @@ FluidbookMenu.prototype = {
                     var cw = 130 * this.fluidbook.datas.pages;
                     fullscreen = (cw >= ww * 0.9);
                     if (!fullscreen) {
-                        w = cw+30;
+                        w = cw + 30;
                     }
                 } else {
                     fullscreen = true;
-                    this.fluidbook.mobilefirst.resizeIndex();
-
                 }
+                this.fluidbook.mobilefirst.resizeIndex();
                 break;
             case 'share':
                 w = 200;
@@ -655,10 +654,25 @@ FluidbookMenu.prototype = {
                 }
                 break;
             case 'bookmarks':
-                var max = Math.floor((ww * 0.8) / 120) * 120 + 40;
-                w = Math.min(max, Math.max(m.find('.doubleThumb').length, 4) * 120 + 40);
-                if (ww < 520) {
-                    fullscreen = true;
+                if (this.fluidbook.mobilefirst.enabled) {
+                    var indexWidth = Math.floor(ww / 230) * 230;
+                    $("#indexViewHolder").css('width', indexWidth);
+                    if (this.fluidbook.mobilefirst.enabled) {
+                        var cw = 130 * this.fluidbook.datas.pages;
+                        fullscreen = (cw >= ww * 0.9);
+                        if (!fullscreen) {
+                            w = cw + 30;
+                        }
+                    } else {
+                        fullscreen = true;
+                    }
+                    this.fluidbook.mobilefirst.resizeIndex();
+                } else {
+                    var max = Math.floor((ww * 0.8) / 120) * 120 + 40;
+                    w = Math.min(max, Math.max(m.find('.doubleThumb').length, 4) * 120 + 40);
+                    if (ww < 520) {
+                        fullscreen = true;
+                    }
                 }
                 break;
             case 'bookmarks-help':
@@ -889,6 +903,7 @@ FluidbookMenu.prototype = {
         } else {
             ccss.maxHeight = h;
         }
+
         if (forceHeight) {
             css.minHeight = css.height = h;
             if (contentHeight === undefined) {
@@ -897,6 +912,11 @@ FluidbookMenu.prototype = {
                 } else {
                     ccss.minHeight = ccss.height = h;
                 }
+
+                // if (m.find('.fonctions').length > 0) {
+                //     ccss.height -= m.find('.fonctions').outerHeight();
+                //     ccss.minHeight = ccss.height;
+                // }
             } else {
                 ccss.minHeight = ccss.height = contentHeight;
             }
diff --git a/js/libs/fluidbook/fluidbook.mobilefirst.js b/js/libs/fluidbook/fluidbook.mobilefirst.js
index 4d42d2af..3d327333 100644
--- a/js/libs/fluidbook/fluidbook.mobilefirst.js
+++ b/js/libs/fluidbook/fluidbook.mobilefirst.js
@@ -111,7 +111,10 @@ FluidbookMobileFirst.prototype = {
     },
 
     resizeIndex: function () {
-        $("#indexViewHolder").css('width', this.fluidbook.datas.pages * 130);
+        if (!this.enabled) {
+            return;
+        }
+        $("#indexViewHolder").css('width', $("#indexViewHolder .doubleThumb").length * 130);
         setTimeout(function () {
             $("#indexViewHolder").perfectScrollbar('update');
             $("#indexViewHolder").find('.ps__rail-x').addClass('ps--clicking');
diff --git a/js/libs/fluidbook/menu/fluidbook.index.js b/js/libs/fluidbook/menu/fluidbook.index.js
index 30dd54c6..49fc54a0 100644
--- a/js/libs/fluidbook/menu/fluidbook.index.js
+++ b/js/libs/fluidbook/menu/fluidbook.index.js
@@ -94,14 +94,8 @@ FluidbookIndex.prototype = {
                 }
 
                 if (i > 0) {
-                    var h = '';
-                    var pnt = '';
-                    if (this.fluidbook.mobilefirst.enabled) {
-                        var ph = this.fluidbook.loader.getPageDimensions(i, 100).height;
-                        h = ' style="height:' + ph + 'px;"'
-                        pnt = ' style="top:' + (ph - 5) + 'px;"';
-                    }
-                    ix1 += '<div class="thumb ' + s1 + '"' + h + '><a href="#/page/' + i + '">' + this.fluidbook.loader.getThumbImage(i, true) + '</a><span class="number"' + pnt + '>' + this.fluidbook.physicalToVirtual(i) + '</span>';
+                    var dim = this.getThumbDimensions(i);
+                    ix1 += '<div class="thumb ' + s1 + '"' + dim.thumb + '><a href="#/page/' + i + '">' + this.fluidbook.loader.getThumbImage(i, true) + '</a><span class="number"' + dim.pagenumber + '>' + this.fluidbook.physicalToVirtual(i) + '</span>';
                     if (this.fluidbook.bookmarks.enabled) {
                         ix1 += this.fluidbook.bookmarks.getBookmarkForPage(i, true);
                     }
@@ -111,7 +105,7 @@ FluidbookIndex.prototype = {
                     c = ' simple ' + s2;
                 }
 
-                if (this.fluidbook.l10n.dir == 'rtl') {
+                if (this.fluidbook.l10n.dir === 'rtl') {
                     s1 = 'left';
                     s2 = 'right'
                 } else {
@@ -130,7 +124,7 @@ FluidbookIndex.prototype = {
                         c = ' simple ' + s2;
                     }
 
-                    if (j == 1) {
+                    if (j === 1) {
                         pages.unshift(0);
                     }
 
@@ -139,17 +133,25 @@ FluidbookIndex.prototype = {
                     ix = ix1;
                 }
 
-                var dth = '';
-                if (this.fluidbook.mobilefirst.enabled) {
-                    dth = ' style="height:' + ph + 'px;"';
-                }
-
-                this.normalHTML += '<div class="doubleThumb' + c + '" page="' + i + '" data-pages="' + pages.join(',') + '"' + dth + '>' + ix;
+                this.normalHTML += '<div class="doubleThumb' + c + '" page="' + i + '" data-pages="' + pages.join(',') + '"' + dim.doublethumb + '>' + ix;
                 this.normalHTML += '</div>';
             }
             this.normalHTML += '</div></div></div>';
         }
 
         return this.normalHTML;
-    }
+    },
+
+    getThumbDimensions: function (page) {
+        var h = '';
+        var pnt = '';
+        var dth = '';
+        if (this.fluidbook.mobilefirst.enabled) {
+            var ph = this.fluidbook.loader.getPageDimensions(page, 100).height;
+            h = ' style="height:' + ph + 'px;"'
+            pnt = ' style="top:' + (ph - 5) + 'px;"';
+            dth = ' style="height:' + ph + 'px;"';
+        }
+        return {thumb: h, pagenumber: pnt, pageheight: ph, doublethumb: dth};
+    },
 }
diff --git a/style/mobilefirst.less b/style/mobilefirst.less
index 328209b4..8b6b354a 100644
--- a/style/mobilefirst.less
+++ b/style/mobilefirst.less
@@ -77,6 +77,11 @@
     height: 100%;
     overflow: hidden !important;
 
+    &.bookmarkView {
+      padding: 0;
+      height: auto;
+    }
+
     #indexViewHolder {
       min-width: 100%;
       max-width: 100%;
@@ -96,6 +101,10 @@
     }
   }
 
+  .mview.fs .fonctions {
+    padding: 0 25px 25px 25px;
+  }
+
   .thumb {
     &:before {
       display: none;
@@ -112,6 +121,7 @@
     }
   }
 
+
 }