wip #2721 @1.5

diff --git a/js/libs/fluidbook/fluidbook.loader.js b/js/libs/fluidbook/fluidbook.loader.js
index 8c7657d02b304b6a5f47eec975d7a7aec96dc60f..dbfd75e59cd3c9fe5637b2332c37987e7151c4be 100644 (file)
--- a/js/libs/fluidbook/fluidbook.loader.js
+++ b/js/libs/fluidbook/fluidbook.loader.js
@@ -598,8 +598,8 @@ FluidbookLoader.prototype = {
         if (shade) {
             s = '<div class="shade"></div>';
         }
-        return this.loadThumb(page, function () {
-        }).get(0).outerHTML + s;
+        return '<div class="pageholder">' + this.loadThumb(page, function () {
+        }).get(0).outerHTML + s + '</div>';
     },
 
     // getThumbImage: function (page, div, shade, width) {

diff --git a/js/libs/fluidbook/fluidbook.mobilefirst.js b/js/libs/fluidbook/fluidbook.mobilefirst.js
index 3d32733327b86527791a09c4418a1af62ca68abb..be087d0f935177c52902a94225f84459608b93dd 100644 (file)
--- a/js/libs/fluidbook/fluidbook.mobilefirst.js
+++ b/js/libs/fluidbook/fluidbook.mobilefirst.js
@@ -124,5 +124,28 @@ FluidbookMobileFirst.prototype = {
             useBothWheelAxes: true
         });
         $("#indexViewHolder").find('.ps__rail-x').addClass('ps--clicking');
+
+        // Cut tall pages
+        $("#indexViewHolder .pageholder.cut").css('max-height', null).removeClass('cut');
+        var scrollAmount = Math.max(0, $("#indexView").outerHeight() - parseFloat($(".mview .content").css('max-height')));
+        console.log('scrollamount', scrollAmount);
+        if (scrollAmount > 0) {
+            var tallerHeight = 0;
+            $("#indexViewHolder .pageholder img").each(function () {
+                tallerHeight = Math.max(tallerHeight, $(this).outerHeight())
+            });
+            console.log(tallerHeight);
+            var cutHeight = tallerHeight - scrollAmount;
+            console.log(tallerHeight, cutHeight);
+            $("#indexViewHolder .pageholder img").each(function () {
+                if ($(this).outerHeight() > cutHeight) {
+                    var holder = $(this).closest('.pageholder');
+                    holder.addClass('cut').css('max-height', cutHeight);
+                    holder.closest('.thumb').css('height', cutHeight);
+                    holder.closest('.doubleThumb').css('height', cutHeight);
+                }
+            })
+        }
+
     },
 }
\ No newline at end of file

diff --git a/style/fluidbook.less b/style/fluidbook.less
index 8c35dd2920e84b4057c07f5f79bae91ec6322b76..625ed13bbdfbf1e0c777d410c70dd30e3e9c098c 100644 (file)
--- a/style/fluidbook.less
+++ b/style/fluidbook.less
@@ -1909,9 +1909,9 @@ form input[type="text"], form input[type="email"] {
 
   img {
     width: 100%;
-    height: 100%;
+    height: auto;
     background-color: #fff;
-    position: absolute;
+    position: relative;
     z-index: 1;
     top: 0;
     left: 0;

diff --git a/style/mobilefirst.less b/style/mobilefirst.less
index 1754e971c3461acdebbe648b4fdcc7e298ef0e2b..d34a5bee04c04922fd19a736bf04ac815e07e74f 100644 (file)
--- a/style/mobilefirst.less
+++ b/style/mobilefirst.less
@@ -93,6 +93,13 @@
       white-space: nowrap;
       padding: 25px 20px;
 
+      .pageholder {
+        height: 100%;
+        &.cut {
+          overflow: hidden;
+        }
+      }
+
       .ps__rail-x {
         margin: 0 25px;
         transform: translate(0, -25px) !important;