Page MenuHomePhabricator

mobile-html: update footer with updated design
Open, NormalPublic

Description

Background information

The design of the mobile-html footer was updated in T226094 to unify the look across both platforms

What

  1. Update the page footer to match the new design in T226094.
  2. Save buttons were removed so any functionality related to the save buttons and article saved state can be removed.
  3. Allow clients to pass in page fragments for the sections that will be added so they can add the corresponding sections to the table of contents. The interface would change from:
pagelib.c1.Footer.add({
...
  menuItems: [pagelib.c1.Footer.MenuItemType.languages, pagelib.c1.Footer.MenuItemType.lastEdited, pagelib.c1.Footer.MenuItemType.pageIssues, pagelib.c1.Footer.MenuItemType.disambiguation, pagelib.c1.Footer.MenuItemType.talkPage, pagelib.c1.Footer.MenuItemType.referenceList],
...
  readMore: { 
    itemCount: 3,
    baseURL: 'https://en.wikipedia.org/api/rest_v1'
  }
})

to

pagelib.c1.Footer.add({
...
  menu: {
    items: [pagelib.c1.Footer.MenuItemType.languages, pagelib.c1.Footer.MenuItemType.lastEdited, pagelib.c1.Footer.MenuItemType.pageIssues, pagelib.c1.Footer.MenuItemType.disambiguation, pagelib.c1.Footer.MenuItemType.talkPage, pagelib.c1.Footer.MenuItemType.referenceList],
    fragment: 'about_this_article'
  },
...
  readMore: {
    fragment: 'read_more',
    itemCount: 3,
    baseURL: 'https://en.wikipedia.org/api/rest_v1'
  }
})

Event Timeline

JoeWalsh created this task.Aug 7 2019, 3:55 PM
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptAug 7 2019, 3:55 PM
JoeWalsh updated the task description. (Show Details)Aug 10 2019, 10:28 AM
bearND removed bearND as the assignee of this task.Aug 14 2019, 6:07 PM
bearND added subscribers: schoenbaechler, cmadeo, Dbrant and 3 others.

Not sure who to best ping about this at this time.

It would be helpful to spell out what has to be done on the mobile-html or page library side for this task.

  1. Save buttons removed

If we just want the save buttons to be removed then we just could have the native side not call pagelib.c1.Footer.updateReadMoreSaveButtonForTitle() anymore or stop doing anything for the ReadMoreTitlesRetrieved action. Or would you like the page lib to remove sending the ReadMoreTitlesRetrieved action?

  1. Add Read More section to TOC

Currently the Android app adds a fake ToC entry at the end of the list for "About this article" in the ToCHandler.java file. Do we want to stop doing that? I'm not claiming that this is the cleanest solution. It's an option. Not sure what the iOS app is doing for this.
(This may be related to/dependent on T230035 if we decide to move getting the ToC from the pagelib instead of the metadata endpoint.)
Alternatively, I suspect whatever we end up doing for getting ToC info to the native side we could add it there as well.

JoeWalsh updated the task description. (Show Details)Fri, Aug 23, 6:05 PM
JoeWalsh updated the task description. (Show Details)Fri, Aug 23, 6:35 PM
MSantos claimed this task.Mon, Aug 26, 11:52 AM

@JoeWalsh I don't understand how the 3rd bullet point is related to the footer design, it seems to be related to the edit/preview feature, am I correct?

  1. Allow clients to pass in page fragments for the sections that will be added so they can add the corresponding sections to the table of contents.
JoeWalsh updated the task description. (Show Details)Mon, Aug 26, 12:48 PM

@MSantos I updated the description to clarify - the pagelib.c1.Footer.add interface would change to allow clients to pass in fragments for the sections so they are able to use them to scroll to the corresponding sections. This is just a proposal, feel free to suggest changes if you have a better idea for this or any other part of the footer interface.

MSantos added a comment.EditedThu, Aug 29, 9:11 PM

PR: https://github.com/wikimedia/wikimedia-page-library/pull/245

@cmadeo in the PR I posted some pictures, I would appreciate if you take a look at it.

The only thing that I think is missing is the Wikipedia logo color update, which is also a base64 image.

Thanks for sharing these images with me @MSantos, will final styling occur on the client side or should I do a full design critique against the iOS and Android proposed mocks?

Thanks for sharing these images with me @MSantos, will final styling occur on the client side or should I do a full design critique against the iOS and Android proposed mocks?

Probably better to wait for these changes to be reviewed and available for a full design critique against the mocks. Thanks!