Can't access user notifications settings in mobile layout

[Aaron Wells]

While working on Bug 1620879, I noticed that the user settings subnavigation links aren't accessible when Mahara's responsive theme shifts to the narrower "mobile" layout. This is true in 15.04 through 16.10dev.

Prior to Bug 1620879, the subnavigation links in question are just "Settings" ( "account/index.php" )and "Notifications" ( htdocs/account/activity/preferences/index.php ). You can get to the "Settings" page easily enough in mobile by clicking the settings gear icon in the page header. But in desktop mode, the main user settings page has a subnav (generated by the "right_nav()" function in htdocs/lib/web.php) that lets you switch from "Settings" to "Notifications". In mobile, that subnav doesn't display, and it's not part of the "hamburger" menus either.

In Bug 1620879 I'm adding a "Web services" link at the same nav level as "Settings" and "Notifications", to allow users to manage their webservices authorizations. Since these users are already on mobile devices, it becomes more important that they're able to access this submenu on mobile.

[Aaron Wells (u-aaronw)]

To replicate:

1. Open Mahara in a mobile browser, on in a desktop browser window that has been shrunk narrow enough that the normal tab navigation disappears and is replaced by the "hamburger" menu navigation.

2. Log in as any user

3. In the top bar of the page, click the gear icon (between the person icon [profile] and envelope icon [inbox])

4. You should now be on the user's "Settings" page.

Expected result: Somewhere on the page is a navigation link to "Notifications", to take you to the user's notifications settings page.

Actual result: There is no visible "Notifications" link on the page.

[Aaron Wells (u-aaronw)]

I added some screenshots to avoid any confusion about what I'm talking about.

1. The first screenshot shows the User Settings page at full width, with the user notifications link circled in red.

2. In the next screenshot, the window has been narrowed, and some of the links in the upper-left header are now just icons. But the Notifications link is still there.

3. In the third screenshot, the window has been narrowed enough that theme has collapsed into the "mobile" layout. Most of the navigation links are now hidden in the "hamburger" menu. No link to the User Notifications page can be found, on the page or in the hamburger.

I'm not sure where the Notifications link (and other potential links in the same menu) should be displayed, in mobile mode. It doesn't seem like it belongs in the hamburger menu, because the hamburger isn't really meant to change from one page to the next (I think). Perhaps it would make the most sense to just put the links underneath the page header, similar to where they are in the non-mobile layout.

[Mahara Bot (dev-mahara)]

Patch for "master" branch: https://reviews.mahara.org/6977