jenkins-bot has submitted this change and it was merged.
Change subject: Disable some DOM transformations for RESTBase users
......................................................................
Disable some DOM transformations for RESTBase users
The DOM transformations that can be handled by the service
are handled by it (I9437791ba8f5953be98546f76a6d15437cb58fc2).
Thus these don't need to be run again on the client.
Esp. moving the first paragraph around twice would be undesirable.
So we can better keep track what has been moved to the service
I moved the file that implement these transformations to a service
sub-folder.
I've added small notes at the end of the call to the respective DOM
transformations which have not been moved to the service (yet),
indicating the category of the reason why that has not yet been done.
Theses reasons are:
* we need to add a clickHandler,
* it's a dynamic client setting (dark mode), or
* the transformation depends on the device width.
I think the clickHandler transformations could
potentially be split up into two parts. The pure DOM transformation
and the addition of the clickHandler. We then could move the first
part tot he service, too.
Bug: T111443
Change-Id: Ibf76222d0ba10520797397fdbd95205c9f7d995b
---
M app/src/main/assets/bundle.js
M app/src/main/java/org/wikipedia/page/JsonPageLoadStrategy.java
M www/Gruntfile.js
M www/js/sections.js
M www/js/transforms.js
R www/js/transforms/service/anchorPopUpMediaTransforms.js
R www/js/transforms/service/hideRedLinks.js
R www/js/transforms/service/relocateFirstParagraph.js
R www/js/transforms/service/setMathFormulaImageMaxWidth.js
9 files changed, 131 insertions(+), 102 deletions(-)
Approvals:
Mholloway: Looks good to me, approved
Niedzielski: Looks good to me, but someone else must approve
jenkins-bot: Verified
diff --git a/app/src/main/assets/bundle.js b/app/src/main/assets/bundle.js
index e54e379..8b9b3cd 100644
--- a/app/src/main/assets/bundle.js
+++ b/app/src/main/assets/bundle.js
@@ -484,6 +484,7 @@
window.string_expand_refs = payload.string_expand_refs;
window.pageTitle = payload.title;
window.isMainPage = payload.isMainPage;
+ window.fromRestBase = payload.fromRestBase;
window.isBeta = payload.isBeta;
window.siteLanguage = payload.siteLanguage;
@@ -491,18 +492,23 @@
// dimension measurements for items.
document.getElementById( "content" ).appendChild( content );
- transformer.transform( "moveFirstGoodParagraphUp" );
- transformer.transform( "addDarkModeStyles", content );
- transformer.transform( "hideRedLinks", content );
- transformer.transform( "setDivWidth", content );
- transformer.transform( "setMathFormulaImageMaxWidth", content );
- transformer.transform( "anchorPopUpMediaTransforms", content );
- transformer.transform( "hideIPA", content );
+ // Content service transformations
+ if (!window.fromRestBase) {
+ transformer.transform( "moveFirstGoodParagraphUp" );
+ transformer.transform( "hideRedLinks", content );
+ transformer.transform( "setMathFormulaImageMaxWidth", content );
+ transformer.transform( "anchorPopUpMediaTransforms", content );
+ }
+
+ // client only transformations:
+ transformer.transform( "addDarkModeStyles", content ); // client setting
+ transformer.transform( "setDivWidth", content ); // offsetWidth
+ transformer.transform( "hideIPA", content ); // clickHandler
if (!window.isMainPage) {
- transformer.transform( "hideTables", content );
- transformer.transform( "addImageOverflowXContainers", content );
- transformer.transform( "widenImages", content );
+ transformer.transform( "hideTables", content ); // clickHandler
+ transformer.transform( "addImageOverflowXContainers", content ); //
offsetWidth
+ transformer.transform( "widenImages", content ); // offsetWidth
}
// insert the edit pencil
@@ -567,17 +573,23 @@
content.setAttribute( "dir", window.directionality );
content.innerHTML = section.text;
content.id = "content_block_" + section.id;
- transformer.transform( "addDarkModeStyles", content );
- transformer.transform( "hideRedLinks", content );
- transformer.transform( "setDivWidth", content );
- transformer.transform( "setMathFormulaImageMaxWidth", content );
- transformer.transform( "anchorPopUpMediaTransforms", content );
- transformer.transform( "hideIPA", content );
- transformer.transform( "hideRefs", content );
+
+ // Content service transformations
+ if (!window.fromRestBase) {
+ transformer.transform( "hideRedLinks", content );
+ transformer.transform( "setMathFormulaImageMaxWidth", content );
+ transformer.transform( "anchorPopUpMediaTransforms", content );
+ }
+
+ transformer.transform( "addDarkModeStyles", content ); // client setting
+ transformer.transform( "setDivWidth", content ); // offsetWidth
+ transformer.transform( "hideIPA", content ); // clickHandler
+ transformer.transform( "hideRefs", content ); // clickHandler
+
if (!window.isMainPage) {
- transformer.transform( "hideTables", content );
- transformer.transform( "addImageOverflowXContainers", content );
- transformer.transform( "widenImages", content );
+ transformer.transform( "hideTables", content ); // clickHandler
+ transformer.transform( "addImageOverflowXContainers", content ); //
offsetWidth
+ transformer.transform( "widenImages", content ); // offsetWidth
}
return [ heading, content ];
@@ -744,38 +756,6 @@
},{"../transformer":12,"../utilities":24}],15:[function(require,module,exports){
var transformer = require("../transformer");
-transformer.register( "anchorPopUpMediaTransforms", function( content ) {
- // look for video thumbnail containers (divs that have class
"PopUpMediaTransform"),
- // and enclose them in an anchor that will lead to the correct click
handler...
- var mediaDivs = content.querySelectorAll( 'div.PopUpMediaTransform' );
- for ( var i = 0; i < mediaDivs.length; i++ ) {
- var mediaDiv = mediaDivs[i];
- var imgTags = mediaDiv.querySelectorAll( 'img' );
- if (imgTags.length === 0) {
- continue;
- }
- // the first img element is the video thumbnail, and its 'alt'
attribute is
- // the file name of the video!
- if (!imgTags[0].getAttribute( 'alt' )) {
- continue;
- }
- // also, we should hide the "Play media" link that appears
under the thumbnail,
- // since we don't need it.
- var aTags = mediaDiv.querySelectorAll( 'a' );
- if (aTags.length > 0) {
- aTags[0].parentNode.removeChild(aTags[0]);
- }
- var containerLink = document.createElement( 'a' );
- containerLink.setAttribute( 'href', imgTags[0].getAttribute( 'alt' ) );
- containerLink.classList.add( 'app_media' );
- mediaDiv.parentNode.insertBefore(containerLink, mediaDiv);
- mediaDiv.parentNode.removeChild(mediaDiv);
- containerLink.appendChild(imgTags[0]);
- }
-} );
-},{"../transformer":12}],16:[function(require,module,exports){
-var transformer = require("../transformer");
-
/*
Tries to get an array of table header (TH) contents from a given table.
If there are no TH elements in the table, an empty array is returned.
@@ -913,7 +893,7 @@
module.exports = {
handleTableCollapseOrExpandClick: handleTableCollapseOrExpandClick
};
-},{"../transformer":12}],17:[function(require,module,exports){
+},{"../transformer":12}],16:[function(require,module,exports){
var transformer = require("../transformer");
var bridge = require("../bridge");
@@ -962,20 +942,7 @@
containerSpan.onclick = ipaClickHandler;
}
} );
-},{"../bridge":2,"../transformer":12}],18:[function(require,module,exports){
-var transformer = require("../transformer");
-
-transformer.register( "hideRedLinks", function( content ) {
- var redLinks = content.querySelectorAll( 'a.new' );
- for ( var i = 0; i < redLinks.length; i++ ) {
- var redLink = redLinks[i];
- var replacementSpan = document.createElement( 'span' );
- replacementSpan.innerHTML = redLink.innerHTML;
- replacementSpan.setAttribute( 'class', redLink.getAttribute(
'class' ) );
- redLink.parentNode.replaceChild( replacementSpan, redLink );
- }
-} );
-},{"../transformer":12}],19:[function(require,module,exports){
+},{"../bridge":2,"../transformer":12}],17:[function(require,module,exports){
var transformer = require("../transformer");
var collapseTables = require("./collapseTables");
@@ -1021,8 +988,54 @@
bottomDiv.onclick = collapseTables.handleTableCollapseOrExpandClick;
}
} );
-},{"../transformer":12,"./collapseTables":16}],20:[function(require,module,exports){
-var transformer = require("../transformer");
+},{"../transformer":12,"./collapseTables":15}],18:[function(require,module,exports){
+var transformer = require("../../transformer");
+
+transformer.register( "anchorPopUpMediaTransforms", function( content ) {
+ // look for video thumbnail containers (divs that have class
"PopUpMediaTransform"),
+ // and enclose them in an anchor that will lead to the correct click
handler...
+ var mediaDivs = content.querySelectorAll( 'div.PopUpMediaTransform' );
+ for ( var i = 0; i < mediaDivs.length; i++ ) {
+ var mediaDiv = mediaDivs[i];
+ var imgTags = mediaDiv.querySelectorAll( 'img' );
+ if (imgTags.length === 0) {
+ continue;
+ }
+ // the first img element is the video thumbnail, and its 'alt'
attribute is
+ // the file name of the video!
+ if (!imgTags[0].getAttribute( 'alt' )) {
+ continue;
+ }
+ // also, we should hide the "Play media" link that appears
under the thumbnail,
+ // since we don't need it.
+ var aTags = mediaDiv.querySelectorAll( 'a' );
+ if (aTags.length > 0) {
+ aTags[0].parentNode.removeChild(aTags[0]);
+ }
+ var containerLink = document.createElement( 'a' );
+ containerLink.setAttribute( 'href', imgTags[0].getAttribute( 'alt' ) );
+ containerLink.classList.add( 'app_media' );
+ mediaDiv.parentNode.insertBefore(containerLink, mediaDiv);
+ mediaDiv.parentNode.removeChild(mediaDiv);
+ containerLink.appendChild(imgTags[0]);
+ }
+} );
+
+},{"../../transformer":12}],19:[function(require,module,exports){
+var transformer = require("../../transformer");
+
+transformer.register( "hideRedLinks", function( content ) {
+ var redLinks = content.querySelectorAll( 'a.new' );
+ for ( var i = 0; i < redLinks.length; i++ ) {
+ var redLink = redLinks[i];
+ var replacementSpan = document.createElement( 'span' );
+ replacementSpan.innerHTML = redLink.innerHTML;
+ replacementSpan.setAttribute( 'class', redLink.getAttribute(
'class' ) );
+ redLink.parentNode.replaceChild( replacementSpan, redLink );
+ }
+} );
+},{"../../transformer":12}],20:[function(require,module,exports){
+var transformer = require("../../transformer");
// Move the first non-empty paragraph (and related elements) to the top of the
section.
// This will have the effect of shifting the infobox and/or any images at the
top of the page
@@ -1105,8 +1118,8 @@
}
}
-},{"../transformer":12}],21:[function(require,module,exports){
-var transformer = require("../transformer");
+},{"../../transformer":12}],21:[function(require,module,exports){
+var transformer = require("../../transformer");
transformer.register( "setMathFormulaImageMaxWidth", function( content ) {
// Prevent horizontally scrollable pages by checking for math formula
images (which are
@@ -1122,7 +1135,7 @@
}
}
} );
-},{"../transformer":12}],22:[function(require,module,exports){
+},{"../../transformer":12}],22:[function(require,module,exports){
var transformer = require("../transformer");
transformer.register( "setDivWidth", function( content ) {
@@ -1344,4 +1357,4 @@
firstAncestorWithMultipleChildren: firstAncestorWithMultipleChildren
};
-},{}]},{},[2,7,24,12,13,14,15,16,17,18,19,20,21,22,23,1,3,4,5,6,8,9,10,11])
\ No newline at end of file
+},{}]},{},[2,7,24,12,13,14,15,16,17,22,23,18,19,20,21,1,3,4,5,6,8,9,10,11])
\ No newline at end of file
diff --git a/app/src/main/java/org/wikipedia/page/JsonPageLoadStrategy.java
b/app/src/main/java/org/wikipedia/page/JsonPageLoadStrategy.java
index 88bea62..0d564e9 100644
--- a/app/src/main/java/org/wikipedia/page/JsonPageLoadStrategy.java
+++ b/app/src/main/java/org/wikipedia/page/JsonPageLoadStrategy.java
@@ -18,6 +18,7 @@
import org.wikipedia.pageimages.PageImagesTask;
import org.wikipedia.savedpages.LoadSavedPageTask;
import org.wikipedia.search.SearchBarHideHandler;
+import org.wikipedia.settings.Prefs;
import org.wikipedia.util.DimenUtil;
import org.wikipedia.util.L10nUtil;
import org.wikipedia.util.PageLoadUtil;
@@ -620,6 +621,7 @@
.put("isBeta", app.isPreProdRelease()) // True for any
non-production release type
.put("siteLanguage",
model.getTitle().getSite().getLanguageCode())
.put("isMainPage", page.isMainPage())
+ .put("fromRestBase", Prefs.useRestBase())
.put("apiLevel", Build.VERSION.SDK_INT);
} catch (JSONException e) {
throw new RuntimeException(e);
diff --git a/www/Gruntfile.js b/www/Gruntfile.js
index 3402e96..b614c64 100644
--- a/www/Gruntfile.js
+++ b/www/Gruntfile.js
@@ -5,6 +5,7 @@
"js/utilities.js",
"js/transformer.js",
"js/transforms/*.js",
+ "js/transforms/service/*.js",
"js/actions.js",
"js/disambig.js",
"js/editaction.js",
@@ -38,6 +39,7 @@
"js/utilities.js",
"js/transformer.js",
"js/transforms/*.js",
+ "js/transforms/service/*.js",
"js/actions.js",
"js/disambig.js",
"js/editaction.js",
diff --git a/www/js/sections.js b/www/js/sections.js
index 5f09550..d5446e5 100644
--- a/www/js/sections.js
+++ b/www/js/sections.js
@@ -82,6 +82,7 @@
window.string_expand_refs = payload.string_expand_refs;
window.pageTitle = payload.title;
window.isMainPage = payload.isMainPage;
+ window.fromRestBase = payload.fromRestBase;
window.isBeta = payload.isBeta;
window.siteLanguage = payload.siteLanguage;
@@ -89,18 +90,23 @@
// dimension measurements for items.
document.getElementById( "content" ).appendChild( content );
- transformer.transform( "moveFirstGoodParagraphUp" );
- transformer.transform( "addDarkModeStyles", content );
- transformer.transform( "hideRedLinks", content );
- transformer.transform( "setDivWidth", content );
- transformer.transform( "setMathFormulaImageMaxWidth", content );
- transformer.transform( "anchorPopUpMediaTransforms", content );
- transformer.transform( "hideIPA", content );
+ // Content service transformations
+ if (!window.fromRestBase) {
+ transformer.transform( "moveFirstGoodParagraphUp" );
+ transformer.transform( "hideRedLinks", content );
+ transformer.transform( "setMathFormulaImageMaxWidth", content );
+ transformer.transform( "anchorPopUpMediaTransforms", content );
+ }
+
+ // client only transformations:
+ transformer.transform( "addDarkModeStyles", content ); // client setting
+ transformer.transform( "setDivWidth", content ); // offsetWidth
+ transformer.transform( "hideIPA", content ); // clickHandler
if (!window.isMainPage) {
- transformer.transform( "hideTables", content );
- transformer.transform( "addImageOverflowXContainers", content );
- transformer.transform( "widenImages", content );
+ transformer.transform( "hideTables", content ); // clickHandler
+ transformer.transform( "addImageOverflowXContainers", content ); //
offsetWidth
+ transformer.transform( "widenImages", content ); // offsetWidth
}
// insert the edit pencil
@@ -165,17 +171,23 @@
content.setAttribute( "dir", window.directionality );
content.innerHTML = section.text;
content.id = "content_block_" + section.id;
- transformer.transform( "addDarkModeStyles", content );
- transformer.transform( "hideRedLinks", content );
- transformer.transform( "setDivWidth", content );
- transformer.transform( "setMathFormulaImageMaxWidth", content );
- transformer.transform( "anchorPopUpMediaTransforms", content );
- transformer.transform( "hideIPA", content );
- transformer.transform( "hideRefs", content );
+
+ // Content service transformations
+ if (!window.fromRestBase) {
+ transformer.transform( "hideRedLinks", content );
+ transformer.transform( "setMathFormulaImageMaxWidth", content );
+ transformer.transform( "anchorPopUpMediaTransforms", content );
+ }
+
+ transformer.transform( "addDarkModeStyles", content ); // client setting
+ transformer.transform( "setDivWidth", content ); // offsetWidth
+ transformer.transform( "hideIPA", content ); // clickHandler
+ transformer.transform( "hideRefs", content ); // clickHandler
+
if (!window.isMainPage) {
- transformer.transform( "hideTables", content );
- transformer.transform( "addImageOverflowXContainers", content );
- transformer.transform( "widenImages", content );
+ transformer.transform( "hideTables", content ); // clickHandler
+ transformer.transform( "addImageOverflowXContainers", content ); //
offsetWidth
+ transformer.transform( "widenImages", content ); // offsetWidth
}
return [ heading, content ];
diff --git a/www/js/transforms.js b/www/js/transforms.js
index e32f8a4..b0d4b91 100644
--- a/www/js/transforms.js
+++ b/www/js/transforms.js
@@ -1,11 +1,11 @@
require("./transforms/addDarkModeStyles");
require("./transforms/addImageOverflowContainers");
-require("./transforms/anchorPopUpMediaTransforms");
+require("./transforms/service/anchorPopUpMediaTransforms");
require("./transforms/collapseTables");
require("./transforms/hideIpa");
-require("./transforms/hideRedLinks");
+require("./transforms/service/hideRedLinks");
require("./transforms/hideRefs");
-require("./transforms/relocateFirstParagraph");
-require("./transforms/setMathFormulaImageMaxWidth");
+require("./transforms/service/relocateFirstParagraph");
+require("./transforms/service/setMathFormulaImageMaxWidth");
require("./transforms/setDivWidth");
require("./transforms/widenImages");
diff --git a/www/js/transforms/anchorPopUpMediaTransforms.js
b/www/js/transforms/service/anchorPopUpMediaTransforms.js
similarity index 95%
rename from www/js/transforms/anchorPopUpMediaTransforms.js
rename to www/js/transforms/service/anchorPopUpMediaTransforms.js
index e98413b..2fb7b31 100644
--- a/www/js/transforms/anchorPopUpMediaTransforms.js
+++ b/www/js/transforms/service/anchorPopUpMediaTransforms.js
@@ -1,4 +1,4 @@
-var transformer = require("../transformer");
+var transformer = require("../../transformer");
transformer.register( "anchorPopUpMediaTransforms", function( content ) {
// look for video thumbnail containers (divs that have class
"PopUpMediaTransform"),
@@ -28,4 +28,4 @@
mediaDiv.parentNode.removeChild(mediaDiv);
containerLink.appendChild(imgTags[0]);
}
-} );
\ No newline at end of file
+} );
diff --git a/www/js/transforms/hideRedLinks.js
b/www/js/transforms/service/hideRedLinks.js
similarity index 89%
rename from www/js/transforms/hideRedLinks.js
rename to www/js/transforms/service/hideRedLinks.js
index 36c9af6..6c78bd9 100644
--- a/www/js/transforms/hideRedLinks.js
+++ b/www/js/transforms/service/hideRedLinks.js
@@ -1,4 +1,4 @@
-var transformer = require("../transformer");
+var transformer = require("../../transformer");
transformer.register( "hideRedLinks", function( content ) {
var redLinks = content.querySelectorAll( 'a.new' );
diff --git a/www/js/transforms/relocateFirstParagraph.js
b/www/js/transforms/service/relocateFirstParagraph.js
similarity index 98%
rename from www/js/transforms/relocateFirstParagraph.js
rename to www/js/transforms/service/relocateFirstParagraph.js
index f3f3eaf..7390e37 100644
--- a/www/js/transforms/relocateFirstParagraph.js
+++ b/www/js/transforms/service/relocateFirstParagraph.js
@@ -1,4 +1,4 @@
-var transformer = require("../transformer");
+var transformer = require("../../transformer");
// Move the first non-empty paragraph (and related elements) to the top of the
section.
// This will have the effect of shifting the infobox and/or any images at the
top of the page
diff --git a/www/js/transforms/setMathFormulaImageMaxWidth.js
b/www/js/transforms/service/setMathFormulaImageMaxWidth.js
similarity index 92%
rename from www/js/transforms/setMathFormulaImageMaxWidth.js
rename to www/js/transforms/service/setMathFormulaImageMaxWidth.js
index fe4f25b..890f3e1 100644
--- a/www/js/transforms/setMathFormulaImageMaxWidth.js
+++ b/www/js/transforms/service/setMathFormulaImageMaxWidth.js
@@ -1,4 +1,4 @@
-var transformer = require("../transformer");
+var transformer = require("../../transformer");
transformer.register( "setMathFormulaImageMaxWidth", function( content ) {
// Prevent horizontally scrollable pages by checking for math formula
images (which are
--
To view, visit https://gerrit.wikimedia.org/r/251539
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: Ibf76222d0ba10520797397fdbd95205c9f7d995b
Gerrit-PatchSet: 2
Gerrit-Project: apps/android/wikipedia
Gerrit-Branch: master
Gerrit-Owner: BearND <bsitzm...@wikimedia.org>
Gerrit-Reviewer: BearND <bsitzm...@wikimedia.org>
Gerrit-Reviewer: Brion VIBBER <br...@wikimedia.org>
Gerrit-Reviewer: Dbrant <dbr...@wikimedia.org>
Gerrit-Reviewer: Mholloway <mhollo...@wikimedia.org>
Gerrit-Reviewer: Niedzielski <sniedziel...@wikimedia.org>
Gerrit-Reviewer: jenkins-bot <>
_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
