Tab Nesting Supporting Horizontal Tabs

Dayanto

Tab nesting is something that's been requested quite a few times, however the proposed solutions we've seen so far haven't been able to deal with tab hierarchies in a horizontal layout, which is important for consistency if it's going to be a proper feature.

In order to address that, I'm proposing two changes to how tab stacks work:

Adding the ability to open tab stacks in the tab bar as a separate nested context.
Allowing stacking within tab stacks in order to create stack hierarchies.

The basic idea is to have something similar to the expandable tab stacks from the old Opera, but without mixing tabs from different depths (to keep things clean and hierarchical).

Each tab stack gets a button that expands its internal tab structure.
In order to navigate out of a tab stack, I decided to place a return button on the left side of the tab bar, which also can function as a drop target for tabs. (there are other ways of doing it, but this seemed like the most straight forward method)

Root level

Inside a tab stack

Opening / closing animations

Multiple levels

Other than that:

This solution works both horizontally and vertically.
The Window panel can already provide a hierarchical overview similar to that of TreeStyleTab. It just needs nesting to be enabled.
To speed up tab organization, it could be worth considering hover navigation (while dragging) similar to how drag and drop between tabs currently works.

Other options:

Inside the preview popup
Double click on a tab

luetage

@dayanto That's actually a nice idea – better than looking at a row of popup thumbnails for sure.

Pesala

I edited the thread title to make it clear and concise

I don't think there is any need for a button to navigate out of the tab stack:

Clicking or hovering at tab-stack would show all of the tabs in the stack. If there were a lot, they would just shrink to fit the Tab Bar as regular tabs do.
Moving the mouse cursor off of the tab bar (before or after selecting a new tab in the stack) would show the root tabs as usual.

The problem with buttons on tabs is that it gets confusing with the other buttons for mute or close, and it takes more time can care to hit the button than it does to simply move the cursor away from the tab bar.

Dayanto

@Pesala I guess I should've made the focus more clear. The purpose was to create a UI solution for hierarchical (i.e. tree-structured) tabs that's compatible with tab stacks and a horizontal layout. (it's essentially a hybrid between TreeStyleTabs, Firefox's Tab Groups and Tab Stacks)

Basically, I want to be able to do this:

Pesala

@dayanto I don't find that the animations make it any clearer.

My point was only that we don't need a button to open/close the tab-stacks — mouseover alone is enough.

Tabs Stacked

Tne New Tab button would add a new tab.

Tabs Unstacked on Mouseover

Instead of showing the tab preview thumbnails would expand the tab-stack like this

The New Tab button would add a new tab inside the tab-stack.

Moving the mouse off of the Tab Bar would show the tab-stack collapsed again.

luetage

@pesala Mouseover would be suboptimal, because you could potentially mouseover a stack that opens over a stack in the next level, which would bring you down 2 levels instead of 1. And sorry, but the animation makes it very clear. OP did a good job with it. I guess we have to disagree on this

Pesala

@luetage You cannot disagree with what I said, which was: I don't find that the animations make it any clearer. I still don't, and I have looked at them carefully, extracted all frames and looked at them in IrfanView.

I agree that mouseover could be tricky if nested tab-stacks within tab-stacks were allowed (overkill IMO). Clicking the tab would be better. It sure beats clicking a tiny button to expand/collapse a tab-stack like in Opera 12.18.

Ornorm

@pesala For me, the tab preview as it exist now is something to keep in any case. Otherwise, we would have a visual regression and we would need to "unstack" our stacks individually to see what's in there.

Pesala

@ornorm For me too, the Tab Previews already perform the task of easily selecting tabs within a stack. I don't use Tab Thumbnails, but I do use the Popup Thumbnail, which are useful for inactive tabs and tab-stacks.

I think this Feature Request becomes more useful for users who open dozens or hundreds of tabs.

Again, if a click opened the tab-stack, mouseover could still show the previews for those who enable them. One would perhaps have to disable "Minimize Active Tab" on click if Nest Tabs was enabled.

As with most feature requests, it should probably be optional rather than the default.

Dayanto

@pesala Yes, the main point is be able to deal with multiple levels of hierarchies. (We can disagree about whether that's necessary, but that was the intent) I wanted to bring a new perspective to the discussion about hierarchical tabs so that it actually eventually might be implemented one day.

Managing tabs or doing more or less anything becomes quite a nuisance if the hierarchy collapses, because you'd need to keep retraversing it for every action. With single level stacks, it may be preferable, but as you've mentioned, previews already fill that purpose.

By switching context rather than just temporarily expanding the tab stack, you can also isolate the focus on the things that are relevant to what you're currently doing. It provides a static overview, so that you don't need to keep hovering the tab stack to see what's in there, and makes manipulating the internal tabs as natural as if they were in a separate window.

Dayanto

@pesala What if we hid the button that opens tab stacks in the preview popup? Then it can both be larger and stay completely invisible most of the time.

Pesala

@dayanto Some users may have Popup Thumbnails disabled, in which case they would never see the buttons.

Dayanto

@pesala Sure. I think it could be useful to have another method, such as double click, as a backup both in the case when someone has previews disabled and to reduce travel distance when navigating quickly.

Edit: I also think it could be useful to have the option to have previews without thumbnails.

Pesala

@dayanto I hope the developers can work something out, but it's quite a challenge to make it work well for all scenarios.

Someone already requested Large Previews, i.e. showing the entire tab on hover.

avogadroguac

Another way to do this would be to upgrade the new 2-Level Tab Stack feature to N-Level Tab Stacks. The double tab bar would display the tab stack you're in and the one above it, allowing easy navigation up and down the hierarchy.