]> _ Git - fluidbook-html5.git/commitdiff
(no commit message)
authorVincent Vanwaelscappel <vincent@cubedesigners.com>
Mon, 14 Oct 2013 13:13:23 +0000 (13:13 +0000)
committerVincent Vanwaelscappel <vincent@cubedesigners.com>
Mon, 14 Oct 2013 13:13:23 +0000 (13:13 +0000)
_index.html
js/libs/fluidbook/fluidbook.js
js/libs/fluidbook/fluidbook.loader.js
js/main.js
style/fluidbook.css

index 2bd28589b0dedcbd0da5d90e60e3dacb0f7fcda1..298c93e2770b0d6e8f8f7c0a12557cd460f3ccbd 100644 (file)
@@ -46,5 +46,6 @@
                <div id="coquillette"></div>\r
                <div id="hiddencontents"><!-- $hiddenContents --></div>\r
                <div id="splash"><!-- $splash --></div>\r
+               <div id="popinOverlay"></div>\r
        </body>\r
 </html>
\ No newline at end of file
index 6c04d5d22877b5897f81272279d368a9374078e6..988fe9bc09543c1a2bd325f6a2bf48c7e762d726 100644 (file)
@@ -116,9 +116,15 @@ Fluidbook.prototype = {
                this.ready();\r
                $("#main").css('visibility', 'visible');\r
                this.hideLoader(0, true);\r
-               $("#splash").css('opacity', 0).one(this.support.getTransitionEndEvent(true), function() {\r
-                       $(this).remove();\r
-               });\r
+               if (this.support.transitions2d) {\r
+                       $("#splash").css('opacity', 0).one(this.support.getTransitionEndEvent(true), function() {\r
+                               $(this).remove();\r
+                       });\r
+               } else {\r
+                       $("#splash").fadeOut(500, function() {\r
+                               $(this.remove());\r
+                       })\r
+               }\r
 \r
        },\r
        ready: function() {\r
@@ -731,7 +737,7 @@ Fluidbook.prototype = {
 \r
                this.displayLoader();\r
                this.resetWaiters();\r
-               \r
+\r
                setTimeout(function() {\r
                        $this._openView(view, param1, param2, callback);\r
                }, 20);\r
@@ -759,7 +765,7 @@ Fluidbook.prototype = {
                        search: 'thumbnails',\r
                        bookmark: 'thumbnails',\r
                        video: 'extras'};\r
-               \r
+\r
                if (this.gal != null && preload[view] != undefined) {\r
                        var w = this.addWaiter(true);\r
                        this.gal.downloadAndCall(preload[view], function() {\r
index dbeefa6a3d3303cdbbd527717231ca93cedcc8ee..0d15f9c9da5eec930942dd3241ba6b83194de41d 100644 (file)
@@ -6,7 +6,7 @@ function FluidbookLoader(fluidbook) {
        this.toPreload = [];
        this.numPreload = 0;
        this.imagesErrors = [];
-
 }
 
 FluidbookLoader.prototype = {
index 85b3bc9d65f42c2c30da177bac0283486dd07eeb..2a8d663fc605084167ed1817fc81e331f8eabc3a 100644 (file)
@@ -201,6 +201,39 @@ function initEvents() {
                return false;
        });
 
+       $(document).on('click', "#popinOverlay", function() {
+               closePopin();
+               return false;
+       });
+
+       $(document).on('click', 'a.popin', function() {
+               var iframeid = 'iframe_' + Math.round(Math.random() * 100000);
+
+               var html = '<div style="width:' + $(this).data('width') + 'px;height:' + $(this).data('height') + 'px"><iframe id="' + iframeid + '" width="' + $(this).data('width') + '" height="' + $(this).data('height') + '" src="' + $(this).data('src') + '" frameborder="0"></iframe></div>';
+               $("#popinOverlay").append(html).show();
+
+               var frame = $("#" + iframeid)
+
+               $(frame).load(function() {
+                       var f=$(frame).contents();
+                       $(f).click(function(e){
+                               if($(e.target).hasClass('closePopup')){
+                                       closePopin();
+                                       return;
+                               }
+                               $(e.target).parents().each(function(){
+                                       if($(this).hasClass('closePopup')){
+                                               closePopin();
+                                               return;
+                                       }
+                               });
+                       });
+               });
+
+               resize();
+               return false;
+       });
+
        $(document).on('click', 'a.appswitchlocale', function() {
                try {
                        fluidbook.displayLoader();
@@ -329,6 +362,16 @@ function resize(init) {
                init = false;
        }
        fluidbook.resize.resize(init);
+
+       var ww = $(window).width();
+       var wh = $(window).height();
+       $("#popinOverlay>div").each(function() {
+               $(this).css({
+                       top: (wh - $(this).outerHeight()) / 2,
+                       left: (ww - $(this).outerWidth()) / 2
+               });
+       });
+
 }
 
 function goNextPage(e) {
@@ -399,6 +442,10 @@ function cacheUpdated(e) {
        }
 }
 
+function closePopin() {
+       $("#popinOverlay").html('').hide();
+}
+
 (function() {
        var proxied = window.alert;
        window.alert = function() {
index 5e8e69f226ac7e519c605c095ede2472225da1ea..0266ed18574f14ddf59b9d40f09399c34e814950 100644 (file)
@@ -1495,6 +1495,31 @@ a.button{
        position:absolute;\r
 }\r
 \r
+#popinOverlay{\r
+       position:absolute;\r
+       z-index: 29;\r
+       top:0px;\r
+       left:0px;\r
+       width:100%;\r
+       height: 100%;\r
+       background-color: rgba(0,0,0,0.3);\r
+       display:none;\r
+}\r
+\r
+\r
+#popinOverlay iframe{\r
+       background-color:#fff;\r
+       overflow:hidden;\r
+}\r
+\r
+#popinOverlay>*{\r
+       position:absolute;\r
+       z-index: 30;\r
+       top:0px;\r
+       left:0px;\r
+\r
+}\r
+\r
 /* Tooltip */\r
 #tooltip{\r
        position:absolute;\r
@@ -1508,14 +1533,14 @@ a.button{
        z-index: 100;\r
 }\r
 \r
-@media all and (orientation: portrait) {  \r
+@media handled and (orientation: portrait) {  \r
        #ol{display:none;}\r
-       @-ms-viewport { width: 640px; }\r
+       @-ms-viewport { width: 800px; }\r
 }  \r
 \r
-@media all and (orientation: landscape) {  \r
+@media handled and (orientation: landscape) {  \r
        #op{display:none;}\r
-       @-ms-viewport { width: 1024px; }\r
+       @-ms-viewport { width: 1280px; }\r
 }  \r
 \r
 /* Webfonts*/\r