wip #2112 @1.5

diff --git a/js/libs/fluidbook/fluidbook.menu.js b/js/libs/fluidbook/fluidbook.menu.js
index 9e42ce78e8fc12db83fd8c1c8ccc01c000330e05..7c90875ab2ab19a6b6ba5dc10554728d832b4ff6 100644 (file)
--- a/js/libs/fluidbook/fluidbook.menu.js
+++ b/js/libs/fluidbook/fluidbook.menu.js
@@ -98,6 +98,8 @@ FluidbookMenu.prototype = {
             this.openText(param1, cb);
         } else if (view == 'slideshow') {
             this.openSlideshow(param1, cb);
+        } else if (view == 'iframe') {
+            this.openIframe(param1, cb);
         } else {
             this['open' + camelView](param1, param2, cb);
         }
@@ -149,6 +151,21 @@ FluidbookMenu.prototype = {
             callback();
         }
     },
+
+    openIframe: function (iframe, callback) {
+        var a = $('a[href="#/iframe/' + iframe + '"]');
+        var markup = decodeURIComponent($(a).attr('data-iframe'));
+        var view = '<div class="caption">' + this.closeButton() + '</div>';
+        view += '<div class="content noscroll"><div class="iframeHolder">';
+        view += markup;
+        view += '</div></div>';
+
+        $("#view").append('<div class="mview" dir="ltr" data-menu="iframe">' + view + '</div>');
+        if (callback != undefined) {
+            callback();
+        }
+    },
+
     openVideo: function (video, callback) {
         var a = $('a[href="#/video/' + video + '"]');
         var markup = decodeURIComponent($(a).attr('data-video'));
@@ -505,6 +522,16 @@ FluidbookMenu.prototype = {
             case 'locales':
                 w = 300;
                 break;
+            case 'iframe':
+                w = ww * 0.8;
+                h = hh * 0.8;
+                if (ww < 800) {
+                    w = ww;
+                    h = hh;
+                    fullscreen = true;
+                }
+                forceHeight=true;
+                break;
             case 'cart':
                 w = 1024;
                 if (ww < 1024) {
@@ -745,7 +772,7 @@ FluidbookMenu.prototype = {
         }
 
         if (!Modernizr.ftouch) {
-            m.find('.content').perfectScrollbar('update');
+            m.find('.content:not(.noscroll)').perfectScrollbar('update');
         }
 
         $("#popinOverlay>div").each(function () {

diff --git a/style/fluidbook.less b/style/fluidbook.less
index 778fc189bdc5f8274ab6828bd2d53589eacd0ba5..6b71b102ea4931d22961ca9ba2c2d69c8166da5a 100644 (file)
--- a/style/fluidbook.less
+++ b/style/fluidbook.less
@@ -1270,7 +1270,7 @@ html.ios body.portrait #interface {
        -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="multimedia"], &[data-menu="webvideo"], &[data-menu="video"], &[data-menu="externalchapters"], &[data-menu="iframe"] {
                .caption {
                        height: 0;
                        padding: 0;
@@ -1293,6 +1293,35 @@ html.ios body.portrait #interface {
 
        }
 
+       &[data-menu="iframe"] {
+               overflow: visible;
+               a, div {
+                       &.button.back {
+
+                               right: -30px;
+                       }
+               }
+
+               &.fs{
+                       a, div {
+                               &.button.back {
+                                       top: 0px;
+                                       right: 0px;
+                               }
+                       }
+               }
+
+               .iframeContainer,.iframeHolder{
+                       height: 100%;
+               }
+
+               .content{
+                       overflow: hidden;
+               }
+       }
+
+       &
+
        &[data-menu="externalchapters"] {
                .caption {
                        a, div {
@@ -1449,7 +1478,7 @@ html.ios body.portrait #interface {
                                line-height: 1;
                                z-index: 1;
 
-                               &.small{
+                               &.small {
                                        width: 30px;
                                        height: 30px;
                                        padding: 10px;