wip #2309 @4

diff --git a/js/libs/fluidbook/fluidbook.3dflip.js b/js/libs/fluidbook/fluidbook.3dflip.js
index 56c6183482a1eef11ea7863901d5deb544105c2f..ca3793c75bb2391ace59479f439d3ebb136cb876 100644 (file)
--- a/js/libs/fluidbook/fluidbook.3dflip.js
+++ b/js/libs/fluidbook/fluidbook.3dflip.js
@@ -71,8 +71,8 @@ Fluidbook3DFlip.prototype = {
         }
 
         if (performanceMode === undefined || performanceMode === 'auto' || performanceMode === 'performancesTest') {
-            this.veryLowPerf = this.fluidbook.support.IE > 0 || this.fluidbook.support.iOS;
-            this.lowPerf = !Modernizr.webgl || this.veryLowPerf || this.fluidbook.support.edge || this.fluidbook.support.android || this.fluidbook.support.macOs;
+            this.veryLowPerf = this.fluidbook.support.IE > 0;
+            this.lowPerf = !Modernizr.webgl || this.veryLowPerf || this.fluidbook.support.edge || this.fluidbook.support.android || this.fluidbook.support.macOs || this.fluidbook.support.iOS;
         } else if (performanceMode === 'lowPerf') {
             this.lowPerf = true;
             this.veryLowPerf = false;
@@ -358,7 +358,7 @@ Fluidbook3DFlip.prototype = {
                     newMode = 'disable';
                 } else if (res < 10) {
                     newMode = 'veryLowPerf';
-                } else if (res < 30) {
+                } else if (res < 40) {
                     newMode = 'lowPerf';
                 } else {
                     newMode = 'highPerf';
@@ -366,7 +366,7 @@ Fluidbook3DFlip.prototype = {
             } else {
                 if (res < 10) {
                     newMode = 'disable';
-                } else if (res < 30) {
+                } else if (res < 40) {
                     newMode = 'veryLowPerf';
                 } else {
                     newMode = 'lowPerf';
@@ -477,14 +477,14 @@ Fluidbook3DFlip.prototype = {
                     this.performancesFrames++;
                 }
                 render = true;
-                this.jcontainer.show();
+                this.setJContainerVisibility(true);
             } else {
                 render = false;
-                this.jcontainer.hide();
+                this.setJContainerVisibility(false);
             }
         } else {
             render = false;
-            this.jcontainer.hide();
+            this.setJContainerVisibility(false);
         }
 
         if (render) {
@@ -504,6 +504,14 @@ Fluidbook3DFlip.prototype = {
         }
     },
 
+    setJContainerVisibility: function (visibility) {
+        if (visibility) {
+            this.jcontainer.show();
+        } else {
+            this.jcontainer.hide();
+        }
+    },
+
     resize: function () {
         if (!this.ready) {
             return;

diff --git a/js/libs/fluidbook/fluidbook.js b/js/libs/fluidbook/fluidbook.js
index 5081df10e70022992596e0aa30d80a2c26be5e7b..ad928932f5dd849c127c7bd4f86db7ee29cb24b8 100644 (file)
--- a/js/libs/fluidbook/fluidbook.js
+++ b/js/libs/fluidbook/fluidbook.js
@@ -194,8 +194,8 @@ Fluidbook.prototype = {
         this.resize.resize(false, true);
         this.hideLoader(0, true);
 
-        if (this.support.transitions2d) {
-            $("#splash").css('opacity', 0).one(this.support.getTransitionEndEvent(true), function () {
+        if (this.support.transitions2d && !this.support.iOS) {
+            $("#splash").css('opacity', 0).one('transitionend', function () {
                 $(this).remove();
             });
         } else {

diff --git a/js/libs/fluidbook/fluidbook.support.js b/js/libs/fluidbook/fluidbook.support.js
index d74287ecdea5d86ea02066c3b69632225a8c5d36..0aa4d58482b31d1da1d9edaf5d6002991ea8e82b 100644 (file)
--- a/js/libs/fluidbook/fluidbook.support.js
+++ b/js/libs/fluidbook/fluidbook.support.js
@@ -4,8 +4,7 @@ function FluidbookSupport(fluidbook) {
     this.IE = 0;
     try {
         this.IE = navigator.userAgent.match(/(MSIE |Trident.*rv[ :])([0-9]+)/)[2];
-    }
-    catch (e) {
+    } catch (e) {
     }
     this.macOs = navigator.platform.toUpperCase().indexOf('MAC') >= 0;
     this.android = this.fitScreenAtZero = this.userAgent.search(/android/i) > -1 || this.userAgent.search(/galaxy/i) > -1;
@@ -32,13 +31,13 @@ function FluidbookSupport(fluidbook) {
 
     this.transitions2d = Modernizr.csstransforms && Modernizr.csstransitions;
     this.transitions3d = this.transitions2d && Modernizr.csstransforms3d && Modernizr.preserve3d;
-    this.transitions3dacc = this.transitions2d && !this.iOS;
+    this.transitions3dacc = this.transitions2d;// && !this.iOS;
 
     this.ie9 = $("html").hasClass('ie9');
 
     this.androidbrowser = this.android && this.userAgent.search(/applewebkit/i) > -1;
 
-    this.transitionendevent = null;
+    this.transitionendevent = 'transitionend';
 
     if (window.resolution === 'auto') {
         if (Modernizr.mq('(min-device-width : 320px) and (max-device-width : 480px)')) {
@@ -71,7 +70,7 @@ FluidbookSupport.prototype = {
         if (!all) {
             return this.transitionEndEvent;
         }
-        return "webkitTransitionEnd transitionend oTransitionEnd msTransitionEnd transitionEnd";
+        return "transitionEnd";
     },
     hasNetwork: function () {
         if (navigator.onLine != undefined) {
@@ -127,30 +126,6 @@ FluidbookSupport.prototype = {
                 }, 100);
             }
         }
-
-        // Test transition end event
-        var div = document.createElement('div');
-        div.id = "my-transition-test";
-        div.style.position = 'absolute';
-        div.style.zIndex = -10;
-        div.style.bottom = '0px';
-        div.style.height = '0px';
-        div.style.width = '0px';
-        div.style.background = 'yellow';
-        //div.style.display = 'none';
-        window.document.body.appendChild(div);
-
-        $('#my-transition-test').one("webkitTransitionEnd transitionend oTransitionEnd msTransitionEnd transitionEnd", function (e) {
-            if ($this.transitionEndEvent !== e.type) {
-                $this.transitionEndEvent = e.type;
-            }
-            window.document.body.removeChild(div);
-        });
-
-        setTimeout(function () {
-            div.style[Modernizr.prefixed('transition')] = '0.1s';
-            div.style[Modernizr.prefixed('transform')] = 'translate3d( 100px,0,0)';
-        }, 25);
     },
     checkOrientation: function () {
         var o = this.getOrientation();

diff --git a/js/libs/fluidbook/fluidbook.zoom.js b/js/libs/fluidbook/fluidbook.zoom.js
index d3bf3523167271cde967b1b9e6aa0958ff2ecb6c..ef0260b6d2b6101d14ea25319649b1f28ea6bc85 100644 (file)
--- a/js/libs/fluidbook/fluidbook.zoom.js
+++ b/js/libs/fluidbook/fluidbook.zoom.js
@@ -19,7 +19,7 @@ FluidbookZoom.prototype = {
         });
 
         // Detect when we have finished zooming out and raise an event
-        $("#z").on('webkitTransitionEnd otransitionend oTransitionEnd msTransitionEnd transitionend', function () {
+        $("#z").on('transitionend', function () {
             $this.triggerEvent((($this.zoom == 1) ? 'out' : 'in') + '.end');
         });
 

diff --git a/js/widget.js b/js/widget.js
index c5fc9cc80c69c4042a49287e66da9cb4b50edcfa..8da9d96c9c1e2be438958ebf4e3c031c6e7f3771 100644 (file)
--- a/js/widget.js
+++ b/js/widget.js
@@ -1,359 +1,359 @@
-$(function () {\r
-    // Todo : manage other than html extensions\r
-    _GET = parseGet({\r
-        background: 'transparent',\r
-        target: '_blank',\r
-        link: '../index.' + DATAS.htmlExtension,\r
-        time: 4\r
-    });\r
-    _GET['time'] = Math.max(1.5, _GET['time']);\r
-\r
-    $("body").css('background-color', getColor(_GET['background']));\r
-\r
-    $(window).resize(function () {\r
-        resize();\r
-    });\r
-\r
-    var widget = $("#widget").fluidbookWidget(Math.max(0, DATAS.widgetStart), Math.min(DATAS.pages, DATAS.widgetEnd));\r
-    $(document).on('click', function () {\r
-        window.open(_GET['link'], _GET['target'], 'width=' + screen.width + ',height=' + screen.height + ',status=0,toolbar=0,menubar=0,scrollbars=1');\r
-    });\r
-});\r
-\r
-(function ($) {\r
-    function FluidbookWidget(e, from, to) {\r
-        this.transition = 'none';\r
-        if (Modernizr.csstransforms) {\r
-            this.transition = '2d';\r
-        }\r
-        if (Modernizr.csstransforms3d) {\r
-            this.transition = '3d';\r
-        }\r
-\r
-        this.started = false;\r
-        this.e = e;\r
-        this.from = from;\r
-        if (this.from % 2 == 1) {\r
-            this.from--;\r
-        }\r
-        this.to = to;\r
-        if (this.from % 2 == 0) {\r
-            this.to++;\r
-        }\r
-        this.to = Math.min(DATAS.pages, this.to);\r
-        this.currentPage = 0;\r
-        this.dir = 1;\r
-\r
-        this.bookWidth;\r
-        this.bookHeight;\r
-        this.init();\r
-\r
-        this.transitionendevents = ['transitionend', 'mozTransitionEnd', 'webkitTransitionEnd', 'oTransitionEnd', 'msTransitionEnd'].join(' ');\r
-    }\r
-\r
-    FluidbookWidget.prototype = {\r
-        init: function () {\r
-            this.e.append('<div id="currentDoublePage"></div>');\r
-\r
-            // Init pages\r
-            for (i = this.from; i <= this.to; i++) {\r
-                var p = i;\r
-                if (p % 2 == 1) {\r
-                    p--;\r
-                }\r
-                var pclass = 'p';\r
-                var shade = '';\r
-                var side = 'left'\r
-                if (i % 2 == 1) {\r
-                    side = 'right';\r
-                }\r
-                if (i == 0) {\r
-                    pclass += ' loaded';\r
-                } else {\r
-                    shade = '<div class="shade"><img src="images/shadows/pages/' + side + '.png" /></div>';\r
-                }\r
-\r
-                pclass += ' ' + side;\r
-\r
-\r
-                this.e.append('<div class="' + pclass + '" data-page="' + i + '">' + shade + '</div>');\r
-            }\r
-\r
-            this.preloadImages();\r
-        },\r
-        preloadImages: function () {\r
-            var $this = this;\r
-            var p = this.e.find('.p:not(.loaded)').first();\r
-            if (p.length == 0) {\r
-                this.endLoading();\r
-                return;\r
-            }\r
-            var page = $(p).attr('data-page');\r
-            var image = new Image();\r
-            $(image).one('load error', function () {\r
-                $(p).append(this);\r
-                $(p).addClass('loaded');\r
-                $this.preloadImages();\r
-            });\r
-            image.src = 'data/background/36/t' + page + '.jpg';\r
-            if (image.complete) {\r
-                $(p).append(image);\r
-                $(p).addClass('loaded');\r
-                this.preloadImages();\r
-            }\r
-        },\r
-        endLoading: function () {\r
-            if (this.started) {\r
-                return;\r
-            }\r
-            this.started = true;\r
-            this.e.find('.p').hide();\r
-\r
-\r
-            var firstImage = $('.p>img').first().get(0);\r
-\r
-            this.bookWidth = firstImage.width * 2;\r
-            this.bookHeight = firstImage.height;\r
-\r
-\r
-            $("#widget").css({\r
-                width: this.bookWidth,\r
-                minWidth: this.bookWidth,\r
-                maxWidth: this.bookWidth,\r
-                height: this.bookHeight,\r
-                minHeight: this.bookHeight,\r
-                maxHeight: this.bookHeight\r
-            });\r
-\r
-            $(".p .shade img").css({\r
-                width: this.bookWidth / 6,\r
-                height: this.bookHeight\r
-            });\r
-\r
-            $(".p .shade").css({\r
-                width: this.bookWidth / 2,\r
-                height: this.bookHeight\r
-            })\r
-\r
-            $(".p").css({\r
-                width: this.bookWidth / 2,\r
-                height: this.bookHeight\r
-            })\r
-\r
-\r
-            this.gotoPage(0, false);\r
-            var $this = this;\r
-            setInterval(function () {\r
-                if ($this.animating) {\r
-                    return;\r
-                }\r
-                $this.goNextPage();\r
-            }, _GET['time'] * 1000);\r
-\r
-            $("#container:hidden").fadeIn();\r
-            this.resize();\r
-        },\r
-        gotoPage: function (page, transition) {\r
-            this.resize();\r
-            var $this = this;\r
-            this.animating = true;\r
-            var leftPage = $('.p[data-page=' + page + ']');\r
-            var rightPage = $('.p[data-page=' + (page + 1) + ']');\r
-\r
-            if (!transition || this.transition == 'none') {\r
-                $("#nextDoublePage .p,#currentDoublePage .p").hide().appendTo(this.e);\r
-                $("#currentDoublePage").append($(leftPage)).append($(rightPage));\r
-                $(leftPage).show();\r
-                $(rightPage).show();\r
-                $(".p.right").css({\r
-                    left: this.bookWidth / 2\r
-                });\r
-                $("#currentDoublePage,#nextDoublePage").css({\r
-                    x: 0,\r
-                    left: 0\r
-                });\r
-\r
-                $("#nextDoublePage").remove();\r
-                this.animating = false;\r
-            } else {\r
-                if (this.transition == '2d') {\r
-                    $("#widget").css('overflow', 'hidden');\r
-                    this.e.append('<div id="nextDoublePage"></div>');\r
-                    $(leftPage).show();\r
-                    $(rightPage).show();\r
-                    $("#nextDoublePage").append($(leftPage)).append($(rightPage));\r
-                    $(".p.right").css({\r
-                        left: this.bookWidth / 2\r
-                    });\r
-\r
-                    if (Modernizr.csstransitions) {\r
-                        $("#nextDoublePage").css({\r
-                            x: this.bookWidth * this.dir\r
-                        });\r
-                        $("#currentDoublePage").transition({\r
-                            x: this.bookWidth * this.dir * -1\r
-                        }, 1000);\r
-                        $("#nextDoublePage").transition({\r
-                            x: 0\r
-                        }, 1000, function () {\r
-                            $this.gotoPage(page, false)\r
-                        });\r
-                    } else {\r
-                        $("#nextDoublePage").css({\r
-                            left: this.bookWidth * this.dir\r
-                        });\r
-                        $("#currentDoublePage").animate({\r
-                            left: this.bookWidth * this.dir * -1\r
-                        }, 1000);\r
-                        $("#nextDoublePage").animate({\r
-                            left: 0\r
-                        }, 1000, function () {\r
-                            $this.gotoPage(page, false)\r
-                        });\r
-                    }\r
-                }\r
-                else if (this.transition == '3d') {\r
-                    $("#widget").css('overflow', 'visible');\r
-                    var nextFromClass;\r
-                    if (this.dir == 1) {\r
-                        nextFromClass = 'next';\r
-                    } else {\r
-                        nextFromClass = 'prev';\r
-                    }\r
-\r
-\r
-                    this.e.append('<div id="nextDoublePage" style="left:' + (this.bookWidth / 2) + 'px" class="' + nextFromClass + 'start _3d"></div>');\r
-\r
-                    $("#currentDoublePage .p").hide().appendTo(this.e);\r
-                    var leftTurn, rightTurn;\r
-                    if (this.dir == 1) {\r
-                        leftPage = $('.p[data-page=' + this.currentPage + ']');\r
-                        rightPage = $('.p[data-page=' + (page + 1) + ']');\r
-                        leftTurn = $('.p[data-page=' + page + ']');\r
-                        rightTurn = $('.p[data-page=' + (this.currentPage + 1) + ']');\r
-                    } else {\r
-                        leftPage = $('.p[data-page=' + page + ']');\r
-                        rightPage = $('.p[data-page=' + (this.currentPage + 1) + ']');\r
-                        leftTurn = $('.p[data-page=' + this.currentPage + ']');\r
-                        rightTurn = $('.p[data-page=' + (page + 1) + ']');\r
-                    }\r
-\r
-                    $(leftPage).show();\r
-                    $(rightPage).show();\r
-                    $(leftTurn).show();\r
-                    $(rightTurn).show();\r
-\r
-                    $("#currentDoublePage").append($(leftPage)).append($(rightPage));\r
-                    if (this.dir == -1) {\r
-                        $("#nextDoublePage").append($(leftTurn)).append($(rightTurn));\r
-                    } else {\r
-                        $("#nextDoublePage").append($(rightTurn)).append($(leftTurn));\r
-                    }\r
-                    $(".p.right").css({\r
-                        left: this.bookWidth / 2\r
-                    });\r
-\r
-                    $("#nextDoublePage").addClass(nextFromClass + 'end');\r
-\r
-                    $("#nextDoublePage").one(this.transitionendevents, function () {\r
-                        $this.animating = false;\r
-                        $this.gotoPage(page, false);\r
-                    });\r
-                }\r
-            }\r
-\r
-            this.currentPage = page;\r
-        },\r
-        goNextPage: function () {\r
-            var p;\r
-            if (this.dir == 1) {\r
-                p = this.currentPage + 2;\r
-                if (p > this.to) {\r
-                    p -= 4;\r
-                    this.dir = -1;\r
-                }\r
-            } else {\r
-                p = this.currentPage - 2;\r
-                if (p < this.from) {\r
-                    p += 4;\r
-                    this.dir = 1;\r
-                }\r
-            }\r
-\r
-            this.gotoPage(p, true)\r
-\r
-        },\r
-        resize: function () {\r
-            var w = $(window).width();\r
-            var h = $(window).height();\r
-\r
-            var s = Math.min((w * 0.95) / this.bookWidth, (h * 0.95) / this.bookHeight);\r
-\r
-            var iw = this.bookWidth * s;\r
-            var ih = this.bookHeight * s;\r
-\r
-            var x = (w - iw) / 2;\r
-            var y = (h - ih) / 2;\r
-\r
-            $("body,#container").css({\r
-                width: w,\r
-                maxWidth: w,\r
-                minWidth: w,\r
-                height: h,\r
-                maxHeight: h,\r
-                minHeight: h\r
-            });\r
-            $("#nextDoublePage").css({\r
-                width: this.bookWidth / 2,\r
-                maxWidth: this.bookWidth / 2,\r
-                minWidth: this.bookWidth / 2,\r
-                height: this.bookHeight,\r
-                maxHeight: this.bookHeight,\r
-                minHeight: this.bookHeight,\r
-                overflow: 'hidden'\r
-            })\r
-\r
-            this.e.css({\r
-                transformOrigin: '0% 0%',\r
-                x: x,\r
-                y: y,\r
-                scale: s\r
-            });\r
-        }\r
-    };\r
-\r
-    jQuery.fn.fluidbookWidget = function (from, to) {\r
-        return this.each(function () {\r
-            var $this = $(this);\r
-            widget = new FluidbookWidget($this, from, to);\r
-        })\r
-    };\r
-})(jQuery);\r
-\r
-function parseGet(res) {\r
-    if (res == undefined) {\r
-        res = {};\r
-    }\r
-    var couples = window.location.search.substr(1).split('&');\r
-    var couple = new Array();\r
-    for (var i = 0; i < couples.length; i++) {\r
-        couple = couples[i].split('=');\r
-        res[couple[0]] = couple[1];\r
-    }\r
-    return res;\r
-}\r
-\r
-function getColor(color) {\r
-    if (color == 'transparent' || color.substr(0, 3) == 'rgb') {\r
-        return color;\r
-    }\r
-    if (color.length == 6) {\r
-        return '#' + color;\r
-    }\r
-    return color;\r
-}\r
-\r
-function resize() {\r
-    widget.resize();\r
-}\r
-\r
+$(function () {
+    // Todo : manage other than html extensions
+    _GET = parseGet({
+        background: 'transparent',
+        target: '_blank',
+        link: '../index.' + DATAS.htmlExtension,
+        time: 4
+    });
+    _GET['time'] = Math.max(1.5, _GET['time']);
+
+    $("body").css('background-color', getColor(_GET['background']));
+
+    $(window).resize(function () {
+        resize();
+    });
+
+    var widget = $("#widget").fluidbookWidget(Math.max(0, DATAS.widgetStart), Math.min(DATAS.pages, DATAS.widgetEnd));
+    $(document).on('click', function () {
+        window.open(_GET['link'], _GET['target'], 'width=' + screen.width + ',height=' + screen.height + ',status=0,toolbar=0,menubar=0,scrollbars=1');
+    });
+});
+
+(function ($) {
+    function FluidbookWidget(e, from, to) {
+        this.transition = 'none';
+        if (Modernizr.csstransforms) {
+            this.transition = '2d';
+        }
+        if (Modernizr.csstransforms3d) {
+            this.transition = '3d';
+        }
+
+        this.started = false;
+        this.e = e;
+        this.from = from;
+        if (this.from % 2 == 1) {
+            this.from--;
+        }
+        this.to = to;
+        if (this.from % 2 == 0) {
+            this.to++;
+        }
+        this.to = Math.min(DATAS.pages, this.to);
+        this.currentPage = 0;
+        this.dir = 1;
+
+        this.bookWidth;
+        this.bookHeight;
+        this.init();
+
+        this.transitionendevents = ['transitionend'].join(' ');
+    }
+
+    FluidbookWidget.prototype = {
+        init: function () {
+            this.e.append('<div id="currentDoublePage"></div>');
+
+            // Init pages
+            for (i = this.from; i <= this.to; i++) {
+                var p = i;
+                if (p % 2 == 1) {
+                    p--;
+                }
+                var pclass = 'p';
+                var shade = '';
+                var side = 'left'
+                if (i % 2 == 1) {
+                    side = 'right';
+                }
+                if (i == 0) {
+                    pclass += ' loaded';
+                } else {
+                    shade = '<div class="shade"><img src="images/shadows/pages/' + side + '.png" /></div>';
+                }
+
+                pclass += ' ' + side;
+
+
+                this.e.append('<div class="' + pclass + '" data-page="' + i + '">' + shade + '</div>');
+            }
+
+            this.preloadImages();
+        },
+        preloadImages: function () {
+            var $this = this;
+            var p = this.e.find('.p:not(.loaded)').first();
+            if (p.length == 0) {
+                this.endLoading();
+                return;
+            }
+            var page = $(p).attr('data-page');
+            var image = new Image();
+            $(image).one('load error', function () {
+                $(p).append(this);
+                $(p).addClass('loaded');
+                $this.preloadImages();
+            });
+            image.src = 'data/background/36/t' + page + '.jpg';
+            if (image.complete) {
+                $(p).append(image);
+                $(p).addClass('loaded');
+                this.preloadImages();
+            }
+        },
+        endLoading: function () {
+            if (this.started) {
+                return;
+            }
+            this.started = true;
+            this.e.find('.p').hide();
+
+
+            var firstImage = $('.p>img').first().get(0);
+
+            this.bookWidth = firstImage.width * 2;
+            this.bookHeight = firstImage.height;
+
+
+            $("#widget").css({
+                width: this.bookWidth,
+                minWidth: this.bookWidth,
+                maxWidth: this.bookWidth,
+                height: this.bookHeight,
+                minHeight: this.bookHeight,
+                maxHeight: this.bookHeight
+            });
+
+            $(".p .shade img").css({
+                width: this.bookWidth / 6,
+                height: this.bookHeight
+            });
+
+            $(".p .shade").css({
+                width: this.bookWidth / 2,
+                height: this.bookHeight
+            })
+
+            $(".p").css({
+                width: this.bookWidth / 2,
+                height: this.bookHeight
+            })
+
+
+            this.gotoPage(0, false);
+            var $this = this;
+            setInterval(function () {
+                if ($this.animating) {
+                    return;
+                }
+                $this.goNextPage();
+            }, _GET['time'] * 1000);
+
+            $("#container:hidden").fadeIn();
+            this.resize();
+        },
+        gotoPage: function (page, transition) {
+            this.resize();
+            var $this = this;
+            this.animating = true;
+            var leftPage = $('.p[data-page=' + page + ']');
+            var rightPage = $('.p[data-page=' + (page + 1) + ']');
+
+            if (!transition || this.transition == 'none') {
+                $("#nextDoublePage .p,#currentDoublePage .p").hide().appendTo(this.e);
+                $("#currentDoublePage").append($(leftPage)).append($(rightPage));
+                $(leftPage).show();
+                $(rightPage).show();
+                $(".p.right").css({
+                    left: this.bookWidth / 2
+                });
+                $("#currentDoublePage,#nextDoublePage").css({
+                    x: 0,
+                    left: 0
+                });
+
+                $("#nextDoublePage").remove();
+                this.animating = false;
+            } else {
+                if (this.transition == '2d') {
+                    $("#widget").css('overflow', 'hidden');
+                    this.e.append('<div id="nextDoublePage"></div>');
+                    $(leftPage).show();
+                    $(rightPage).show();
+                    $("#nextDoublePage").append($(leftPage)).append($(rightPage));
+                    $(".p.right").css({
+                        left: this.bookWidth / 2
+                    });
+
+                    if (Modernizr.csstransitions) {
+                        $("#nextDoublePage").css({
+                            x: this.bookWidth * this.dir
+                        });
+                        $("#currentDoublePage").transition({
+                            x: this.bookWidth * this.dir * -1
+                        }, 1000);
+                        $("#nextDoublePage").transition({
+                            x: 0
+                        }, 1000, function () {
+                            $this.gotoPage(page, false)
+                        });
+                    } else {
+                        $("#nextDoublePage").css({
+                            left: this.bookWidth * this.dir
+                        });
+                        $("#currentDoublePage").animate({
+                            left: this.bookWidth * this.dir * -1
+                        }, 1000);
+                        $("#nextDoublePage").animate({
+                            left: 0
+                        }, 1000, function () {
+                            $this.gotoPage(page, false)
+                        });
+                    }
+                }
+                else if (this.transition == '3d') {
+                    $("#widget").css('overflow', 'visible');
+                    var nextFromClass;
+                    if (this.dir == 1) {
+                        nextFromClass = 'next';
+                    } else {
+                        nextFromClass = 'prev';
+                    }
+
+
+                    this.e.append('<div id="nextDoublePage" style="left:' + (this.bookWidth / 2) + 'px" class="' + nextFromClass + 'start _3d"></div>');
+
+                    $("#currentDoublePage .p").hide().appendTo(this.e);
+                    var leftTurn, rightTurn;
+                    if (this.dir == 1) {
+                        leftPage = $('.p[data-page=' + this.currentPage + ']');
+                        rightPage = $('.p[data-page=' + (page + 1) + ']');
+                        leftTurn = $('.p[data-page=' + page + ']');
+                        rightTurn = $('.p[data-page=' + (this.currentPage + 1) + ']');
+                    } else {
+                        leftPage = $('.p[data-page=' + page + ']');
+                        rightPage = $('.p[data-page=' + (this.currentPage + 1) + ']');
+                        leftTurn = $('.p[data-page=' + this.currentPage + ']');
+                        rightTurn = $('.p[data-page=' + (page + 1) + ']');
+                    }
+
+                    $(leftPage).show();
+                    $(rightPage).show();
+                    $(leftTurn).show();
+                    $(rightTurn).show();
+
+                    $("#currentDoublePage").append($(leftPage)).append($(rightPage));
+                    if (this.dir == -1) {
+                        $("#nextDoublePage").append($(leftTurn)).append($(rightTurn));
+                    } else {
+                        $("#nextDoublePage").append($(rightTurn)).append($(leftTurn));
+                    }
+                    $(".p.right").css({
+                        left: this.bookWidth / 2
+                    });
+
+                    $("#nextDoublePage").addClass(nextFromClass + 'end');
+
+                    $("#nextDoublePage").one(this.transitionendevents, function () {
+                        $this.animating = false;
+                        $this.gotoPage(page, false);
+                    });
+                }
+            }
+
+            this.currentPage = page;
+        },
+        goNextPage: function () {
+            var p;
+            if (this.dir == 1) {
+                p = this.currentPage + 2;
+                if (p > this.to) {
+                    p -= 4;
+                    this.dir = -1;
+                }
+            } else {
+                p = this.currentPage - 2;
+                if (p < this.from) {
+                    p += 4;
+                    this.dir = 1;
+                }
+            }
+
+            this.gotoPage(p, true)
+
+        },
+        resize: function () {
+            var w = $(window).width();
+            var h = $(window).height();
+
+            var s = Math.min((w * 0.95) / this.bookWidth, (h * 0.95) / this.bookHeight);
+
+            var iw = this.bookWidth * s;
+            var ih = this.bookHeight * s;
+
+            var x = (w - iw) / 2;
+            var y = (h - ih) / 2;
+
+            $("body,#container").css({
+                width: w,
+                maxWidth: w,
+                minWidth: w,
+                height: h,
+                maxHeight: h,
+                minHeight: h
+            });
+            $("#nextDoublePage").css({
+                width: this.bookWidth / 2,
+                maxWidth: this.bookWidth / 2,
+                minWidth: this.bookWidth / 2,
+                height: this.bookHeight,
+                maxHeight: this.bookHeight,
+                minHeight: this.bookHeight,
+                overflow: 'hidden'
+            })
+
+            this.e.css({
+                transformOrigin: '0% 0%',
+                x: x,
+                y: y,
+                scale: s
+            });
+        }
+    };
+
+    jQuery.fn.fluidbookWidget = function (from, to) {
+        return this.each(function () {
+            var $this = $(this);
+            widget = new FluidbookWidget($this, from, to);
+        })
+    };
+})(jQuery);
+
+function parseGet(res) {
+    if (res == undefined) {
+        res = {};
+    }
+    var couples = window.location.search.substr(1).split('&');
+    var couple = new Array();
+    for (var i = 0; i < couples.length; i++) {
+        couple = couples[i].split('=');
+        res[couple[0]] = couple[1];
+    }
+    return res;
+}
+
+function getColor(color) {
+    if (color == 'transparent' || color.substr(0, 3) == 'rgb') {
+        return color;
+    }
+    if (color.length == 6) {
+        return '#' + color;
+    }
+    return color;
+}
+
+function resize() {
+    widget.resize();
+}
+

diff --git a/style/fluidbook.less b/style/fluidbook.less
index 1d7341f48a73d5ff2f04bc0e0741c23d622aabbd..688fdef5f3dc3c1f1bd15d60909945e3f28f084a 100644 (file)
--- a/style/fluidbook.less
+++ b/style/fluidbook.less
@@ -6,11 +6,6 @@ use {
 }
 
 .notransition {
-
-       -moz-transition: none !important;
-       -webkit-transition: none !important;
-       -ms-transition: none !important;
-       -o-transition: none !important;
        transition: none !important;
 }
 
@@ -155,11 +150,6 @@ body, html {
 
 #main.fadeout, #view.fadeout {
        transition: opacity 500ms ease-out;
-       -moz-transition: opacity 500ms ease-out;
-       -webkit-transition: opacity 500ms ease-out;
-       -ms-transition: opacity 500ms ease-out;
-       -o-transition: opacity 500ms ease-out;
-
        opacity: 0;
 }
 
@@ -439,6 +429,11 @@ body, html {
                opacity: 0;
        }
 
+       .ios & {
+               transition-property: none !important;
+               transition-duration: 0 !important;
+       }
+
        > .shadow {
                position: absolute;
                left: 0;
@@ -629,25 +624,13 @@ body, html {
        top: 0;
        left: 0;
 
-       -moz-transition: -moz-transform @zoomtransition ease-out, transform @zoomtransition ease-out;
-       -webkit-transition: -webkit-transform @zoomtransition ease-out, transform @zoomtransition ease-out;
-       -o-transition: -o-transform @zoomtransition ease-out, transform @zoomtransition ease-out;
-       -ms-transition: -ms-transform @zoomtransition ease-out, transform @zoomtransition ease-out;
        transition: transform @zoomtransition ease-out;
 
        &.notransition {
-               -moz-transition: none;
-               -webkit-transition: none;
-               -o-transition: none;
-               -ms-transition: none;
                transition: none;
        }
 
        &.transition-inertia {
-               -moz-transition: -moz-transform-origin @zoomtransitioninertia ease-out, transform-origin @zoomtransitioninertia ease-out;
-               -webkit-transition: -webkit-transform-origin @zoomtransitioninertia ease-out, transform-origin @zoomtransitioninertia ease-out;
-               -o-transition: -o-transform-origin @zoomtransitioninertia ease-out, transform-origin @zoomtransitioninertia ease-out;
-               -ms-transition: -ms-transform-origin @zoomtransitioninertia ease-out, transform-origin @zoomtransitioninertia ease-out;
                transition: transform-origin @zoomtransitioninertia ease-out;
        }
 
@@ -676,10 +659,6 @@ body, html {
        direction: ltr;
 
        &.animate {
-               -moz-transition: all @zoomtransition ease-out;
-               -webkit-transition: all @zoomtransition ease-out;
-               -ms-transition: all @zoomtransition ease-out;
-               -o-transition: all @zoomtransition ease-out;
                transition: all @zoomtransition ease-out;
        }
 }
@@ -701,6 +680,10 @@ body, html {
        transition: opacity 250ms;
        opacity: 1;
 
+       .ios & {
+               transition: none;
+       }
+
        &.hidden {
                transition: none;
                opacity: 0;
@@ -855,10 +838,6 @@ footer a {
 /* Fluidbook zooming */
 
 footer, header, #interface {
-       -moz-transition: opacity 400ms ease-in, visibility 400ms ease-in;
-       -webkit-transition: opacity 400ms ease-in, visibility 400ms ease-in;
-       -o-transition: opacity 400ms ease-in, visibility 400ms ease-in;
-       -ms-transition: opacity 400ms ease-in, visibility 400ms ease-in;
        transition: opacity 400ms ease-in, visibility 400ms ease-in;
 
        &.hidden {
@@ -871,20 +850,16 @@ footer, header, #interface {
 #shadow {
        @shadow-zoom-transition: 400ms;
 
-       -moz-transition: opacity @shadow-zoom-transition ease-in, visibility @shadow-zoom-transition ease-in;
-       -webkit-transition: opacity @shadow-zoom-transition ease-in, visibility @shadow-zoom-transition ease-in;
-       -o-transition: opacity @shadow-zoom-transition ease-in, visibility @shadow-zoom-transition ease-in;
-       -ms-transition: opacity @shadow-zoom-transition ease-in, visibility @shadow-zoom-transition ease-in;
        transition: opacity @shadow-zoom-transition ease-in, visibility @shadow-zoom-transition ease-in;
 
        &.animate {
-               -moz-transition: all @zoomtransition ease-out;
-               -webkit-transition: all @zoomtransition ease-out;
-               -ms-transition: all @zoomtransition ease-out;
-               -o-transition: all @zoomtransition ease-out;
                transition: all @zoomtransition ease-out;
        }
 
+       .ios & {
+               transition: none !important;
+       }
+
        &.hidden {
                visibility: hidden;
                opacity: 0;
@@ -1154,10 +1129,6 @@ a.bookmark {
 
 // Hack for #1433
 html.ios body.portrait #interface {
-       -moz-transition: none;
-       -webkit-transition: none;
-       -o-transition: none;
-       -ms-transition: none;
        transition: none;
 }
 
@@ -1295,10 +1266,6 @@ html.ios body.portrait #interface {
 
        &[data-enabled], &:hover {
                opacity: 1 !important;
-               -moz-transition: none;
-               -webkit-transition: none;
-               -o-transition: none;
-               -ms-transition: none;
                transition: none;
        }
 }
@@ -1358,10 +1325,6 @@ html.ios body.portrait #interface {
 
        @menutransition: 400ms;
 
-       -webkit-transition: opacity @menutransition, top @menutransition;
-       -moz-transition: opacity @menutransition, top @menutransition;
-       -ms-transition: opacity @menutransition, top @menutransition;
-       -o-transition: opacity @menutransition, top @menutransition;
        transition: opacity @menutransition, top @menutransition;
 
        &[data-menu="multimedia"], &[data-menu="webvideo"], &[data-menu="video"], &[data-menu="externalchapters"], &[data-menu="iframe"], &[data-menu="text"], &[data-menu="zoomhd"] {
@@ -1620,10 +1583,6 @@ html.ios body.portrait #interface {
        }
 
        &.animate {
-               -moz-transition: -moz-transform 600ms ease-out, transform 600ms ease-out;
-               -webkit-transition: -webkit-transform 600ms ease-out;
-               -o-transition: -o-transform 600ms ease-out, transform 600ms ease-out;
-               -ms-transition: -ms-transform 600ms ease-out, transform 600ms ease-out;
                transition: transform 600ms ease-out;
        }
 
@@ -2216,30 +2175,12 @@ ul.chapters {
        opacity: 0;
        background-color: rgba(0, 0, 0, 0.6);
 
-       -moz-transition: all .15s ease-out;
-       -webkit-transition: all .15s ease-out;
-       -o-transition: all .15s ease-out;
-       -ms-transition: all .15s ease-out;
        transition: all .15s ease-out;
-
-       -moz-transform-origin: 50% 20px;
-       -webkit-transform-origin: 50% 20px;
-       -ms-transform-origin: 50% 20px;
-       -o-transform-origin: 50% 20px;
        transform-origin: 50% 20px;
-
-       -moz-transform: rotate(0deg);
-       -webkit-transform: rotate(0deg);
-       -ms-transform: rotate(0deg);
-       -o-transform: rotate(0deg);
        transform: rotate(0deg);
 }
 
 #down.right {
-       -moz-transform: rotate(-90deg);
-       -webkit-transform: rotate(-90deg);
-       -ms-transform: rotate(-90deg);
-       -o-transform: rotate(-90deg);
        transform: rotate(-90deg);
 }
 
@@ -2253,10 +2194,6 @@ ul.chapters {
 
 /* 2D */
 .doublePage._2d.sliding {
-       -moz-transition: none;
-       -webkit-transition: none;
-       -o-transition: none;
-       -ms-transition: none;
        transition: none;
 }
 
@@ -2280,16 +2217,7 @@ ul.chapters {
 
 /* 3D */
 #pages._3dtransition {
-       -moz-perspective-origin: 50% 75%;
-       -webkit-perspective-origin: 50% 75%;
-       -ms-perspective-origin: 50% 75%;
-       -o-perspective-origin: 50% 75%;
        perspective-origin: 50% 75%;
-
-       -moz-perspective: 5000px;
-       -webkit-perspective: 5000px;
-       -o-perspective: 5000px;
-       -ms-perspective: 5000px;
        perspective: 5000px;
 
        overflow: visible !important;
@@ -2299,18 +2227,10 @@ ul.chapters {
        overflow: visible;
        z-index: 100;
 
-       -moz-transform-style: preserve-3d;
-       -webkit-transform-style: preserve-3d;
-       -o-transform-style: preserve-3d;
-       -ms-transform-style: preserve-3d;
        transform-style: preserve-3d;
 }
 
 ._3d .page {
-       -moz-backface-visibility: hidden;
-       -webkit-backface-visibility: hidden;
-       -o-backface-visibility: hidden;
-       -ms-backface-visibility: hidden;
        backface-visibility: hidden;
 
        left: 0px !important;
@@ -2349,10 +2269,6 @@ ul.chapters {
        transform: rotate3d(0, 1, 0, 360deg);
        -moz-transform: rotateY(360deg) translate3d(0, 0, 0);
 
-       -moz-transform-origin: 0 0;
-       -webkit-transform-origin: 0 0;
-       -o-transform-origin: 0 0;
-       -ms-transform-origin: 0 0;
        transform-origin: 0 0;
 }
 
@@ -2916,5 +2832,5 @@ body > input {
 }
 
 #loadedcontents {
-       display: none;
+       display: block;
 }
\ No newline at end of file

diff --git a/style/interface.less b/style/interface.less
index c7387c7ce41e4a414c9b6dea92ab7d0629de4285..7a7f8d915c03df276d490528d6b3859f5f03f036 100644 (file)
--- a/style/interface.less
+++ b/style/interface.less
@@ -20,18 +20,14 @@
 
 #next, #previous, #down, #splash {
        transition: opacity 400ms ease-in-out;
-       -moz-transition: opacity 400ms ease-in-out;
-       -webkit-transition: opacity 400ms ease-in-out;
-       -o-transition: opacity 400ms ease-in-out;
-       -ms-transition: opacity 400ms ease-in-out;
+
+       .ios & {
+               transition: none;
+       }
 }
 
 #next.hidden.help, #previous.hidden.help {
        transition: none;
-       -moz-transition: none;
-       -webkit-transition: none;
-       -o-transition: none;
-       -ms-transition: none;
        opacity: 1;
 }