fix #1738 @0.75

diff --git a/js/libs/fluidbook/fluidbook.background.js b/js/libs/fluidbook/fluidbook.background.js
index d4de6fef2350e363e86925f7f3f19da066f24ea2..028b97ff0848b11eb538321e2e0cb0d4686c4f82 100644 (file)
--- a/js/libs/fluidbook/fluidbook.background.js
+++ b/js/libs/fluidbook/fluidbook.background.js
@@ -1,52 +1,97 @@
 function FluidbookBackground(fluidbook) {
-       this.fluidbook = fluidbook;
-       this.hasLinks = false;
-       this.init();
+    this.fluidbook = fluidbook;
+    this.hasLinks = false;
+    this.init();
 }
 
 FluidbookBackground.prototype = {
-       init: function() {
-               if (this.fluidbook.datas.links.background != undefined
-                               && this.fluidbook.datas.repeat != Fluidbook.REPEAT
-                               && this.fluidbook.datas.repeat != Fluidbook.STRETCH
-                               && this.fluidbook.datas.links.background != ''
-                               && this.fluidbook.datas.mobileIgnoreBackgroundLinks === false) {
-                       $("#background").prepend('<div class="links">' + this.fluidbook.datas.links.background + '</div>');
-                       this.hasLinks = true;
-               }
-       },
-       resize: function(w, h) {
-               if (!this.hasLinks) {
-                       return;
-               }
-
-               var left, top, iw, ih;
-               if (this.fluidbook.datas.repeat == Fluidbook.NONE) {
-                       iw = this.fluidbook.datas.backgroundImageDimensions.width;
-                       ih = this.fluidbook.datas.backgroundImageDimensions.height;
-               }
-
-               if (this.fluidbook.datas.backgroundHAlign == Fluidbook.LEFT) {
-                       left = 0
-               } else if (this.fluidbook.datas.backgroundHAlign == Fluidbook.RIGHT) {
-                       left = w - iw;
-               } else if (this.fluidbook.datas.backgroundHAlign == Fluidbook.CENTER) {
-                       left = (w - iw) / 2;
-               }
-
-
-               if (this.fluidbook.datas.backgroundVAlign == Fluidbook.TOP) {
-                       top = 0
-               } else if (this.fluidbook.datas.backgroundVAlign == Fluidbook.BOTTOM) {
-                       top = h - ih;
-               } else if (this.fluidbook.datas.backgroundVAlign == Fluidbook.MIDDLE) {
-                       top = (h - ih) / 2;
-               }
-
-               $("#background .links").css({
-                       top: top,
-                       left: left
-               });
-       }
+    init: function () {
+        if (this.fluidbook.datas.links.background != undefined
+            && this.fluidbook.datas.repeat != Fluidbook.REPEAT
+            && this.fluidbook.datas.links.background != ''
+            && this.fluidbook.datas.mobileIgnoreBackgroundLinks === false) {
+            $("#background").prepend('<div class="links">' + this.fluidbook.datas.links.background + '</div>');
+            this.hasLinks = true;
+        }
+    },
+    resize: function (w, h) {
+        if (!this.hasLinks) {
+            return;
+        }
+
+        var left, top, iw, ih;
+        if (this.fluidbook.datas.repeat == Fluidbook.NONE) {
+            iw = this.fluidbook.datas.backgroundImageDimensions.width;
+            ih = this.fluidbook.datas.backgroundImageDimensions.height;
+
+            if (this.fluidbook.datas.backgroundHAlign == Fluidbook.LEFT) {
+                left = 0
+            } else if (this.fluidbook.datas.backgroundHAlign == Fluidbook.RIGHT) {
+                left = w - iw;
+            } else if (this.fluidbook.datas.backgroundHAlign == Fluidbook.CENTER) {
+                left = (w - iw) / 2;
+            }
+
+
+            if (this.fluidbook.datas.backgroundVAlign == Fluidbook.TOP) {
+                top = 0
+            } else if (this.fluidbook.datas.backgroundVAlign == Fluidbook.BOTTOM) {
+                top = h - ih;
+            } else if (this.fluidbook.datas.backgroundVAlign == Fluidbook.MIDDLE) {
+                top = (h - ih) / 2;
+            }
+
+            $("#background .links").css({
+                top: top,
+                left: left
+            });
+        } else if (this.fluidbook.datas.repeat == Fluidbook.RATIO || this.fluidbook.datas.repeat == Fluidbook.STRETCH) {
+
+            var origin = ['0%', '0%', '0%'];
+            // if (this.fluidbook.datas.backgroundHAlign == Fluidbook.LEFT) {
+            //     origin[0] = '0%';
+            // } else if (this.fluidbook.datas.backgroundHAlign == Fluidbook.RIGHT) {
+            //     origin[0] = '100%';
+            // } else if (this.fluidbook.datas.backgroundHAlign == Fluidbook.CENTER) {
+            //     origin[0] = '50%';
+            // }
+            // if (this.fluidbook.datas.backgroundVAlign == Fluidbook.TOP) {
+            //     origin[1] = '0%';
+            // } else if (this.fluidbook.datas.backgroundVAlign == Fluidbook.BOTTOM) {
+            //     origin[1] = '100%';
+            // } else if (this.fluidbook.datas.backgroundVAlign == Fluidbook.MIDDLE) {
+            //     origin[1] = '50%';
+            // }
+            //
+            // Todo, search why this works :)
+            origin = ['0%', '0%', '0%'];
+
+            var bw = parseFloat(this.fluidbook.datas.backgroundImageDimensions.width);
+            var bh = parseFloat(this.fluidbook.datas.backgroundImageDimensions.height);
+
+            var translateX = 0;
+            var translateY = 0;
+            var css = {};
+            var scaleX = w / bw;
+            var scaleY = h / bh;
+            if (this.fluidbook.datas.repeat == Fluidbook.RATIO) {
+                if (scaleX < scaleY) {
+                    var l = ((scaleX - scaleY) * bw);
+                    if (this.fluidbook.datas.backgroundHAlign == Fluidbook.CENTER) {
+                        css.left = l / 2;
+                    } else if (this.fluidbook.datas.backgroundHAlign == Fluidbook.LEFT) {
+                        css.left = 0;
+                    }
+                } else {
+                    css.left = 0;
+                }
+                scaleX = scaleY = Math.max(scaleX, scaleY);
+            }
+            var transform = {scaleX: scaleX, scaleY: scaleY, translateX: translateX, translateY: translateY, origin: origin};
+            $("#background .links").transform(transform).css(css);
+        }
+
+
+    }
 };