submodule

lib/Readium.js

@@ -726,6 +726,8 @@ ReadiumSDK.Models.ViewerSettings = function(settingsData) {
 
     this.mediaOverlaysAutomaticPageTurn = true;
 
+    this.enableGPUHardwareAccelerationCSS3D = true;
+
     // -1 ==> disable
     // [0...n] ==> index of transition in pre-defined array
     this.pageTransition = -1;
@@ -778,6 +780,7 @@ ReadiumSDK.Models.ViewerSettings = function(settingsData) {
         mapProperty("scroll", settingsData);
         mapProperty("syntheticSpread", settingsData);
         mapProperty("pageTransition", settingsData);
+        mapProperty("enableGPUHardwareAccelerationCSS3D", settingsData);
     };
 
     this.update(settingsData);
@@ -17821,8 +17824,16 @@ ReadiumSDK.Views.OnePageView = function(options, classes, enableBookStyleOverrid
             _$el.css("height", "100%");
             _$el.css("width", "100%");
 
-            // This fixes rendering issues with WebView (native apps), which clips content embedded in iframes unless GPU hardware acceleration is enabled for CSS rendering.
-            _$el.css("transform", "translateZ(0)");
+            var settings = _viewSettings;
+            if (!settings)
+            {
+                //defaults
+                settings = new ReadiumSDK.Models.ViewerSettings({});
+            }
+            if (settings.enableGPUHardwareAccelerationCSS3D) {
+                // This fixes rendering issues with WebView (native apps), which clips content embedded in iframes unless GPU hardware acceleration is enabled for CSS rendering.
+                _$el.css("transform", "translateZ(0)");
+            }
 
             for(var i = 0, count = classes.length; i < count; i++) {
                 _$el.addClass(classes[i]);
@@ -19454,8 +19465,16 @@ ReadiumSDK.Views.ReflowableView = function(options, reader){
         _$el = $(template);
         _$viewport.append(_$el);
 
-        // This fixes rendering issues with WebView (native apps), which clips content embedded in iframes unless GPU hardware acceleration is enabled for CSS rendering.
-        _$el.css("transform", "translateZ(0)");
+        var settings = _viewSettings;
+        if (!settings)
+        {
+            //defaults
+            settings = new ReadiumSDK.Models.ViewerSettings({});
+        }
+        if (settings.enableGPUHardwareAccelerationCSS3D) {
+            // This fixes rendering issues with WebView (native apps), which clips content embedded in iframes unless GPU hardware acceleration is enabled for CSS rendering.
+            _$el.css("transform", "translateZ(0)");
+        }
 
         // See ReaderView.handleViewportResize
         // var lazyResize = _.debounce(self.onViewportResize, 100);
@@ -21159,7 +21178,11 @@ ReadiumSDK.Views.IFrameLoader = function (options) {
         iframe.setAttribute("data-baseUri", iframe.baseURI);
         iframe.setAttribute("data-src", src);
 
-        var loadedDocumentUri = new URI(src).absoluteTo(iframe.baseURI).toString();
+        var iframeBaseURI = new URI(iframe.baseURI).search('').hash('').toString();
+
+        var loadedDocumentUri = new URI(src).absoluteTo(iframeBaseURI).toString();
+
+        iframe.setAttribute("data-uri", loadedDocumentUri);
 
         var contentType = 'text/html';
         if (attachedData.spineItem.media_type && attachedData.spineItem.media_type.length) {
@@ -21266,10 +21289,14 @@ ReadiumSDK.Views.IFrameLoader = function (options) {
                 return;
             }
 
-            var sourceParts = src.split("/");
-            sourceParts.pop(); //remove source file name
+            var root = new URI(src).search('').hash('').toString();
 
-            var base = "<base href=\"" + sourceParts.join("/") + "/" + "\"/>";
+            // The filename *must* be preserved so that #xx fragment identifiers can be resolved against the correct HTML!
+            // var sourceParts = src.split("/");
+            // sourceParts.pop(); //remove source file name
+            // root = sourceParts.join("/") + '/';
+
+            var base = "<base href=\"" + root + "\" />";
 
             var scripts = "<script type=\"text/javascript\">(" + injectedScript.toString() + ")()<\/script>";
 
@@ -21278,6 +21305,12 @@ ReadiumSDK.Views.IFrameLoader = function (options) {
             }
 
             var mangledContent = contentDocumentHtml.replace(/(<head.*?>)/, "$1" + base + scripts);
+
+            // TODO: xml:base unfortunately does not solve the SVG clipPath/gradient problems (#xxx fragment identifier not resolving to full URI)
+            // (works for XLINK though!)
+            mangledContent = mangledContent.replace(/<body/, "<body xml:base=\"" + root + "\"");
+            mangledContent = mangledContent.replace(/<svg/g, "<svg xml:base=\"" + root + "\"");
+
             callback(mangledContent);
         });
     }
@@ -23374,9 +23407,17 @@ ReadiumSDK.Views.ScrollView = function(options, isContinuousScroll, reader){
         _$contentFrame.css("height", "100%");
         _$contentFrame.css("position", "relative");
 
-        // This is a necessary counterpart for the same CSS GPU hardware acceleration trick in one_page_view.js
-        // This affects the stacking order and re-enables the scrollbar in Safari (works fine in Chrome otherwise)
-        _$contentFrame.css("transform", "translateZ(0)");
+        var settings = _viewSettings;
+        if (!settings)
+        {
+            //defaults
+            settings = new ReadiumSDK.Models.ViewerSettings({});
+        }
+        if (settings.enableGPUHardwareAccelerationCSS3D) {
+            // This is a necessary counterpart for the same CSS GPU hardware acceleration trick in one_page_view.js
+            // This affects the stacking order and re-enables the scrollbar in Safari (works fine in Chrome otherwise)
+            _$contentFrame.css("transform", "translateZ(0)");
+        }
 
         // _$contentFrame.css("box-sizing", "border-box");
         // _$contentFrame.css("border", "20px solid red");