Page MenuHomePhabricator
Create Task
Maniphest T147728

Switch article footer (read more etc) to use JS injection instead of native overlay
Closed, ResolvedPublic
Actions

Assigned To
Mhurd
Authored By
Mhurd
Oct 8 2016, 7:57 PM
Tags
Referenced Files
F7883054: Screen Shot 2017-05-02 at 4.33.39 PM.png
May 2 2017, 11:35 PM
F7883052: Screen Shot 2017-05-02 at 4.33.39 PM 2.png
May 2 2017, 11:35 PM
F7883056: Screen Shot 2017-05-02 at 4.33.39 PM 3.png
May 2 2017, 11:35 PM
F7474865: m.mov.gif
Apr 11 2017, 12:48 AM
Subscribers
ABorbaWMF
Aklapper
Dbrant
• Fjalapeno
• JMinor
JoeWalsh
Mhurd
• Niedzielski

Description

Benefits

  • No more native overlay hackery
  • Text side slider would cause footer (read more etc) text size to scale (presently the native overlay bits don't resize)

(I have proof of concept for the injection, and also shipped a version long ago that used css for the lead image in a way that cropped properly for face detection)

Note: this wouldn't change anything visually. It would just make everything on the article be rendered via the existing article DOM.
Also we could potentiall leverage the proxy server ease the JS injection.

I attached this as a parent task to the article pinch-zoom ticket.

Related Objects
Search...

Event Timeline

Mhurd created this task.Oct 8 2016, 7:57 PM
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptOct 8 2016, 7:57 PM
Mhurd added a subtask: T141668: Evaluate using gestures to control font size of an article.Oct 8 2016, 7:58 PM
Mhurd added a subscriber: • JMinor.Oct 8 2016, 8:02 PM

@JMinor

Mhurd updated the task description. (Show Details)Oct 8 2016, 8:03 PM
Mhurd updated the task description. (Show Details)
Mhurd added a comment.Oct 8 2016, 8:06 PM

I'd really like to work on this! :)

• JMinor mentioned this in T152574: Implement dynamic text in article footer.Dec 7 2016, 12:29 AM
• JMinor added a comment.Mar 8 2017, 12:10 AM

@Mhurd ping for potential tech debt candidate...

• JMinor triaged this task as Medium priority.Mar 8 2017, 12:10 AM
Mhurd added a comment.Mar 8 2017, 12:11 AM

@JMinor oh thanks that's the one!

Mhurd added a project: iOS-app-v5.4.1-Patchy-Boot.Mar 8 2017, 12:12 AM
Mhurd updated the task description. (Show Details)Mar 8 2017, 12:15 AM
• JMinor moved this task from Tasks from Product Backlog to Needs Engineering Sync on the iOS-app-v5.4.1-Patchy-Boot board.Mar 20 2017, 6:51 PM
Mhurd added a comment.Mar 21 2017, 6:29 PM

Leaning towards scoping this to just the bottom native overlay for now, doing the lead image as a follow-on if needed.

• JMinor moved this task from Bug Backlog to Engineering Backlog on the Wikipedia-iOS-App-Backlog board.Mar 21 2017, 10:46 PM
• JMinor edited projects, added iOS-app-v5.5.0-Snake-On-A-Magic-Towel; removed iOS-app-v5.4.1-Patchy-Boot.Apr 3 2017, 6:57 PM
• JMinor moved this task from Tasks from Product Backlog to Needs Acceptance Criteria on the iOS-app-v5.5.0-Snake-On-A-Magic-Towel board.Apr 3 2017, 10:06 PM
• JMinor moved this task from Needs Acceptance Criteria to Needs Engineering Sync on the iOS-app-v5.5.0-Snake-On-A-Magic-Towel board.Apr 3 2017, 10:11 PM
Mhurd renamed this task from Switch lead image and article footer (read more etc) to use JS injection instead of native overlay to Switch article footer (read more etc) to use JS injection instead of native overlay.Apr 10 2017, 10:04 PM

@JMinor I updated the title to narrow the scope to just the footer.

Mhurd mentioned this in T149066: Regression: Article TOC should match article writing direction (RTL).Apr 10 2017, 10:06 PM
Mhurd added a comment.EditedApr 11 2017, 12:47 AM

I spent an hour or so this afternoon looking at my old "Read More" footer JS injection proof-of-concept and was able to get it working with the proxy server. Would need to clean and pretty it up and generalize it to server up the footer's Menu and License parts too, seems pretty straightforward.

Tap image for animation:

m.mov.gif (480×264 px, 3 MB)

Mhurd added a subscriber: JoeWalsh.Apr 11 2017, 1:11 AM

@JoeWalsh regarding the proxy server proof-of-concept from the comment above, I think we may actually want to do the Read More fetch and transform in pure JS - that way we could eventually move it to "applib" (as a JS transform which just gets passed the article url) so the Android folks could use it too, or even the MCS. Could simplify things a bit as well. I'll hold off on any more exploration with this until we can chat, but I imagine a spike to implement a proof-of-concept JS transform would be pretty easy.

Mhurd claimed this task.Apr 11 2017, 6:19 PM
Mhurd moved this task from Needs Engineering Sync to Doing on the iOS-app-v5.5.0-Snake-On-A-Magic-Towel board.
Mhurd added a comment.Apr 12 2017, 2:48 AM

@JoeWalsh I got the API proxy bits working the way you suggested was able to hook up a JS transform too. I'll try to get it cleaned up tomorrow.

Mhurd added a comment.Apr 12 2017, 11:24 PM

https://github.com/wikimedia/wikipedia-ios/pull/1334

Diffusion mentioned this in rAPIOScf0cad523ca4: Merge branch 'develop' into refactor/native-footer-to-js/T147728.Apr 13 2017, 6:21 PM
Diffusion mentioned this in rAPIOS69d9740b3eb6: Merge branch 'develop' into refactor/native-footer-to-js/T147728.Apr 13 2017, 11:18 PM
Diffusion mentioned this in rAPIOS61d2066389a3: Merge branch 'develop' into refactor/native-footer-to-js/T147728.Apr 18 2017, 2:21 AM
Diffusion mentioned this in rAPIOSc8e59fe385e0: Merge branch 'develop' into refactor/native-footer-to-js/T147728.Apr 18 2017, 6:56 PM
Diffusion mentioned this in rAPIOS1cc1be8c4f49: Merge branch 'develop' into refactor/native-footer-to-js/T147728.Apr 18 2017, 8:27 PM
Diffusion mentioned this in rAPIOSe4c8e9ea872d: Merge branch 'develop' into refactor/native-footer-to-js/T147728.Apr 19 2017, 8:16 AM
Diffusion mentioned this in rAPIOS4400db6f97fb: Merge branch 'develop' into refactor/native-footer-to-js/T147728.Apr 19 2017, 8:52 PM
Diffusion mentioned this in rAPIOS486d0270652d: Merge branch 'develop' into refactor/native-footer-to-js/T147728.Apr 20 2017, 4:59 PM
Diffusion mentioned this in rAPIOS259f7c60bcec: Merge branch 'develop' into refactor/native-footer-to-js/T147728.Apr 20 2017, 6:42 PM
Diffusion mentioned this in rAPIOS79b5a66d18c3: Merge branch 'develop' into refactor/native-footer-to-js/T147728.Apr 21 2017, 12:03 PM
Mhurd mentioned this in rAPIOS7fb5c3c85d9c: Merge branch 'develop' into refactor/native-footer-to-js/T147728.Apr 21 2017, 6:44 PM
JoeWalsh mentioned this in rAPIOSa2973ed24fae: Merge branch 'develop' into refactor/native-footer-to-js/T147728.Apr 21 2017, 7:47 PM
Mhurd mentioned this in rAPIOS58ff1456c365: Merge branch 'refactor/native-footer-to-js/T147728' of https://github..Apr 21 2017, 9:03 PM
JoeWalsh mentioned this in rAPIOS05c5131631fb: Merge branch 'develop' into refactor/native-footer-to-js/T147728.Apr 24 2017, 3:28 PM
Diffusion mentioned this in rAPIOSa827a13057a1: Merge branch 'develop' into refactor/native-footer-to-js/T147728.Apr 24 2017, 6:58 PM
Mhurd mentioned this in rAPIOSb404d2d981a8: Merge branch 'develop' into refactor/native-footer-to-js/T147728.Apr 24 2017, 10:20 PM
Mhurd mentioned this in rAPIOS688385aa727c: Merge branch 'develop' into refactor/native-footer-to-js/T147728.Apr 25 2017, 5:58 PM
• Niedzielski added a project: wikimedia-page-library.Apr 25 2017, 11:07 PM
• Niedzielski moved this task from Open to Doing on the wikimedia-page-library board.
Diffusion mentioned this in rAPIOScc560930911b: Merge branch 'develop' into refactor/native-footer-to-js/T147728.Apr 26 2017, 1:54 AM
Diffusion mentioned this in rAPIOS5fe0da7f6e50: Merge branch 'develop' into refactor/native-footer-to-js/T147728.Apr 26 2017, 4:13 PM
Diffusion mentioned this in rAPIOS8a24f6f8782a: Merge branch 'develop' into refactor/native-footer-to-js/T147728.Apr 26 2017, 5:33 PM
Diffusion mentioned this in rAPIOSbae1f1cee658: Merge branch 'develop' into refactor/native-footer-to-js/T147728.Apr 26 2017, 8:45 PM
JoeWalsh mentioned this in rAPIOS7bb89742fad9: Merge branch 'develop' into refactor/native-footer-to-js/T147728.Apr 26 2017, 8:53 PM
Mhurd moved this task from Doing to Needs Code Review on the iOS-app-v5.5.0-Snake-On-A-Magic-Towel board.Apr 26 2017, 11:49 PM
JoeWalsh mentioned this in rAPIOS7f7eac602ffa: Merge branch 'develop' into refactor/native-footer-to-js/T147728.Apr 27 2017, 4:37 PM
JoeWalsh mentioned this in rAPIOSb920822043ae: Merge pull request #1334 from wikimedia/refactor/native-footer-to-js/T147728.Apr 27 2017, 4:49 PM
Mhurd moved this task from Needs Code Review to Needs Testing Criteria on the iOS-app-v5.5.0-Snake-On-A-Magic-Towel board.Apr 27 2017, 6:06 PM
• Niedzielski moved this task from Doing to Open on the wikimedia-page-library board.Apr 27 2017, 10:09 PM
cmadeo created subtask T164105: Footer design .Apr 28 2017, 7:02 PM
Mhurd added a comment.EditedMay 2 2017, 11:35 PM

Testing criteria:

NOTE: these testing criteria are about the functionality of the footer. That is, the way we build the footer has changed so we want to double-check that everything in the footer still appears and responds to taps appropriately.

Footer "About this article" menu

  • Load the "enwiki > Lake Superior" article
  • Tap the table of contents icon
  • Choose "About this article" from near the bottom of the table of contents list
  • Ensure a menu appears beneath the "ABOUT THIS ARTICLE" header
  • Ensure the items in the menu respond to taps appropriately

Screen Shot 2017-05-02 at 4.33.39 PM 2.png (1×862 px, 200 KB)

Footer "Read more" items

  • Load the "enwiki > Lake Superior" article
  • Tap the table of contents icon
  • Choose "Read more" from near the bottom of the table of contents list
  • Ensure some read more articles appear beneath the "READ MORE" header
  • Ensure the read more items "Save for later" button works
NOTE: the read more cards design is undergoing tweaks - the read more cards will probably be stacked vertically instead of side-to-side as they are in the screenshot below.

Screen Shot 2017-05-02 at 4.33.39 PM.png (1×862 px, 194 KB)

Footer "Legal"

  • Load the "enwiki > Lake Superior" article
  • Scroll to the very bottom of the article
  • Ensure the "CC BY-SA 3.0" link responds to taps appropriately

Screen Shot 2017-05-02 at 4.33.39 PM 3.png (1×862 px, 192 KB)

Mhurd moved this task from Needs Testing Criteria to Needs QA on the iOS-app-v5.5.0-Snake-On-A-Magic-Towel board.May 2 2017, 11:38 PM
• Niedzielski moved this task from Open to Phase One on the wikimedia-page-library board.May 3 2017, 10:15 PM
ABorbaWMF moved this task from Needs QA to Ready for PM Signoff on the iOS-app-v5.5.0-Snake-On-A-Magic-Towel board.May 5 2017, 4:18 PM
ABorbaWMF subscribed.

Tested on an iPhone 7+ with iOS 10.3 and an iPad Mini 2 Retina on Beta App 5.5.0 (1129)

This is fixed

• Niedzielski added subscribers: • Fjalapeno, Dbrant, • Niedzielski.May 8 2017, 5:05 PM

@Mhurd, FYI @Dbrant reports that XHRs work on our oldest Android devices!

/cc @Fjalapeno

Mhurd added a comment.May 8 2017, 5:44 PM

@Niedzielski Oh that's great!!!

• Niedzielski edited projects, added wikimedia-page-library-tshirt; removed wikimedia-page-library.May 11 2017, 9:30 PM
• JMinor closed this task as Resolved.May 23 2017, 9:10 PM
cmadeo closed subtask T141668: Evaluate using gestures to control font size of an article as Declined.Dec 8 2020, 9:23 PM
cmadeo closed subtask T164105: Footer design as Resolved.Dec 8 2020, 9:37 PM
Content licensed under Creative Commons Attribution-ShareAlike (CC BY-SA) 4.0 unless otherwise noted; code licensed under GNU General Public License (GPL) 2.0 or later and other open source licenses. By using this site, you agree to the Terms of Use, Privacy Policy, and Code of Conduct. · Wikimedia Foundation · Privacy Policy · Code of Conduct · Terms of Use · Disclaimer · CC-BY-SA · GPL