Dbrant has uploaded a new change for review.

  https://gerrit.wikimedia.org/r/173285

Change subject: Display fallback math images when MathML is enabled.
......................................................................

Display fallback math images when MathML is enabled.

When MathML is enabled for a logged-in user, the actual MathML spans are
not displayed in the WebView because they're wrapped in a span that has a
style of "display: none".  This is actually a good thing, since MathML is
still not fully supported in the Android WebView. However, the fallback
PNG image for displaying the formula is inside a "meta" tag, and is
therefore not rendered by the WebView either.

This patch looks for these fallback meta tags, and changes them to "div"
tags, so that the fallback image is displayed correctly.

Bug: 73419
Change-Id: I443933ff86e86046ebd493ef4f51f2395ae19ad0
---
M wikipedia/assets/bundle.js
M www/js/transforms.js
2 files changed, 49 insertions(+), 1 deletion(-)


  git pull ssh://gerrit.wikimedia.org:29418/apps/android/wikipedia 
refs/changes/85/173285/1

diff --git a/wikipedia/assets/bundle.js b/wikipedia/assets/bundle.js
index be760a5..9d6d091 100644
--- a/wikipedia/assets/bundle.js
+++ b/wikipedia/assets/bundle.js
@@ -865,6 +865,30 @@
        return content;
 } );
 
+transformer.register( "section", function( content ) {
+    // Look for <meta> tags with a "math-fallback" class, which implies that 
the page
+    // is trying to display MathML content, which our WebView doesn't support 
well.
+    // We will take the <meta> tags and convert them to <div>s, so that the 
fallback PNG
+    // image for the math formula is displayed correctly.
+       var metaTags = content.querySelectorAll( 'meta' );
+       for ( var i = 0; i < metaTags.length; i++ ) {
+               var metaTag = metaTags[i];
+               // is this a math formula fallback image?
+        for ( var c = 0; c < metaTag.classList.length; c++ ) {
+            if (metaTag.classList[c].indexOf("math-fallback") > -1) {
+                // change this tag to a div!
+                var newDiv = document.createElement( 'div' );
+                newDiv.style.cssText = metaTag.style.cssText;
+                // make sure it doesn't get wider than our viewport
+                newDiv.style.maxWidth = "100%";
+                metaTag.parentNode.replaceChild(newDiv, metaTag);
+                break;
+            }
+        }
+       }
+       return content;
+} );
+
 
},{"./bridge":2,"./night":8,"./transformer":11}],13:[function(require,module,exports){
 /**
  * MIT LICENSCE
@@ -1144,4 +1168,4 @@
 
 try { module.exports = parseCSSColor } catch(e) { }
 
-},{}]},{},[6,14,7,8,11,12,2,1,4,5,3,10,9,13])
+},{}]},{},[6,14,7,8,11,12,2,1,4,5,3,10,9,13])
\ No newline at end of file
diff --git a/www/js/transforms.js b/www/js/transforms.js
index 430d43a..5f54e55 100644
--- a/www/js/transforms.js
+++ b/www/js/transforms.js
@@ -242,3 +242,27 @@
        }
        return content;
 } );
+
+transformer.register( "section", function( content ) {
+    // Look for <meta> tags with a "math-fallback" class, which implies that 
the page
+    // is trying to display MathML content, which our WebView doesn't support 
well.
+    // We will take the <meta> tags and convert them to <div>s, so that the 
fallback PNG
+    // image for the math formula is displayed correctly.
+       var metaTags = content.querySelectorAll( 'meta' );
+       for ( var i = 0; i < metaTags.length; i++ ) {
+               var metaTag = metaTags[i];
+               // is this a math formula fallback image?
+        for ( var c = 0; c < metaTag.classList.length; c++ ) {
+            if (metaTag.classList[c].indexOf("math-fallback") > -1) {
+                // change this tag to a div!
+                var newDiv = document.createElement( 'div' );
+                newDiv.style.cssText = metaTag.style.cssText;
+                // make sure it doesn't get wider than our viewport
+                newDiv.style.maxWidth = "100%";
+                metaTag.parentNode.replaceChild(newDiv, metaTag);
+                break;
+            }
+        }
+       }
+       return content;
+} );

-- 
To view, visit https://gerrit.wikimedia.org/r/173285
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings

Gerrit-MessageType: newchange
Gerrit-Change-Id: I443933ff86e86046ebd493ef4f51f2395ae19ad0
Gerrit-PatchSet: 1
Gerrit-Project: apps/android/wikipedia
Gerrit-Branch: master
Gerrit-Owner: Dbrant <[email protected]>

_______________________________________________
MediaWiki-commits mailing list
[email protected]
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits

Reply via email to