785489 - Work - Metro Firefox tab bar should be scrollable with the mouse

Status: RESOLVED FIXED

(Firefox for Metro Graveyard :: General, defect)

Description

[Brian R. Bondy [:bbondy]]

Currently there is no way to get to your tabs other than keyboard shortcuts.  
Previews are only visible for the first 5 tabs. 

Maybe there should be a little left arrow and right arrow indicator to scroll through the tabs.  If so where should they be positioned? Together on the right hand side or like on Desktop with the left button on the left side of the window and the right button on the right side of the window?

CC'ing yuan for feedback.

Comment 1

[Matt Brubeck (:mbrubeck)]

You can already scroll the tab bar to see more tabs, but only in touch mode (or with metro.debug.treatmouseastouch).  We need to add a way to scroll it with the mouse.  Mouse wheel support would be good too.

Comment 2

[Matt Brubeck (:mbrubeck)]

Yuan, should we display scroll arrows next to the tab bar when a mouse is in use?  If so, can we get some arrow graphics to use?

Comment 3

[Yuan Wang(:Yuan) – Mobile Firefox Design Lead]

Attachment: UX Design Tab Overflow in thumbnail view

Solutions for Metro Preview

Comment 4

[Yuan Wang(:Yuan) – Mobile Firefox Design Lead]

Based on the conversation we had, we will use arrow icons when mouse is in use. 
CCing Stephen to get graphics.
The arrow icon should have 4 states: 
Normal(no ring)
Disable(no ring. Used when there is no more tab to scroll)
Hover-over, Press-down (de-emphasized ring should be used, the same with the existing icons in app bar)

Comment 5

[Yuan Wang(:Yuan) – Mobile Firefox Design Lead]

Attachment: Arrow icons [temp]

Temporary icons to support implementation. 
Needs Stephen to review and produce final version.

Comment 6

[Matt Brubeck (:mbrubeck)]

Attachment: patch

This patch adds basic functionality: The arrow buttons appear when the mouse is in use and disappear when touch input is in use (this depends on bug 794985), and they can be used to scroll the tab bar.

This uses the temporary artwork from Yuan's attachment. We probably want to adjust the layout a bit once we get the final graphics.

Comment 7

[Jim Mathies [:jimm]]

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

This works for me. Fryn might have additional comments but approving for now so we can get it into tonight's build.

I think a transition would be better for hide/display rather than popping these in, they tends to jar the tab bar. Maybe file a follow up on that.

Comment 8

[Jim Mathies [:jimm]]

Also, image file is missing from the posted patch.

Comment 9

[Matt Brubeck (:mbrubeck)]

https://hg.mozilla.org/projects/elm/rev/7d241895cfd9

Let's file follow-ups to tweak the design further.

Comment 10

[Frank Yan (:fryn)]

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

Review of attachment 665581 [details] [diff] [review]:
-----------------------------------------------------------------

::: browser/metro/base/content/browser.xul
@@ +121,5 @@
>  
>    <keyset id="mainKeyset">
>      <!-- basic navigation -->
>      <key id="key_back" keycode="VK_LEFT" command="cmd_back" modifiers="control"/>
> +    <key id="key_back" keycode="VK_LEFT" command="cmd_back" modifiers="control"/>

Was this intentional?

Comment 11

[Matt Brubeck (:mbrubeck)]

(In reply to Frank Yan (:fryn) from comment #10)
> Was this intentional?

No. Removed in a followup: https://hg.mozilla.org/projects/elm/rev/7671b1b145ac

Comment 12

[Matt Brubeck (:mbrubeck)]

Resolving bugs in the Firefox for Metro product that are fixed on the elm branch.  Sorry for the bugspam.  Search your email for "bugspam-elm" if you want to find and delete all of these messages at once.