606565 - create android style menu-button menu

Status: VERIFIED FIXED

(Firefox for Android Graveyard :: General, defect)

Description

[Madhava Enros [:madhava]]

When the user presses the Android hardware menu button, we can put up a native-style menu, that will link to bits of the Fennec UI, as in this mockup:

http://www.flickr.com/photos/madhava_work/5105182033/sizes/l/

Comment 1

[Madhava Enros [:madhava]]

Well need android-style versions of our icons for this. CCing Sean.

Comment 2

[Mark Finkle (:mfinkle) (use needinfo?)]

I think this will be welcomed by Android users

Comment 3

[Vivien Nicolas (:vingtetun) (:21) - (NOT reading bugmails, needinfo? please)]

I like having a direct shortcuts associated to this button. We can have 2 actions associated with this:
 - normal tap: show the proposed menu
 - long tap: directly show the site menu

I've opened a platform bug (bug 608594) and a fix for allowing 2 actions.

Btw, we can also have 2 actions for the back button (the stock browser does that) but I'm not sure which one to assign to the long tap.

Comment 4

[Madhava Enros [:madhava]]

Per discussion with mbrubeck in IRC - let's continue to display the titlebar, if it's off screen, when we show the menu at the bottom of the screen.  So, this is like the current fennec behavior, except without the site menu deployed.

Comment 5

[Matt Brubeck (:mbrubeck)]

Attachment: WIP

Comment 6

[Matt Brubeck (:mbrubeck)]

Attachment: screenshot

A very early working prototype.  Still to do:

- Icons.
- Two-row layout for portrait mode.
- Handle overflow with a "More" button and a popup.
- Different menus for different UI screens.
- Animated transition?

Comment 7

[Mark Finkle (:mfinkle) (use needinfo?)]

We would take a minimal impl for Fennec 4

Comment 8

[Madhava Enros [:madhava]]

For the minimal implementation, I'd personally take
- no overflow handling (can pick this up in a followup point release)
- no animated transition, though it pains me to say it
- just this menu for the main screen, not others for other screens (again, fuller implementation next time)

We _will_ need portrait and landscape versions, and the icons.

Comment 10

[Matt Brubeck (:mbrubeck)]

Attachment: patch

This patch implements a menu for the main screen only.  Pressing the menu button in the tool panel or awesomescreen does nothing.

The menu has correct layouts in landscape and portrait for up to 6 buttons.  It does not handle overflow for >6 buttons.  (There are four buttons by default, but add-ons could insert more.)

This patch uses existing toolbar icons.  I had to resize the "add-ons" icon to give it the same dimensions as the others.  (The image itself is unchanged; I just centered it in a slightly larger transparent background.)

Comment 11

[Matt Brubeck (:mbrubeck)]

Attachment: screenshot: portrait

Comment 12

[Matt Brubeck (:mbrubeck)]

Attachment: screenshot: landscape

Comment 13

[Mark Finkle (:mfinkle) (use needinfo?)]

Comment on attachment 489226 [details] [diff] [review]
patch

using "android" in the code and xul is less than desirable. This is the closest thing we have to a Firefox "menu" like on desktop, which is called "appmenu". Could we change the ID's to appmenu-* and the JS class to ApplicationMenu?

Remember to add the string for "Site Options"

Comment 14

[Matt Brubeck (:mbrubeck)]

Here are some specs for this feature:
https://wiki.mozilla.org/Mobile/Projects/PlatformIntegration#App_Menu

Comment 15

[Matt Brubeck (:mbrubeck)]

(In reply to comment #13)
> using "android" in the code and xul is less than desirable. This is the closest
> thing we have to a Firefox "menu" like on desktop, which is called "appmenu".
> Could we change the ID's to appmenu-* and the JS class to ApplicationMenu?
>
> Remember to add the string for "Site Options"

Pushed, with both of these fixes:
http://hg.mozilla.org/mobile-browser/rev/4fe8d35b7f59

I will file followup bugs for better icons, handling overflow, animated transitions, and anything else that comes up.  (Only the icons should be blocking release.)

Comment 16

[Aakash Desai [:aakashd]]

verified FIXED on build:

Mozilla/5.0 (Android; Linux armv71; rv:2.0b8pre) Gecko/20101110 Namoroka/4.0b8pre Fennec/4.0b3pre

Comment 17

[Ayan Shah[:ashah]]

https://litmus.mozilla.org/show_test.cgi?id=13798
https://litmus.mozilla.org/show_test.cgi?id=13799
https://litmus.mozilla.org/show_test.cgi?id=13800
https://litmus.mozilla.org/show_test.cgi?id=13802
https://litmus.mozilla.org/show_test.cgi?id=13803
https://litmus.mozilla.org/show_test.cgi?id=13804